/**  * Samsung Fonts - LOCAL (Fallback da CDN)  * Performance:Self-hosted per evitare 503 da cdn.samsung.com  */   @font-face{ font-family:'SamsungOne'; src:url('/assets/fonts/SamsungOne-400.woff2') format('woff2'), url('/assets/fonts/SamsungOne-400.woff') format('woff'); font-weight:400; font-style:normal; font-display:swap;}  @font-face{ font-family:'SamsungOne'; src:url('/assets/fonts/SamsungOne-700.woff2') format('woff2'), url('/assets/fonts/SamsungOne-700.woff') format('woff'); font-weight:700; font-style:normal; font-display:swap;}  @font-face{ font-family:'SamsungSharp'; src:local('Arial Black'), local('Arial-Black'), local('Helvetica Bold'); font-weight:700; font-style:normal; font-display:swap;}  .font-samsung-fallback{ font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif;}/*  * Samsung Ultra-Modern Design System  * Main CSS - Design tokens,base styles,utilities  */  /* ===================================  CSS Custom Properties (Design Tokens)  Samsung Official Style  =================================== */ :root{  --samsung-blue:#1428A0; --samsung-blue-dark:#0A1E5A; --samsung-blue-light:#2E5CCC;   --color-black:#000000; --color-white:#FFFFFF; --color-gray-100:#F8F8F8; --color-gray-200:#F4F4F4; --color-gray-300:#E5E5E5; --color-gray-400:#D1D1D1; --color-gray-500:#9E9E9E; --color-gray-600:#767676; --color-gray-700:#545454; --color-gray-800:#333333; --color-gray-900:#1A1A1A;   --color-bg-primary:#FFFFFF; --color-bg-secondary:#F8F8F8; --color-bg-dark:#000000; --color-bg-gray:#F4F4F4;   --color-text-primary:#000000; --color-text-secondary:#545454; --color-text-muted:#767676; --color-text-white:#FFFFFF;   --color-accent-blue:#1428A0; --color-accent-hover:#0A1E5A;   --shadow-sm:0 1px 2px 0 rgba(0,0,0,0.05); --shadow-md:0 4px 6px -1px rgba(0,0,0,0.1); --shadow-lg:0 10px 15px -3px rgba(0,0,0,0.1); --shadow-xl:0 20px 25px -5px rgba(0,0,0,0.1);   --space-xs:0.25rem; --space-sm:0.5rem; --space-md:1rem; --space-lg:1.5rem; --space-xl:2rem; --space-2xl:3rem; --space-3xl:4rem; --space-4xl:6rem;   --radius-sm:8px; --radius-md:12px; --radius-lg:16px; --radius-xl:24px; --radius-2xl:32px; --radius-full:9999px;   --font-samsung:'SamsungOne','SamsungSharp',-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif; --font-display:'SamsungSharp',var(--font-samsung); --font-body:'SamsungOne',var(--font-samsung);  --text-xs:0.75rem; --text-sm:0.875rem; --text-base:1rem; --text-lg:1.125rem; --text-xl:1.25rem; --text-2xl:1.5rem; --text-3xl:1.875rem; --text-4xl:2.25rem; --text-5xl:3rem; --text-6xl:3.75rem; --text-7xl:4.5rem;   --transition-fast:150ms cubic-bezier(0.4,0,0.2,1); --transition-base:300ms cubic-bezier(0.4,0,0.2,1); --transition-slow:500ms cubic-bezier(0.4,0,0.2,1); --transition-bounce:600ms cubic-bezier(0.34,1.56,0.64,1);   --z-base:1; --z-dropdown:100; --z-sticky:200; --z-overlay:300; --z-modal:400; --z-toast:500;} /* ===================================  CSS Reset & Base Styles  =================================== */ *,*::before,*::after{ box-sizing:border-box; margin:0; padding:0;} html{ font-size:16px; scroll-behavior:smooth; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;} body{ font-family:var(--font-body); font-size:var(--text-base); line-height:1.6; color:var(--color-text-primary); background:var(--color-bg-primary); overflow-x:hidden; position:relative;} h1,h2,h3,h4,h5,h6{ font-family:var(--font-display); font-weight:700; line-height:1.2; color:var(--color-text-primary); margin-bottom:var(--space-md);} h1{font-size:var(--text-6xl)}h2{font-size:var(--text-5xl)}h3{font-size:var(--text-4xl)}h4{font-size:var(--text-3xl)}h5{font-size:var(--text-2xl)}h6{font-size:var(--text-xl)} p{ margin-bottom:var(--space-md);} a{ color:var(--color-text-primary); text-decoration:none; transition:color var(--transition-fast);} a:hover{ color:var(--samsung-blue);} img,video{ max-width:100%; height:auto; display:block;} /* ===================================  Layout Utilities  =================================== */ .container{ width:100%; max-width:1280px; margin:0 auto; padding:0 var(--space-lg);} .container-fluid{ width:100%; padding:0 var(--space-lg);} .section{ padding:var(--space-4xl) 0; position:relative;} .section-hero{ min-height:100vh; display:flex; align-items:center; justify-content:center;}  .grid{ display:grid; gap:var(--space-lg);} .grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}  .flex{ display:flex;} .flex-col{ flex-direction:column;} .items-center{ align-items:center;} .justify-center{ justify-content:center;} .justify-between{ justify-content:space-between;} .gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.gap-xl{gap:var(--space-xl)} /* ===================================  Glassmorphism System  =================================== */ .glass{ background:var(--glass-bg); border:1px solid var(--glass-border); backdrop-filter:var(--backdrop-blur); -webkit-backdrop-filter:var(--backdrop-blur); box-shadow:var(--glass-shadow);} .glass-card{ background:var(--glass-bg); border:1px solid var(--glass-border); backdrop-filter:var(--backdrop-blur); -webkit-backdrop-filter:var(--backdrop-blur); box-shadow:var(--glass-shadow); border-radius:var(--radius-xl); padding:var(--space-xl); transition:all var(--transition-bounce); position:relative; overflow:hidden;} .glass-card::before{ content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.1),transparent); transition:left var(--transition-slow);} .glass-card:hover{ transform:translateY(-8px) scale(1.02); box-shadow:0 16px 48px 0 rgba(31,38,135,0.5); border-color:rgba(255,255,255,0.3);} .glass-card:hover::before{ left:100%;} /* ===================================  Typography Utilities  =================================== */ .text-gradient{ color:var(--samsung-blue);} .text-gradient-hero{ color:var(--color-black);} .text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right} .font-bold{font-weight:700}.font-semibold{font-weight:600}.font-medium{font-weight:500} /* ===================================  Spacing Utilities  =================================== */ .m-0{margin:0}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mt-xl{margin-top:var(--space-xl)}.mt-2xl{margin-top:var(--space-2xl)} .mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.mb-xl{margin-bottom:var(--space-xl)}.mb-2xl{margin-bottom:var(--space-2xl)} .p-0{padding:0}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.p-xl{padding:var(--space-xl)} /* ===================================  Display Utilities  =================================== */ .hidden{display:none}.block{display:block}.inline-block{display:inline-block} /* ===================================  Position Utilities  =================================== */ .relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky} /* ===================================  Responsive Breakpoints  =================================== */ @media (max-width:1024px){:root{ --text-6xl:3rem; --text-5xl:2.5rem; --text-4xl:2rem;}  .grid-cols-3, .grid-cols-4{ grid-template-columns:repeat(2,1fr);}  .section{ padding:var(--space-3xl) 0;}} @media (max-width:768px){:root{ --text-6xl:2.5rem; --text-5xl:2rem; --text-4xl:1.75rem; --space-4xl:3rem;}  .container, .container-fluid{ padding:0 var(--space-md);}  .grid-cols-2, .grid-cols-3, .grid-cols-4{ grid-template-columns:1fr;}  .section{ padding:var(--space-2xl) 0;}  h1{font-size:var(--text-5xl)} h2{font-size:var(--text-4xl)}} @media (max-width:480px){ html{ font-size:14px;}  .glass-card{ padding:var(--space-lg);}} /* ===================================  Animations Base  =================================== */ @keyframes fadeIn{ from{ opacity:0;} to{ opacity:1;}} @keyframes slideUp{ from{ opacity:0; transform:translateY(30px);} to{ opacity:1; transform:translateY(0);}} @keyframes pulse{ 0%,100%{ opacity:1;} 50%{ opacity:0.5;}} @keyframes spin{ from{ transform:rotate(0deg);} to{ transform:rotate(360deg);}} .animate-fadeIn{ animation:fadeIn var(--transition-base) ease-out;} .animate-slideUp{ animation:slideUp var(--transition-slow) ease-out;} /* ===================================  Accessibility  =================================== */ .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border-width:0;} :focus-visible{ outline:2px solid var(--color-neon-blue); outline-offset:2px;} /* ===================================  Print Styles  =================================== */ @media print{ body{ background:white; color:black;}  .no-print{ display:none !important;}}/*  * Advanced Animations - GSAP compatible  */   @keyframes fadeIn{ from{ opacity:0;} to{ opacity:1;}} @keyframes fadeInUp{ from{ opacity:0; transform:translateY(40px);} to{ opacity:1; transform:translateY(0);}} @keyframes fadeInDown{ from{ opacity:0; transform:translateY(-40px);} to{ opacity:1; transform:translateY(0);}} @keyframes fadeInLeft{ from{ opacity:0; transform:translateX(-40px);} to{ opacity:1; transform:translateX(0);}} @keyframes fadeInRight{ from{ opacity:0; transform:translateX(40px);} to{ opacity:1; transform:translateX(0);}}  @keyframes scaleIn{ from{ opacity:0; transform:scale(0.8);} to{ opacity:1; transform:scale(1);}} @keyframes scaleInRotate{ from{ opacity:0; transform:scale(0.5) rotate(-15deg);} to{ opacity:1; transform:scale(1) rotate(0);}}  @keyframes bounceIn{ 0%{ opacity:0; transform:scale(0.3);} 50%{ opacity:1; transform:scale(1.05);} 70%{ transform:scale(0.9);} 100%{ transform:scale(1);}}  @keyframes slideInLeft{ from{ transform:translateX(-100%);} to{ transform:translateX(0);}} @keyframes slideInRight{ from{ transform:translateX(100%);} to{ transform:translateX(0);}}  @keyframes spin{ from{ transform:rotate(0deg);} to{ transform:rotate(360deg);}} @keyframes spinSlow{ from{ transform:rotate(0deg);} to{ transform:rotate(360deg);}}  @keyframes pulse{ 0%,100%{ opacity:1; transform:scale(1);} 50%{ opacity:0.8; transform:scale(0.95);}} @keyframes pulseGlow{ 0%,100%{ box-shadow:0 0 20px rgba(102,126,234,0.5);} 50%{ box-shadow:0 0 40px rgba(102,126,234,0.8);}}  @keyframes float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-20px);}}  @keyframes wobble{ 0%,100%{ transform:translateX(0);} 25%{ transform:translateX(-10px) rotate(-5deg);} 75%{ transform:translateX(10px) rotate(5deg);}}  @keyframes shake{ 0%,100%{ transform:translateX(0);} 10%,30%,50%,70%,90%{ transform:translateX(-5px);} 20%,40%,60%,80%{ transform:translateX(5px);}}  @keyframes flipIn{ from{ transform:perspective(400px) rotateY(90deg); opacity:0;} to{ transform:perspective(400px) rotateY(0); opacity:1;}}  @keyframes gradientShift{ 0%{ background-position:0% 50%;} 50%{ background-position:100% 50%;} 100%{ background-position:0% 50%;}}  @keyframes glow{ 0%,100%{ box-shadow:0 0 20px rgba(102,126,234,0.5);} 50%{ box-shadow:0 0 40px rgba(102,126,234,0.8), 0 0 60px rgba(102,126,234,0.4);}}  @keyframes typing{ from{ width:0;} to{ width:100%;}} @keyframes blinkCursor{ 50%{ border-color:transparent;}}  @keyframes reveal{ from{ clip-path:inset(0 100% 0 0);} to{ clip-path:inset(0 0 0 0);}}  @keyframes particleFloat{ 0%,100%{ transform:translate(0,0);} 25%{ transform:translate(10px,-10px);} 50%{ transform:translate(-10px,-20px);} 75%{ transform:translate(-15px,-10px);}} /* ===================================  Utility Classes for Animations  =================================== */  .animate-fadeIn{ animation:fadeIn 0.6s ease-out;} .animate-fadeInUp{ animation:fadeInUp 0.8s ease-out;} .animate-fadeInDown{ animation:fadeInDown 0.8s ease-out;} .animate-fadeInLeft{ animation:fadeInLeft 0.8s ease-out;} .animate-fadeInRight{ animation:fadeInRight 0.8s ease-out;} .animate-scaleIn{ animation:scaleIn 0.5s cubic-bezier(0.34,1.56,0.64,1);} .animate-bounceIn{ animation:bounceIn 0.8s cubic-bezier(0.34,1.56,0.64,1);} .animate-pulse{ animation:pulse 2s ease-in-out infinite;} .animate-float{ animation:float 3s ease-in-out infinite;} .animate-spin{ animation:spin 1s linear infinite;} .animate-spinSlow{ animation:spinSlow 3s linear infinite;} .animate-glow{ animation:glow 2s ease-in-out infinite;} .animate-wobble{ animation:wobble 1s ease-in-out;} .animate-shake{ animation:shake 0.5s ease-in-out;}  .delay-100{animation-delay:100ms}.delay-200{animation-delay:200ms}.delay-300{animation-delay:300ms}.delay-400{animation-delay:400ms}.delay-500{animation-delay:500ms}.delay-600{animation-delay:600ms}.delay-700{animation-delay:700ms}.delay-800{animation-delay:800ms}  .duration-fast{animation-duration:300ms}.duration-base{animation-duration:500ms}.duration-slow{animation-duration:1s}  .scroll-reveal{ opacity:0; transform:translateY(40px);} .scroll-reveal.revealed{ opacity:1; transform:translateY(0); transition:all 0.8s cubic-bezier(0.4,0,0.2,1);}  .parallax{ transition:transform 0.1s ease-out;}  .hover-lift{ transition:transform var(--transition-base);} .hover-lift:hover{ transform:translateY(-8px);} .hover-glow{ transition:box-shadow var(--transition-base);} .hover-glow:hover{ box-shadow:0 0 30px rgba(102,126,234,0.6);} .hover-scale{ transition:transform var(--transition-base);} .hover-scale:hover{ transform:scale(1.05);}  @keyframes skeleton-loading{ 0%{ background-position:-200px 0;} 100%{ background-position:calc(200px + 100%) 0;}} .skeleton{ background:linear-gradient(  90deg, var(--glass-bg) 0px, rgba(255,255,255,0.1) 40px, var(--glass-bg) 80px  ); background-size:200px 100%; animation:skeleton-loading 1.5s ease-in-out infinite;}  .page-transition-enter{ opacity:0; transform:scale(0.95);} .page-transition-enter-active{ opacity:1; transform:scale(1); transition:opacity 0.3s,transform 0.3s;} .page-transition-exit{ opacity:1; transform:scale(1);} .page-transition-exit-active{ opacity:0; transform:scale(0.95); transition:opacity 0.3s,transform 0.3s;}  @media (prefers-reduced-motion:reduce){ *, *::before, *::after{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}}/*  * Button Components - Modern with hover effects  */   .btn{ display:inline-flex; align-items:center; justify-content:center; gap:var(--space-sm); padding:var(--space-md) var(--space-xl); font-family:var(--font-sans); font-size:var(--text-base); font-weight:600; line-height:1; text-align:center; border:none; border-radius:var(--radius-full); cursor:pointer; transition:all var(--transition-base); position:relative; overflow:hidden; text-decoration:none;} .btn:disabled{ opacity:0.5; cursor:not-allowed; pointer-events:none;}  .btn::before{ content:''; position:absolute; top:50%; left:50%; width:0; height:0; border-radius:50%; background:rgba(255,255,255,0.3); transform:translate(-50%,-50%); transition:width 0.6s,height 0.6s;} .btn:active::before{ width:300px; height:300px;}  .btn-primary{ background:var(--color-black); color:var(--color-white); box-shadow:none;} .btn-primary:hover{ background:var(--samsung-blue); color:var(--color-white); transform:translateY(-1px);}  .btn-secondary{ background:var(--color-white); color:var(--color-black); border:2px solid var(--color-white);} .btn-secondary:hover{ background:var(--samsung-blue); color:var(--color-white); border-color:var(--samsung-blue); transform:translateY(-2px);}  .btn-accent{ background:var(--samsung-blue); color:var(--color-white); box-shadow:none;} .btn-accent:hover{ background:var(--samsung-blue-dark); color:var(--color-white); transform:translateY(-1px);}  .btn-hero{ background:var(--color-black); color:var(--color-white); box-shadow:none; font-size:var(--text-lg); padding:var(--space-lg) var(--space-2xl);} .btn-hero:hover{ background:var(--samsung-blue); color:var(--color-white); transform:translateY(-2px);}  .btn-glow{ background:var(--color-black); color:var(--color-white);} .btn-glow:hover{ background:var(--samsung-blue); color:var(--color-white); transform:translateY(-1px);}  .btn-outline{ background:transparent; color:var(--color-black); border:2px solid var(--color-black);} .btn-outline:hover{ background:var(--color-black); color:var(--color-white); transform:translateY(-1px);}  .btn-icon{ padding:var(--space-md); border-radius:50%; width:48px; height:48px;} .btn-icon svg{ width:20px; height:20px;}  .btn-sm{ padding:var(--space-sm) var(--space-lg); font-size:var(--text-sm);} .btn-lg{ padding:var(--space-lg) var(--space-2xl); font-size:var(--text-lg);} .btn-xl{ padding:var(--space-xl) var(--space-3xl); font-size:var(--text-xl);}  .btn .icon{ width:20px; height:20px; transition:transform var(--transition-fast);} .btn:hover .icon{ transform:translateX(4px);}  .btn-loading{ pointer-events:none; position:relative;} .btn-loading::after{ content:''; position:absolute; width:16px; height:16px; border:2px solid rgba(255,255,255,0.3); border-top-color:white; border-radius:50%; animation:spin 0.6s linear infinite;}  .btn-group{ display:inline-flex; gap:var(--space-sm);} .btn-group .btn{ border-radius:var(--radius-md);} .btn-group .btn:first-child{ border-top-left-radius:var(--radius-full); border-bottom-left-radius:var(--radius-full);} .btn-group .btn:last-child{ border-top-right-radius:var(--radius-full); border-bottom-right-radius:var(--radius-full);}  @media (max-width:768px){ .btn{ padding:var(--space-sm) var(--space-lg); font-size:var(--text-sm);}  .btn-hero{ padding:var(--space-md) var(--space-xl); font-size:var(--text-base);}  .btn-group{ flex-direction:column; width:100%;}  .btn-group .btn{ width:100%; border-radius:var(--radius-full);}}/*  * Form Components - Samsung Style  * Componenti form con design Samsung:input,select,checkbox,radio,calendar  */   .form-group{ display:flex; flex-direction:column; gap:var(--space-sm); margin-bottom:var(--space-lg);} .form-group.required .form-label::after{ content:' *'; color:#E74C3C;}  .form-label{ font-size:var(--text-sm); font-weight:600; color:var(--color-text-primary); display:block;} .form-label-secondary{ font-size:var(--text-xs); font-weight:400; color:var(--color-text-secondary); margin-top:var(--space-xs);}  .form-input,.form-textarea,.form-select{ width:100%; padding:var(--space-md); font-family:var(--font-sans); font-size:var(--text-base); color:var(--color-text-primary); background:var(--color-white); border:2px solid var(--color-gray-300); border-radius:var(--radius-lg); transition:all var(--transition-base); outline:none;} .form-input:focus,.form-textarea:focus,.form-select:focus{ border-color:var(--samsung-blue); box-shadow:0 0 0 3px rgba(20,40,160,0.1);} .form-input:hover,.form-textarea:hover,.form-select:hover{ border-color:var(--samsung-blue);} .form-input::placeholder,.form-textarea::placeholder{ color:var(--color-text-secondary); opacity:0.7;}  .form-input:disabled,.form-textarea:disabled,.form-select:disabled{ background:var(--color-gray-100); color:var(--color-text-secondary); cursor:not-allowed; opacity:0.6;}  .form-input.error,.form-textarea.error,.form-select.error{ border-color:#E74C3C;} .form-input.error:focus,.form-textarea.error:focus,.form-select.error:focus{ box-shadow:0 0 0 3px rgba(231,76,60,0.1);}  .form-input.success,.form-textarea.success,.form-select.success{ border-color:#27AE60;} .form-input.success:focus,.form-textarea.success:focus,.form-select.success:focus{ box-shadow:0 0 0 3px rgba(39,174,96,0.1);}  .form-textarea{ min-height:120px; resize:vertical; line-height:1.6;}  .form-select{ appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23000000'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right var(--space-md) center; background-size:20px; padding-right:calc(var(--space-md) + 32px); cursor:pointer;}  .form-help-text{ font-size:var(--text-xs); color:var(--color-text-secondary); margin-top:var(--space-xs); display:block;}  .form-error-message{ font-size:var(--text-sm); color:#E74C3C; margin-top:var(--space-xs); display:flex; align-items:center; gap:var(--space-xs);} .form-error-message svg{ width:16px; height:16px; flex-shrink:0;}  .form-success-message{ font-size:var(--text-sm); color:#27AE60; margin-top:var(--space-xs); display:flex; align-items:center; gap:var(--space-xs);} .form-success-message svg{ width:16px; height:16px; flex-shrink:0;}  .form-checkbox,.form-radio{ display:flex; align-items:center; gap:var(--space-sm); cursor:pointer; user-select:none;} .form-checkbox input[type="checkbox"],.form-radio input[type="radio"]{ appearance:none; width:20px; height:20px; border:2px solid var(--color-gray-300); background:var(--color-white); cursor:pointer; transition:all var(--transition-base); flex-shrink:0;} .form-checkbox input[type="checkbox"]{ border-radius:var(--radius-sm);} .form-radio input[type="radio"]{ border-radius:50%;} .form-checkbox input[type="checkbox"]:checked,.form-radio input[type="radio"]:checked{ background:var(--samsung-blue); border-color:var(--samsung-blue);} .form-checkbox input[type="checkbox"]:checked::before{ content:''; display:block; width:12px; height:12px; margin:2px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M5 13l4 4L19 7'%3E%3C/path%3E%3C/svg%3E"); background-size:contain; background-position:center; background-repeat:no-repeat;} .form-radio input[type="radio"]:checked::before{ content:''; display:block; width:10px; height:10px; margin:3px; background:var(--color-white); border-radius:50%;} .form-checkbox input[type="checkbox"]:focus,.form-radio input[type="radio"]:focus{ outline:none; box-shadow:0 0 0 3px rgba(20,40,160,0.1);} .form-checkbox label,.form-radio label{ font-size:var(--text-sm); color:var(--color-text-primary); cursor:pointer;}  .form-checkbox-group,.form-radio-group{ display:flex; flex-direction:column; gap:var(--space-md);}  .form-input-group{ display:flex; align-items:stretch; width:100%;} .form-input-group .form-input{ flex:1; border-radius:0;} .form-input-group .form-input:first-child{ border-top-left-radius:var(--radius-lg); border-bottom-left-radius:var(--radius-lg);} .form-input-group .form-input:last-child{ border-top-right-radius:var(--radius-lg); border-bottom-right-radius:var(--radius-lg);} .form-input-addon{ display:flex; align-items:center; padding:0 var(--space-md); background:var(--color-gray-100); border:2px solid var(--color-gray-300); color:var(--color-text-secondary); font-size:var(--text-sm); white-space:nowrap;} .form-input-addon:first-child{ border-right:none; border-top-left-radius:var(--radius-lg); border-bottom-left-radius:var(--radius-lg);} .form-input-addon:last-child{ border-left:none; border-top-right-radius:var(--radius-lg); border-bottom-right-radius:var(--radius-lg);}  .form-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:var(--space-lg); margin-bottom:var(--space-lg);}  .booking-calendar{ background:var(--color-white); border:2px solid var(--color-gray-300); border-radius:var(--radius-xl); padding:var(--space-lg); max-width:400px; margin:0 auto;} .booking-calendar-header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:var(--space-lg); padding-bottom:var(--space-md); border-bottom:2px solid var(--color-gray-300);} .booking-calendar-header h3{ font-size:var(--text-lg); font-weight:600; color:var(--color-black); margin:0;} .booking-calendar-nav{ display:flex; gap:var(--space-sm);} .booking-calendar-nav button{ width:32px; height:32px; display:flex; align-items:center; justify-content:center; background:var(--color-gray-100); border:none; border-radius:var(--radius-md); cursor:pointer; transition:all var(--transition-base);} .booking-calendar-nav button:hover{ background:var(--samsung-blue); color:var(--color-white);} .booking-calendar-weekdays{ display:grid; grid-template-columns:repeat(7,1fr); gap:var(--space-xs); margin-bottom:var(--space-sm);} .booking-calendar-weekday{ text-align:center; font-size:var(--text-xs); font-weight:600; color:var(--color-text-secondary); padding:var(--space-xs);} .booking-calendar-days{ display:grid; grid-template-columns:repeat(7,1fr); gap:var(--space-xs);} .booking-calendar-day{ aspect-ratio:1; display:flex; align-items:center; justify-content:center; font-size:var(--text-sm); font-weight:500; background:var(--color-white); border:2px solid var(--color-gray-300); border-radius:var(--radius-md); cursor:pointer; transition:all var(--transition-base);} .booking-calendar-day:hover{ background:var(--color-gray-100); border-color:var(--samsung-blue);} .booking-calendar-day.selected{ background:var(--samsung-blue); border-color:var(--samsung-blue); color:var(--color-white); font-weight:700;} .booking-calendar-day.disabled{ background:var(--color-gray-100); color:var(--color-text-secondary); opacity:0.5; cursor:not-allowed; pointer-events:none;} .booking-calendar-day.today{ border-color:var(--samsung-blue); font-weight:700;}  .booking-time-slots{ display:grid; grid-template-columns:repeat(auto-fill,minmax(100px,1fr)); gap:var(--space-sm); margin-top:var(--space-lg);} .booking-time-slot{ padding:var(--space-md); text-align:center; font-size:var(--text-sm); font-weight:600; background:var(--color-white); border:2px solid var(--color-gray-300); border-radius:var(--radius-lg); cursor:pointer; transition:all var(--transition-base);} .booking-time-slot:hover{ background:var(--color-gray-100); border-color:var(--samsung-blue);} .booking-time-slot.selected{ background:var(--samsung-blue); border-color:var(--samsung-blue); color:var(--color-white);} .booking-time-slot.disabled{ background:var(--color-gray-100); color:var(--color-text-secondary); opacity:0.5; cursor:not-allowed; pointer-events:none;}  @media (max-width:768px){ .form-row{ grid-template-columns:1fr;}  .booking-calendar{ max-width:100%;}  .booking-time-slots{ grid-template-columns:repeat(auto-fill,minmax(80px,1fr));}}/*  * Glassmorphism Components  */   .service-card{ background:var(--color-white); border:1px solid var(--color-gray-300); box-shadow:var(--shadow-sm); border-radius:var(--radius-lg); padding:var(--space-2xl); transition:all var(--transition-base); position:relative; overflow:hidden;} .service-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--color-gray-400);} .service-card-icon{ width:64px; height:64px; margin-bottom:var(--space-lg); background:var(--color-gray-100); border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center;} .service-card-icon svg{ width:32px; height:32px; color:var(--samsung-blue);} .service-card-title{ font-size:var(--text-2xl); font-weight:700; margin-bottom:var(--space-md); color:var(--color-black);} .service-card-description{ color:var(--color-text-secondary); line-height:1.6; margin-bottom:var(--space-lg);} .service-card-link{ display:inline-flex; align-items:center; gap:var(--space-sm); color:var(--samsung-blue); font-weight:600; transition:gap var(--transition-fast);} .service-card-link:hover{ gap:var(--space-md); color:var(--samsung-blue-dark);}  .product-card{ background:var(--color-white); border:1px solid var(--color-gray-300); box-shadow:var(--shadow-sm); border-radius:var(--radius-lg); overflow:hidden; transition:all var(--transition-base);} .product-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--color-gray-400);} .product-card-image{ position:relative; width:100%; aspect-ratio:1; overflow:hidden; background:var(--color-gray-100);} .product-card-image img{ width:100%; height:100%; object-fit:cover; transition:transform var(--transition-slow);} .product-card:hover .product-card-image img{ transform:scale(1.1);} .product-card-badge{ position:absolute; top:var(--space-md); right:var(--space-md); padding:var(--space-sm) var(--space-md); background:var(--samsung-blue); color:white; border-radius:var(--radius-sm); font-size:var(--text-sm); font-weight:600;} .product-card-content{ padding:var(--space-xl);} .product-card-title{ font-size:var(--text-xl); font-weight:700; margin-bottom:var(--space-sm); color:var(--color-black);} .product-card-price{ font-size:var(--text-2xl); font-weight:700; color:var(--color-black); margin-bottom:var(--space-md);} .product-card-description{ color:var(--color-text-secondary); font-size:var(--text-sm); line-height:1.5; margin-bottom:var(--space-lg);}  .info-box{ background:var(--glass-bg); border:1px solid var(--glass-border); border-left:4px solid var(--color-neon-blue); backdrop-filter:var(--backdrop-blur); -webkit-backdrop-filter:var(--backdrop-blur); border-radius:var(--radius-lg); padding:var(--space-lg); margin:var(--space-lg) 0;} .info-box.success{ border-left-color:#0ba360;} .info-box.warning{ border-left-color:#f5576c;} .info-box-title{ font-weight:600; color:var(--color-text-bright); margin-bottom:var(--space-sm);} .info-box-content{ color:var(--color-text-muted); font-size:var(--text-sm);}  .testimonial-card{ background:var(--glass-bg); border:1px solid var(--glass-border); backdrop-filter:var(--backdrop-blur); -webkit-backdrop-filter:var(--backdrop-blur); box-shadow:var(--glass-shadow); border-radius:var(--radius-xl); padding:var(--space-2xl); position:relative;} .testimonial-card::before{ content:'"'; position:absolute; top:var(--space-lg); left:var(--space-lg); font-size:80px; color:var(--color-neon-purple); opacity:0.2; line-height:1;} .testimonial-card-content{ font-size:var(--text-lg); color:var(--color-text-light); line-height:1.8; margin-bottom:var(--space-xl); position:relative; z-index:1;} .testimonial-card-author{ display:flex; align-items:center; gap:var(--space-md);} .testimonial-card-avatar{ width:48px; height:48px; border-radius:50%; overflow:hidden; border:2px solid var(--glass-border);} .testimonial-card-avatar img{ width:100%; height:100%; object-fit:cover;} .testimonial-card-author-info{ flex:1;} .testimonial-card-author-name{ font-weight:600; color:var(--color-text-bright); margin-bottom:2px;} .testimonial-card-author-role{ font-size:var(--text-sm); color:var(--color-text-muted);}  .feature-card{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:var(--space-lg); background:var(--color-white); border:1px solid var(--color-gray-300); box-shadow:var(--shadow-sm); border-radius:var(--radius-lg); padding:var(--space-2xl); transition:all var(--transition-base); opacity:1 !important; visibility:visible !important;} .feature-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-lg); border-color:var(--samsung-blue);} .feature-card-icon{ flex-shrink:0; width:72px; height:72px; background:var(--color-gray-100); border-radius:50%; display:flex; align-items:center; justify-content:center; transition:all var(--transition-base);} .feature-card:hover .feature-card-icon{ background:var(--samsung-blue);} .feature-card-icon svg{ width:36px; height:36px; color:var(--samsung-blue); transition:all var(--transition-base);} .feature-card:hover .feature-card-icon svg{ color:white; transform:scale(1.1);} .feature-card-content h3{ font-size:var(--text-xl); font-weight:700; margin-bottom:var(--space-sm); color:var(--color-black);} .feature-card-content p{ color:var(--color-text-secondary); line-height:1.7; margin-bottom:0;}  @media (max-width:768px){ .service-card, .testimonial-card{ padding:var(--space-xl);}  .product-card-content{ padding:var(--space-lg);}  .feature-card{ flex-direction:column;}}/*  * Hero Section - Samsung Style with Background Image  */  .hero-3d{ position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center; overflow:hidden; background-color:var(--color-gray-100); background-image:url('/assets/img/hero-background.jpg'); background-size:cover; background-position:center; background-repeat:no-repeat;}  .hero-3d::before{ content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(to bottom,rgba(0,0,0,0.2),rgba(0,0,0,0.4)); z-index:0;}  .hero-3d-canvas{ display:none;} .hero-3d-canvas canvas{ display:none;}  .hero-3d-content{ position:relative; z-index:1; text-align:center; max-width:900px; padding:var(--space-2xl); color:var(--color-white);} .hero-3d-title{ font-size:var(--text-7xl); font-weight:700; margin-bottom:var(--space-lg); line-height:1.1; color:var(--color-white); position:relative; text-shadow:0 2px 10px rgba(0,0,0,0.3);}   .hero-3d-subtitle{ font-size:var(--text-2xl); color:var(--color-white); margin-bottom:var(--space-2xl); font-weight:400; line-height:1.5; text-shadow:0 1px 5px rgba(0,0,0,0.3); opacity:0.95;} .hero-3d-cta{ display:flex; align-items:center; justify-content:center; gap:var(--space-lg); flex-wrap:wrap;}  .hero-scroll-indicator{ position:absolute; bottom:var(--space-2xl); left:50%; transform:translateX(-50%); z-index:1; animation:scrollBounce 2s ease-in-out infinite;} @keyframes scrollBounce{ 0%,100%{ transform:translateX(-50%) translateY(0);} 50%{ transform:translateX(-50%) translateY(-10px);}} .hero-scroll-indicator svg{ width:30px; height:30px; color:var(--color-text-muted);}  .hero-particles{ display:none;}  .hero-stats{ position:absolute; bottom:0; left:0; width:100%; padding:var(--space-2xl) 0; background:var(--color-gray-100); border-top:1px solid var(--color-gray-300); z-index:1;} .hero-stats-container{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-xl); max-width:1280px; margin:0 auto; padding:0 var(--space-lg);} .hero-stat{ text-align:center;} .hero-stat-number{ font-size:var(--text-5xl); font-weight:700; color:var(--color-black); margin-bottom:var(--space-sm);} .hero-stat-label{ font-size:var(--text-base); color:var(--color-text-secondary);}  @media (max-width:1024px){ .hero-3d-title{ font-size:var(--text-6xl);}  .hero-3d-subtitle{ font-size:var(--text-xl);}  .hero-stats-container{ grid-template-columns:repeat(3,1fr); gap:var(--space-md);}  .hero-stat-number{ font-size:var(--text-4xl);}} @media (max-width:768px){ .hero-3d-content{ padding:var(--space-xl);}  .hero-3d-title{ font-size:var(--text-5xl);}  .hero-3d-subtitle{ font-size:var(--text-lg); margin-bottom:var(--space-xl);}  .hero-3d-cta{ flex-direction:column; gap:var(--space-md);}  .hero-3d-cta .btn{ width:100%;}  .hero-stats-container{ grid-template-columns:1fr; gap:var(--space-lg);}  .hero-stat-number{ font-size:var(--text-3xl);}} @media (max-width:480px){ .hero-3d-title{ font-size:var(--text-4xl);}  .hero-3d-subtitle{ font-size:var(--text-base);}}/*  * Navbar Component - Glass effect with blur  */  .navbar{ position:fixed; top:0; left:0; width:100%; z-index:var(--z-sticky); transition:all var(--transition-base); padding:var(--space-md) 0; background:var(--color-white); border-bottom:1px solid var(--color-gray-300);} .navbar.scrolled{ box-shadow:var(--shadow-md); padding:var(--space-sm) 0;} .navbar-container{ display:flex; align-items:center; justify-content:space-between; max-width:1280px; margin:0 auto; padding:0 var(--space-lg);}  .navbar-logo{ display:flex; align-items:center; gap:var(--space-md); font-size:var(--text-xl); font-weight:700; color:var(--color-text-bright); transition:transform var(--transition-fast);} .navbar-logo:hover{ transform:scale(1.02);} .navbar-logo img{ height:auto; max-height:50px; width:auto;} .navbar-logo img:last-of-type{ max-height:35px;}  .navbar-nav{ display:flex; align-items:center; gap:var(--space-xl); list-style:none;} .navbar-nav-item{ position:relative;} .navbar-nav-link{ color:var(--color-text-primary); font-weight:500; font-size:var(--text-base); transition:color var(--transition-fast); position:relative; display:inline-block; padding:var(--space-sm) 0;} .navbar-nav-link::after{ content:''; position:absolute; bottom:0; left:0; width:0; height:2px; background:var(--samsung-blue); transition:width var(--transition-base);} .navbar-nav-link:hover,.navbar-nav-link.active{ color:var(--samsung-blue);} .navbar-nav-link:hover::after,.navbar-nav-link.active::after{ width:100%;}  .navbar-dropdown{ position:relative;} .navbar-dropdown-menu{ position:absolute; top:calc(100% + var(--space-sm)); left:0; min-width:200px; background:var(--glass-bg); border:1px solid var(--glass-border); backdrop-filter:var(--backdrop-blur); -webkit-backdrop-filter:var(--backdrop-blur); border-radius:var(--radius-lg); padding:var(--space-sm); opacity:0; visibility:hidden; transform:translateY(-10px); transition:all var(--transition-base); box-shadow:var(--glass-shadow);} .navbar-dropdown:hover .navbar-dropdown-menu{ opacity:1; visibility:visible; transform:translateY(0);} .navbar-dropdown-item{ padding:var(--space-sm) var(--space-md); border-radius:var(--radius-sm); transition:background var(--transition-fast); white-space:nowrap;} .navbar-dropdown-item:hover{ background:rgba(255,255,255,0.1);}  .navbar-cta{ padding:var(--space-sm) var(--space-lg); background:var(--color-black); color:var(--color-white); border-radius:var(--radius-full); font-weight:600; transition:all var(--transition-base);} .navbar-cta:hover{ background:var(--samsung-blue); transform:translateY(-1px);}  .navbar-toggle{ display:none; flex-direction:column; gap:6px; background:transparent; border:none; cursor:pointer; padding:var(--space-sm); z-index:var(--z-modal);} .navbar-toggle-bar{ width:28px; height:3px; background:var(--color-black); border-radius:2px; transition:all var(--transition-base);} .navbar-toggle.active .navbar-toggle-bar:nth-child(1){ transform:rotate(45deg) translateY(9px);} .navbar-toggle.active .navbar-toggle-bar:nth-child(2){ opacity:0;} .navbar-toggle.active .navbar-toggle-bar:nth-child(3){ transform:rotate(-45deg) translateY(-9px);}  @media (max-width:1024px){ .navbar-logo img:first-of-type{ max-height:40px;}  .navbar-logo img:last-of-type{ max-height:28px;}} @media (max-width:480px){ .navbar-logo{ gap:var(--space-sm);}  .navbar-logo img:first-of-type{ max-height:35px;}  .navbar-logo img:last-of-type{ max-height:25px;}  .navbar-logo div{ height:30px !important;}}  @media (max-width:768px){ .navbar-nav{ position:fixed; top:0; right:0; width:280px; height:100vh; background:var(--color-white); border-left:1px solid var(--color-gray-300); flex-direction:column; align-items:flex-start; padding:var(--space-4xl) var(--space-xl); gap:var(--space-lg); transform:translateX(100%); transition:transform var(--transition-base);}  .navbar-nav.active{ transform:translateX(0); box-shadow:var(--shadow-xl);}  .navbar-toggle{ display:flex;}  .navbar-dropdown-menu{ position:static; opacity:1; visibility:visible; transform:none; margin-top:var(--space-sm); display:none;}  .navbar-dropdown.active .navbar-dropdown-menu{ display:block;}  .navbar-cta{ width:100%; text-align:center;}}/**  * Homepage Specific Styles  */   @media (max-width:1024px){ .grid-cols-3{ grid-template-columns:repeat(2,1fr) !important;}  .grid-cols-4{ grid-template-columns:repeat(2,1fr) !important;}} @media (max-width:768px){ .grid-cols-2, .grid-cols-3, .grid-cols-4{ grid-template-columns:1fr !important;}   .hero-3d-title{ font-size:var(--text-4xl) !important;}  .hero-3d-subtitle{ font-size:var(--text-lg) !important;}  .hero-3d-cta{ flex-direction:column; width:100%;}  .hero-3d-cta .btn{ width:100%;}   .hero-stats-container{ grid-template-columns:1fr !important; gap:var(--space-lg);}   .grid[style*="grid-template-columns:1fr 1fr"]{ grid-template-columns:1fr !important;}}  .feature-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md);} .feature-card:hover .feature-card-icon svg{ transform:scale(1.1);}  .testimonial-card{ transition:all var(--transition-base);} .testimonial-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg);}  footer a:hover{ color:white !important;}  footer a[style*="border-radius:50%"]:hover{ background:var(--samsung-blue) !important;}  html{ scroll-behavior:smooth;}  .service-card{ opacity:0; animation:fadeInUp 0.6s ease-out forwards;} .service-card:nth-child(1){animation-delay:0.1s}.service-card:nth-child(2){animation-delay:0.2s}.service-card:nth-child(3){animation-delay:0.3s}.service-card:nth-child(4){animation-delay:0.4s}.service-card:nth-child(5){animation-delay:0.5s}.service-card:nth-child(6){animation-delay:0.6s}/*  * Booking Page Styles - Samsung Design  * Stili specifici per la pagina di prenotazione con step indicator e layout personalizzati  */   .booking-hero{ background:linear-gradient(135deg,var(--samsung-blue) 0%,#0a1654 100%); color:var(--color-white); padding:120px 0 80px; text-align:center; position:relative; overflow:hidden;} .booking-hero::before{ content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:radial-gradient(circle at 30% 50%,rgba(255,255,255,0.1) 0%,transparent 50%), radial-gradient(circle at 70% 80%,rgba(255,255,255,0.1) 0%,transparent 50%); opacity:0.5;} .booking-hero h1{ font-size:3rem; font-weight:700; color:var(--color-white); margin-bottom:var(--space-lg); position:relative; z-index:1;} .booking-hero p{ font-size:1.25rem; max-width:700px; margin:0 auto; color:var(--color-white); opacity:0.95; position:relative; z-index:1; line-height:1.8;}  .booking-steps{ display:flex; justify-content:center; align-items:center; gap:var(--space-md); margin:var(--space-3xl) 0; padding:0 var(--space-lg); position:relative;} .booking-steps::before{ content:''; position:absolute; top:24px; left:0; right:0; height:2px; background:var(--color-gray-300); z-index:0;} .booking-step{ display:flex; flex-direction:column; align-items:center; gap:var(--space-sm); position:relative; z-index:1; flex:1; max-width:200px;} .booking-step-circle{ width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:var(--text-lg); font-weight:700; background:var(--color-white); border:3px solid var(--color-gray-300); color:var(--color-text-secondary); transition:all var(--transition-base);} .booking-step.active .booking-step-circle{ background:var(--samsung-blue); border-color:var(--samsung-blue); color:var(--color-white); box-shadow:0 4px 16px rgba(20,40,160,0.3);} .booking-step.completed .booking-step-circle{ background:var(--samsung-blue); border-color:var(--samsung-blue); color:var(--color-white);} .booking-step.completed .booking-step-circle::before{ content:'✓'; font-size:var(--text-xl);} .booking-step-label{ font-size:var(--text-sm); font-weight:600; color:var(--color-text-secondary); text-align:center;} .booking-step.active .booking-step-label{ color:var(--samsung-blue);} .booking-step.completed .booking-step-label{ color:var(--color-black);}  .booking-container{ max-width:800px; margin:var(--space-4xl) auto; padding:0 var(--space-lg);} .booking-card{ background:var(--color-white); border:2px solid var(--color-gray-300); border-radius:var(--radius-xl); padding:var(--space-3xl); box-shadow:0 4px 24px rgba(0,0,0,0.08);} .booking-card-title{ font-size:var(--text-3xl); font-weight:700; color:var(--color-black); margin-bottom:var(--space-sm);} .booking-card-subtitle{ font-size:var(--text-base); color:var(--color-text-secondary); margin-bottom:var(--space-2xl); line-height:1.8;}  .service-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:var(--space-lg); margin-bottom:var(--space-2xl);} .service-card{ background:var(--color-white); border:2px solid var(--color-gray-300); border-radius:var(--radius-lg); padding:var(--space-xl); cursor:pointer; transition:all var(--transition-base); text-align:center;} .service-card:hover{ border-color:var(--samsung-blue); transform:translateY(-4px); box-shadow:0 8px 24px rgba(0,0,0,0.12);} .service-card.selected{ border-color:var(--samsung-blue); background:rgba(20,40,160,0.05);} .service-card-icon{ width:64px; height:64px; margin:0 auto var(--space-lg); background:var(--color-gray-100); border-radius:50%; display:flex; align-items:center; justify-content:center;} .service-card-icon svg{ width:32px; height:32px; color:var(--samsung-blue);} .service-card.selected .service-card-icon{ background:var(--samsung-blue);} .service-card.selected .service-card-icon svg{ color:var(--color-white);} .service-card-title{ font-size:var(--text-lg); font-weight:600; color:var(--color-black); margin-bottom:var(--space-sm);} .service-card-description{ font-size:var(--text-sm); color:var(--color-text-secondary); line-height:1.6;}  .booking-actions{ display:flex; justify-content:space-between; align-items:center; gap:var(--space-lg); margin-top:var(--space-3xl); padding-top:var(--space-2xl); border-top:2px solid var(--color-gray-300);} .booking-actions .btn{ flex:1;}  .booking-summary{ background:var(--color-gray-100); border-radius:var(--radius-lg); padding:var(--space-xl); margin-bottom:var(--space-2xl);} .booking-summary-title{ font-size:var(--text-lg); font-weight:600; color:var(--color-black); margin-bottom:var(--space-lg);} .booking-summary-item{ display:flex; justify-content:space-between; align-items:start; padding:var(--space-md) 0; border-bottom:1px solid var(--color-gray-300);} .booking-summary-item:last-child{ border-bottom:none;} .booking-summary-label{ font-size:var(--text-sm); color:var(--color-text-secondary); font-weight:500;} .booking-summary-value{ font-size:var(--text-sm); color:var(--color-black); font-weight:600; text-align:right;}  .booking-info-box{ background:rgba(20,40,160,0.05); border-left:4px solid var(--samsung-blue); border-radius:var(--radius-md); padding:var(--space-lg); margin-bottom:var(--space-xl); display:flex; gap:var(--space-md);} .booking-info-box svg{ width:24px; height:24px; color:var(--samsung-blue); flex-shrink:0;} .booking-info-box-content p{ font-size:var(--text-sm); color:var(--color-text-primary); line-height:1.7; margin:0;}  .booking-success{ text-align:center; padding:var(--space-4xl) var(--space-xl);} .booking-success-icon{ width:80px; height:80px; margin:0 auto var(--space-xl); background:var(--samsung-blue); border-radius:50%; display:flex; align-items:center; justify-content:center;} .booking-success-icon svg{ width:48px; height:48px; color:var(--color-white);} .booking-success h3{ font-size:var(--text-3xl); font-weight:700; color:var(--color-black); margin-bottom:var(--space-md);} .booking-success p{ font-size:var(--text-lg); color:var(--color-text-secondary); line-height:1.8; max-width:600px; margin:0 auto var(--space-2xl);}  @media (max-width:768px){ .booking-hero h1{ font-size:2rem;}  .booking-hero p{ font-size:1rem;}  .booking-steps{ flex-direction:column; gap:var(--space-lg);}  .booking-steps::before{ display:none;}  .booking-step{ flex-direction:row; max-width:100%; width:100%;}  .booking-step-label{ text-align:left;}  .booking-card{ padding:var(--space-xl);}  .service-grid{ grid-template-columns:1fr;}  .booking-actions{ flex-direction:column-reverse;}  .booking-actions .btn{ width:100%;}}/*  * Shop Page Styles - Samsung Design  * Stili per e-commerce con product grid e filtri  */   .shop-hero{ background:linear-gradient(135deg,var(--color-black) 0%,#1a1a1a 100%); color:var(--color-white); padding:100px 0 60px; text-align:center;} .shop-hero h1{ font-size:2.5rem; font-weight:700; color:var(--color-white); margin-bottom:var(--space-md);} .shop-hero p{ font-size:1.125rem; max-width:700px; margin:0 auto; color:var(--color-white); opacity:0.9; line-height:1.7;}  .shop-container{ display:grid; grid-template-columns:280px 1fr; gap:var(--space-3xl); padding:var(--space-4xl) 0;}  .shop-sidebar{ position:sticky; top:100px; height:fit-content;} .shop-filter-section{ background:var(--color-white); border:2px solid var(--color-gray-300); border-radius:var(--radius-lg); padding:var(--space-xl); margin-bottom:var(--space-lg);} .shop-filter-title{ font-size:var(--text-lg); font-weight:600; color:var(--color-black); margin-bottom:var(--space-md);} .shop-filter-option{ display:flex; align-items:center; gap:var(--space-sm); margin-bottom:var(--space-md); cursor:pointer;} .shop-filter-option input[type="checkbox"]{ appearance:none; width:18px; height:18px; border:2px solid var(--color-gray-300); border-radius:var(--radius-sm); cursor:pointer; transition:all var(--transition-base);} .shop-filter-option input[type="checkbox"]:checked{ background:var(--samsung-blue); border-color:var(--samsung-blue);} .shop-filter-option label{ font-size:var(--text-sm); color:var(--color-text-primary); cursor:pointer;}  .shop-product-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-2xl);}  .product-card{ background:var(--color-white); border:2px solid var(--color-gray-300); border-radius:var(--radius-xl); overflow:hidden; transition:all var(--transition-base); cursor:pointer;} .product-card:hover{ transform:translateY(-8px); box-shadow:0 8px 24px rgba(0,0,0,0.12); border-color:var(--samsung-blue);} .product-card-image{ aspect-ratio:1; background:var(--color-gray-100); display:flex; align-items:center; justify-content:center; padding:var(--space-xl); position:relative;} .product-card-image img{ max-width:100%; max-height:100%; object-fit:contain;} .product-card-badge{ position:absolute; top:var(--space-md); right:var(--space-md); background:var(--samsung-blue); color:var(--color-white); padding:var(--space-xs) var(--space-md); border-radius:var(--radius-full); font-size:var(--text-xs); font-weight:600; text-transform:uppercase;} .product-card-content{ padding:var(--space-xl);} .product-card-category{ font-size:var(--text-xs); color:var(--color-text-secondary); text-transform:uppercase; font-weight:600; margin-bottom:var(--space-sm);} .product-card-title{ font-size:var(--text-lg); font-weight:600; color:var(--color-black); margin-bottom:var(--space-sm); line-height:1.4;} .product-card-description{ font-size:var(--text-sm); color:var(--color-text-secondary); margin-bottom:var(--space-lg); line-height:1.6;} .product-card-footer{ display:flex; justify-content:space-between; align-items:center; gap:var(--space-md);} .product-card-price{ font-size:var(--text-2xl); font-weight:700; color:var(--color-black);} .product-card-cta{ flex:1;}  @media (max-width:1024px){ .shop-container{ grid-template-columns:1fr;}  .shop-sidebar{ position:static; display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:var(--space-lg);}  .shop-product-grid{ grid-template-columns:repeat(2,1fr);}} @media (max-width:768px){ .shop-hero h1{ font-size:2rem;}  .shop-sidebar{ grid-template-columns:1fr;}  .shop-product-grid{ grid-template-columns:1fr; gap:var(--space-xl);}}/*  * Login Page Styles - Samsung Design  * Stili specifici per la pagina di login con design Samsung minimalista  */   .login-section{ min-height:calc(100vh - 80px); display:flex; align-items:center; justify-content:center; padding:var(--space-4xl) var(--space-lg); background:var(--color-gray-100);}  .login-container{ max-width:480px; width:100%; background:var(--color-white); border-radius:var(--radius-2xl); box-shadow:0 4px 24px rgba(0,0,0,0.08); padding:var(--space-4xl) var(--space-3xl); text-align:center;}  .login-logo{ width:80px; height:80px; margin:0 auto var(--space-xl); background:var(--samsung-blue); border-radius:50%; display:flex; align-items:center; justify-content:center;} .login-logo svg{ width:40px; height:40px; color:var(--color-white);}  .login-title{ font-size:var(--text-3xl); font-weight:700; color:var(--color-black); margin-bottom:var(--space-sm);} .login-subtitle{ font-size:var(--text-base); color:var(--color-text-secondary); margin-bottom:var(--space-3xl); line-height:1.7;}  .login-form{ text-align:left;} .login-form .form-group{ margin-bottom:var(--space-xl);} .login-form .form-input{ padding:var(--space-lg); font-size:var(--text-base);}  .login-remember{ display:flex; justify-content:space-between; align-items:center; margin-bottom:var(--space-xl);} .login-remember .form-checkbox{ margin:0;} .login-forgot-link{ font-size:var(--text-sm); color:var(--samsung-blue); text-decoration:none; font-weight:600; transition:color var(--transition-base);} .login-forgot-link:hover{ color:var(--color-black); text-decoration:underline;}  .login-btn{ width:100%; padding:var(--space-lg); font-size:var(--text-lg); font-weight:600; background:var(--color-black); color:var(--color-white); border:none; border-radius:var(--radius-full); cursor:pointer; transition:all var(--transition-base); margin-bottom:var(--space-xl);} .login-btn:hover{ background:var(--samsung-blue); transform:translateY(-1px);}  .login-divider{ display:flex; align-items:center; gap:var(--space-md); margin:var(--space-2xl) 0; color:var(--color-text-secondary); font-size:var(--text-sm);} .login-divider::before,.login-divider::after{ content:''; flex:1; height:1px; background:var(--color-gray-300);}  .login-register{ font-size:var(--text-base); color:var(--color-text-secondary);} .login-register-link{ color:var(--samsung-blue); text-decoration:none; font-weight:600; transition:color var(--transition-base);} .login-register-link:hover{ color:var(--color-black); text-decoration:underline;}  .login-benefits{ background:var(--color-white); padding:var(--space-4xl) 0;} .login-benefits-title{ font-size:var(--text-3xl); font-weight:700; color:var(--color-black); text-align:center; margin-bottom:var(--space-3xl);} .login-benefits-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:var(--space-xl); max-width:1200px; margin:0 auto; padding:0 var(--space-lg);} .login-benefit-card{ background:var(--color-gray-100); padding:var(--space-2xl); border-radius:var(--radius-lg); text-align:center; transition:transform var(--transition-base);} .login-benefit-card:hover{ transform:translateY(-4px);} .login-benefit-icon{ width:64px; height:64px; margin:0 auto var(--space-lg); background:var(--samsung-blue); border-radius:50%; display:flex; align-items:center; justify-content:center;} .login-benefit-icon svg{ width:32px; height:32px; color:var(--color-white);} .login-benefit-title{ font-size:var(--text-lg); font-weight:600; color:var(--color-black); margin-bottom:var(--space-sm);} .login-benefit-description{ font-size:var(--text-sm); color:var(--color-text-secondary); line-height:1.7;}  .login-social-buttons{ display:flex; flex-direction:column; gap:var(--space-md); margin-bottom:var(--space-xl);} .login-social-btn{ width:100%; padding:var(--space-md); display:flex; align-items:center; justify-content:center; gap:var(--space-md); font-size:var(--text-base); font-weight:600; border:2px solid var(--color-gray-300); border-radius:var(--radius-full); background:var(--color-white); color:var(--color-text-primary); cursor:pointer; transition:all var(--transition-base);} .login-social-btn:hover{ border-color:var(--samsung-blue); background:rgba(20,40,160,0.05);} .login-social-btn svg{ width:20px; height:20px;}  .login-error{ background:rgba(231,76,60,0.1); border-left:4px solid #E74C3C; padding:var(--space-md); border-radius:var(--radius-md); margin-bottom:var(--space-xl); display:flex; align-items:center; gap:var(--space-sm);} .login-error svg{ width:20px; height:20px; color:#E74C3C; flex-shrink:0;} .login-error-text{ font-size:var(--text-sm); color:#E74C3C;}  .login-success{ background:rgba(39,174,96,0.1); border-left:4px solid #27AE60; padding:var(--space-md); border-radius:var(--radius-md); margin-bottom:var(--space-xl); display:flex; align-items:center; gap:var(--space-sm);} .login-success svg{ width:20px; height:20px; color:#27AE60; flex-shrink:0;} .login-success-text{ font-size:var(--text-sm); color:#27AE60;}  @media (max-width:768px){ .login-section{ padding:var(--space-2xl) var(--space-lg);}  .login-container{ padding:var(--space-2xl) var(--space-xl);}  .login-title{ font-size:var(--text-2xl);}  .login-benefits-grid{ grid-template-columns:1fr;}}