:root {
    --ink: #111311;
    --ink-soft: #262a27;
    --paper: #f5f2eb;
    --paper-bright: #fbfaf6;
    --white: #ffffff;
    --gold: #c49a55;
    --gold-light: #e6c78d;
    --teal: #5e817c;
    --sage: #aebeb1;
    --line: rgba(17, 19, 17, 0.14);
    --muted: #656b66;
    --shadow: 0 22px 70px rgba(15, 21, 17, 0.11);
    --radius: 1.15rem;
    --header-height: 5.35rem;
    --ease: cubic-bezier(.2, .75, .25, 1);
}

@property --spark-angle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; background: var(--paper-bright); color: var(--ink); font-family: Inter, "Segoe UI", Arial, sans-serif; font-size: 1.0833rem; line-height: 1.7; -webkit-font-smoothing: antialiased; }
body.drawer-open { overflow: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .18em; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; font-weight: 500; line-height: 1.08; letter-spacing: -.025em; }
h1 { font-size: clamp(2.833rem, calc(6vw - .167rem), 7.033rem); }
h2 { font-size: clamp(2.2rem, 3.8vw, 4.8rem); }
h3 { font-size: clamp(1.35rem, 1.7vw, 2rem); }
p { color: var(--muted); }

.site-shell { width: 92vw; min-width: 80vw; max-width: 110rem; margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: .75rem; left: .75rem; transform: translateY(-170%); z-index: 300; background: var(--white); color: var(--ink); padding: .75rem 1rem; border-radius: .5rem; }
.skip-link:focus { transform: none; }

.site-header { position: fixed; inset: 0 0 auto; height: var(--header-height); z-index: 100; background: linear-gradient(to bottom, rgba(11,13,12,.78), transparent); border-bottom: 1px solid transparent; transition: background .4s ease, border-color .4s ease, box-shadow .4s ease; }
.site-header.is-scrolled { background: rgba(14, 16, 14, .94); border-color: rgba(255,255,255,.1); box-shadow: 0 10px 30px rgba(0,0,0,.18); backdrop-filter: blur(15px); }
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.brand-mark { display: inline-flex; align-items: center; width: 11.8rem; height: 3.25rem; overflow: hidden; border-radius: .2rem; }
.brand-mark img { width: 100%; height: auto; transition: filter .45s ease, transform .45s var(--ease); }
.brand-mark:hover img { filter: brightness(1.16); transform: scale(1.02); }
.primary-navigation { display: flex; align-items: center; gap: clamp(1.05rem, 1.8vw, 2.25rem); }
.primary-navigation a { color: rgba(255,255,255,.83); font-size: .9133rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; position: relative; transition: color .25s ease; }
.primary-navigation a:not(.nav-cta)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -.45rem; height: 1px; background: var(--gold-light); transition: right .35s var(--ease); }
.primary-navigation a:hover, .primary-navigation a[aria-current="page"] { color: var(--white); }
.primary-navigation a:hover::after, .primary-navigation a[aria-current="page"]::after { right: 0; }
.primary-navigation .nav-cta { border: 1px solid rgba(230,199,141,.62); border-radius: 999px; padding: .72rem 1.15rem; color: var(--gold-light); background: linear-gradient(145deg, rgba(196,154,85,.14), rgba(196,154,85,.04)); }
.primary-navigation .nav-cta:hover { background: rgba(196,154,85,.22); }
.menu-toggle { display: none; width: 2.8rem; height: 2.8rem; border: 0; background: transparent; position: relative; }
.menu-toggle span:not(.sr-only) { position: absolute; left: .55rem; width: 1.7rem; height: 1px; background: var(--white); transition: transform .3s ease, top .3s ease, opacity .2s ease; }
.menu-toggle span:nth-child(1) { top: .85rem; }
.menu-toggle span:nth-child(2) { top: 1.35rem; }
.menu-toggle span:nth-child(3) { top: 1.85rem; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { top: 1.35rem; transform: rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { top: 1.35rem; transform: rotate(-45deg); }

.hero-section { min-height: min(58rem, 100svh); position: relative; display: grid; align-items: center; overflow: hidden; background: #151815; }
.hero-image { position: absolute; inset: 0; overflow: hidden; animation: heroBreathe 14s ease-in-out infinite alternate; }
.hero-picture, .hero-picture img { width: 100%; height: 100%; }
.hero-picture img { object-fit: cover; object-position: 52% center; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,9,8,.92) 0%, rgba(10,12,11,.8) 35%, rgba(10,12,11,.2) 69%, rgba(10,12,11,.08) 100%), linear-gradient(0deg, rgba(8,10,9,.48), transparent 45%); }
.hero-geometry { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 1; opacity: .72; mix-blend-mode: screen; }
.light-runner { position: absolute; display: block; left: var(--light-x, 72%); top: var(--light-y, 22%); color: rgba(230,199,141,.76); will-change: transform, opacity; }
.light-line { width: clamp(11rem,28vw,34rem); height: 1px; background: linear-gradient(90deg, transparent, currentColor 24%, rgba(133,188,180,.82) 52%, currentColor 76%, transparent); animation: lightLineRun var(--light-speed,11s) linear var(--light-delay,-2s) infinite; }
.light-circle { width: clamp(8rem,15vw,17rem); aspect-ratio: 1; border: 1px solid currentColor; border-radius: 50%; animation: lightCircleRun var(--light-speed,14s) ease-in-out var(--light-delay,-7s) infinite; }
.light-square { width: clamp(6rem,11vw,12rem); aspect-ratio: 1; border: 1px solid rgba(133,188,180,.74); animation: lightSquareRun var(--light-speed,17s) linear var(--light-delay,-11s) infinite; }
.light-triangle { width: clamp(6rem,10vw,11rem); height: clamp(5rem,8.6vw,9.5rem); border-bottom: 1px solid currentColor; animation: lightTriangleRun var(--light-speed,19s) ease-in-out var(--light-delay,-4s) infinite; }
.light-triangle::before, .light-triangle::after { content: ""; position: absolute; bottom: 0; width: 1px; height: 116%; background: currentColor; transform-origin: bottom; }
.light-triangle::before { left: 0; transform: rotate(30deg); }
.light-triangle::after { right: 0; transform: rotate(-30deg); }
.hero-geometry .light-circle { --light-x: 78%; --light-y: 15%; }
.hero-geometry .light-square { --light-x: 63%; --light-y: 62%; }
.hero-geometry .light-triangle { --light-x: 89%; --light-y: 55%; }
.hero-content { position: relative; padding-top: var(--header-height); color: var(--white); z-index: 2; }
.hero-content > * { max-width: 48rem; }
.hero-content h1 { margin-bottom: 1.65rem; text-wrap: balance; text-shadow: 0 8px 40px rgba(0,0,0,.28); }
.hero-intro { font-size: clamp(1.05rem, 1.35vw, 1.32rem); color: rgba(255,255,255,.76); max-width: 42rem; }
.eyebrow { color: var(--gold); font-size: .75rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 1rem; }
.button-row { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; margin-top: 2.1rem; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 3.25rem; border: 1px solid transparent; border-radius: 999px; padding: .82rem 1.45rem; font-size: .81rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; text-decoration: none; cursor: pointer; position: relative; overflow: hidden; transition: transform .25s var(--ease), box-shadow .25s ease, background .25s ease, border-color .25s ease; }
.button::before { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.2) 50%, transparent 80%); transform: translateX(-120%); transition: transform .7s ease; }
.button:hover::before { transform: translateX(120%); }
.button:hover { transform: translateY(-2px); }
.button-primary { color: #17140f; background: linear-gradient(145deg, var(--gold-light), var(--gold)); box-shadow: 0 12px 35px rgba(196,154,85,.25); }
.button-secondary { color: var(--white); border-color: rgba(255,255,255,.38); background: linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.03)); backdrop-filter: blur(8px); }
.button-light { background: linear-gradient(145deg, #fff, #e7e9e5); color: var(--ink); }
.text-link { color: var(--ink); font-weight: 800; text-decoration: none; border-bottom: 1px solid var(--gold); padding-bottom: .25rem; }
.text-link span { display: inline-block; transition: transform .25s ease; }
.text-link:hover span { transform: translateX(.25rem); }

.trust-strip { background: var(--ink); color: var(--white); border-top: 1px solid rgba(255,255,255,.09); }
.trust-grid { display: grid; grid-template-columns: minmax(8rem,.72fr) repeat(4, 1fr); }
.trust-grid div { min-height: 8.5rem; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid rgba(255,255,255,.11); padding: 1.25rem clamp(1rem,2.5vw,2.5rem); }
.trust-grid div:first-child { border-left: 1px solid rgba(255,255,255,.11); }
.trust-grid strong { color: var(--gold-light); font-family: Georgia, serif; font-size: clamp(1.75rem,2.6vw,3.1rem); font-weight: 500; }
.trust-grid span { color: rgba(255,255,255,.58); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; }
.trust-grid .trust-image { padding: 0; overflow: hidden; min-height: 8.5rem; }
.trust-image img { width: 100%; height: 100%; object-fit: cover; }

.section { padding: clamp(5.5rem, 9vw, 10rem) 0; position: relative; isolation: isolate; overflow: hidden; }
.section > .site-shell { position: relative; z-index: 2; }
.section::after { content: ""; position: absolute; inset: -35%; z-index: 0; pointer-events: none; opacity: .3; background: radial-gradient(circle at 22% 30%, rgba(196,154,85,.19), transparent 22%), radial-gradient(circle at 76% 68%, rgba(94,129,124,.17), transparent 25%), linear-gradient(120deg, transparent 30%, rgba(255,255,255,.25), transparent 68%); animation: sectionToneDrift 18s ease-in-out infinite alternate; }
.section-intro { background: linear-gradient(135deg, #fbfaf6, #f1f3ef 52%, #f7f0e5); }
.section-soft { background: linear-gradient(140deg, #f5f2eb, #e9efe9 55%, #f3eadc); }
.section-dark { background: var(--ink); color: var(--white); position: relative; overflow: hidden; }
.section-dark::before { content: ""; position: absolute; width: 44rem; height: 44rem; border: 1px solid rgba(196,154,85,.16); border-radius: 50%; top: -23rem; right: -12rem; box-shadow: 0 0 100px rgba(94,129,124,.08) inset; }
.section-dark::after { opacity: .15; mix-blend-mode: screen; }
.section-dark p { color: rgba(255,255,255,.6); }
.split-intro { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.75fr) minmax(14rem,.55fr); gap: clamp(2rem,5vw,6rem); align-items: center; }
.split-intro p { font-size: 1.1rem; }
.section-media, .editorial-media, .mission-media, .callout-media, .brand-feature-media, .lens-story-media, .faq-media, .contact-media, .contact-form-media, .legal-media, .drawer-media, .service-detail figure { margin: 0; overflow: hidden; }
.section-media { border-radius: var(--radius); box-shadow: var(--shadow); aspect-ratio: 4 / 5; }
.section-media img { width: 100%; height: 100%; object-fit: cover; }
.animated-image-glow { position: relative; animation: mediaGlow 6.8s ease-in-out infinite alternate; }
.care-purpose-glow { animation-delay: -2.1s; }
.section-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(18rem,.55fr); gap: 3rem; align-items: end; margin-bottom: clamp(3rem,6vw,6rem); }
.section-heading h2 { max-width: 54rem; margin-bottom: 0; }
.center-heading { text-align: center; max-width: 58rem; margin: 0 auto 4rem; }

.service-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); position: relative; }
.service-card { --spark-angle: 0deg; padding: clamp(1.2rem,2vw,2.2rem); min-height: 31rem; border: 1px solid transparent; display: flex; flex-direction: column; transition: transform .4s var(--ease), filter .4s ease; overflow: hidden; background: linear-gradient(#101310,#101310) padding-box, conic-gradient(from var(--spark-angle), rgba(255,255,255,.1) 0 38%, rgba(230,199,141,.92) 42%, rgba(110,170,161,.82) 45%, rgba(255,255,255,.1) 49% 100%) border-box; animation: sparkBorder 11s linear infinite; }
.service-card:first-child { border-left: 1px solid rgba(255,255,255,.12); }
.service-card:nth-child(2) { animation-duration: 14s; animation-delay: -6s; }
.service-card:nth-child(3) { animation-duration: 9s; animation-delay: -3s; }
.service-card:nth-child(4) { animation-duration: 16s; animation-delay: -10s; }
.service-card:hover { transform: translateY(-.45rem); filter: brightness(1.08); }
.service-card-image { width: calc(100% + clamp(2.4rem,4vw,4.4rem)); max-width: none; height: 11rem; object-fit: cover; object-position: center 38%; margin: calc(clamp(1.2rem,2vw,2.2rem) * -1) calc(clamp(1.2rem,2vw,2.2rem) * -1) 1.4rem; }
.service-card:nth-child(2) .service-card-image { object-position: 50% 58%; }
.service-card:nth-child(3) .service-card-image { object-position: 50% 46%; }
.service-card:nth-child(4) .service-card-image { object-position: 50% 55%; }
.section-dark .service-card-image { animation: serviceImageGlow 7.2s ease-in-out infinite alternate; }
.section-dark .service-card:nth-child(2) .service-card-image { animation-delay: -1.8s; }
.section-dark .service-card:nth-child(3) .service-card-image { animation-delay: -3.6s; }
.section-dark .service-card:nth-child(4) .service-card-image { animation-delay: -5.4s; }
.service-number { color: var(--gold); font-size: .72rem; letter-spacing: .15em; margin-bottom: 1.2rem; }
.service-card h3 { font-family: Georgia, serif; color: var(--white); }
.service-card a { color: var(--gold-light); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; margin-top: 1.3rem; }

.concepts-section { background: linear-gradient(135deg, #fbfaf6, #edf1ec 55%, #f7efe0); }
.concept-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); border-top: 1px solid var(--line); }
.concept-card { display: grid; grid-template-columns: minmax(9rem,.6fr) 1fr; gap: clamp(1.2rem,3vw,3rem); padding: clamp(1.4rem,2.5vw,2.5rem); border-bottom: 1px solid var(--line); border-right: 1px solid var(--line); align-items: center; overflow: hidden; transition: background .35s ease, transform .35s var(--ease); }
.concept-card:nth-child(even) { border-right: 0; }
.concept-card.featured { grid-column: 1 / -1; grid-template-columns: minmax(13rem,.45fr) 1fr; background: linear-gradient(135deg, rgba(196,154,85,.12), rgba(94,129,124,.06)); }
.concept-card:hover { background: var(--white); transform: translateY(-.25rem); box-shadow: var(--shadow); }
.concept-photo { width: 100%; height: 9rem; object-fit: cover; border-radius: .85rem; }
.concept-card.featured .concept-photo { height: 13rem; }
.concept-media { width: 100%; height: 9rem; margin: 0; overflow: hidden; border-radius: .85rem; background: #dfe3de; }
.concept-card.featured .concept-media { height: 13rem; }
.concept-media .concept-photo, .concept-card.featured .concept-media .concept-photo { height: 100%; border-radius: 0; }
.concept-photo-eyez { --concept-scale: 1.38; object-position: 50% 100%; transform: scale(var(--concept-scale)); transform-origin: 50% 96%; }
.concept-photo-icare { --concept-scale: 1.42; object-position: 50% 100%; transform: scale(var(--concept-scale)); transform-origin: 50% 96%; }
.concept-photo-zvc { --concept-scale: 1.32; object-position: 50% 100%; transform: scale(var(--concept-scale)); transform-origin: 50% 96%; }
body.motion-ready img[data-legacy-image].concept-photo-eyez.is-inview, body.motion-ready img[data-legacy-image].concept-photo-icare.is-inview, body.motion-ready img[data-legacy-image].concept-photo-zvc.is-inview { transform: scale(var(--concept-scale)); }
.concept-logo-card .concept-logo { object-fit: contain; object-position: center; padding: clamp(1.1rem,2.2vw,2rem); background: linear-gradient(135deg,#18211f,#314a45); filter: drop-shadow(0 0 .8rem rgba(219,190,128,.14)); }
.concept-logo-card .concept-logo-qol { padding-inline: clamp(1.6rem,3vw,3rem); }
.concept-logo-card .concept-logo-eyez-plus { padding-inline: clamp(1.4rem,2.8vw,2.7rem); }
.concept-card h3 { margin-bottom: .65rem; }
.concept-card p { margin-bottom: 0; }

.care-journey { background: linear-gradient(125deg, #e9ece7, #f4eddf 45%, #e4eeea); background-size: 180% 180%; animation: toneCanvas 16s ease-in-out infinite alternate; }
.journey-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.journey-grid article { background: rgba(255,255,255,.72); min-height: 27rem; padding: clamp(1.2rem,2vw,2rem); border-radius: var(--radius); border: 1px solid rgba(17,19,17,.08); box-shadow: 0 14px 45px rgba(22,31,25,.06); transition: transform .35s var(--ease), box-shadow .35s ease; overflow: hidden; }
.journey-grid article:hover { transform: translateY(-.4rem); box-shadow: var(--shadow); }
.journey-image { width: calc(100% + clamp(2.4rem,4vw,4rem)); max-width: none; height: clamp(12rem,16vw,15.5rem); object-fit: cover; margin: calc(clamp(1.2rem,2vw,2rem) * -1) calc(clamp(1.2rem,2vw,2rem) * -1) 1.4rem; }
.journey-image-general { object-position: 72% 24%; }
.journey-image-shopping { object-position: 50% 35%; }
.journey-image-visit { object-position: 72% 23%; }
.journey-grid b { width: 3rem; height: 3rem; border-radius: 50%; background: linear-gradient(145deg, #d9c49a, var(--gold)); color: var(--ink); display: grid; place-items: center; margin-bottom: 1.5rem; }

.location-callout { background: linear-gradient(125deg, #3f625d, #769188 42%, #b89c67 72%, #526f69); background-size: 220% 220%; color: var(--white); padding: clamp(4.5rem,7vw,8rem) 0; position: relative; overflow: hidden; animation: toneCanvas 14s ease-in-out infinite alternate; }
.location-callout::after { content: ""; position: absolute; width: 34rem; height: 34rem; border: 1px solid rgba(255,255,255,.23); border-radius: 50%; right: -9rem; top: -16rem; box-shadow: 0 0 0 5rem rgba(255,255,255,.03), 0 0 0 10rem rgba(255,255,255,.025); }
.location-callout .site-shell { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(12rem,.55fr) minmax(20rem,1.35fr) auto; align-items: center; gap: clamp(1.5rem,4vw,4rem); }
.callout-media { border-radius: var(--radius); aspect-ratio: 4 / 3; box-shadow: 0 18px 55px rgba(0,0,0,.2); }
.callout-media img { width: 100%; height: 100%; object-fit: cover; }
.location-callout h2 { max-width: 54rem; }
.location-callout p { color: rgba(255,255,255,.74); max-width: 50rem; }

.page-hero { min-height: 38rem; padding: calc(var(--header-height) + 7rem) 0 6rem; background: #151815; color: var(--white); display: flex; align-items: end; position: relative; overflow: hidden; }
.page-hero-visual, .page-hero-shade { position: absolute; inset: 0; }
.page-hero-visual picture, .page-hero-visual img { width: 100%; height: 100%; }
.page-hero-visual img { object-fit: cover; object-position: center 34%; }
.page-hero-shade { background: linear-gradient(90deg, rgba(7,9,8,.94) 0%, rgba(8,10,9,.78) 40%, rgba(8,10,9,.22) 76%, rgba(8,10,9,.12)), linear-gradient(0deg, rgba(7,9,8,.52), transparent 58%); z-index: 1; }
.page-hero::before, .page-hero::after { content: ""; position: absolute; border: 1px solid rgba(230,199,141,.2); border-radius: 50%; width: 37rem; height: 37rem; right: -10rem; top: -16rem; animation: slowOrbit 18s linear infinite; }
.page-hero::after { width: 23rem; height: 23rem; right: 5rem; top: 2rem; animation-direction: reverse; animation-duration: 24s; }
.page-hero .site-shell { position: relative; z-index: 2; }
.page-hero h1 { max-width: 62rem; font-size: clamp(3.033rem, calc(6.5vw - .167rem), 7.033rem); }
.page-hero p:not(.eyebrow) { max-width: 48rem; color: rgba(255,255,255,.67); font-size: 1.1rem; }
.page-hero.compact { min-height: 29rem; }
.page-hero-about { background: radial-gradient(circle at 75% 45%, rgba(196,154,85,.2), transparent 25%), linear-gradient(135deg, #151815, #28302b); }
.page-hero-about .page-hero-visual img { object-position: 72% 35%; }
.page-hero-services .page-hero-visual img { object-position: 76% 45%; }
.page-hero-brands .page-hero-visual img { object-position: 78% 37%; }
.page-hero-locations .page-hero-visual img, .page-hero-contact .page-hero-visual img { object-position: 70% 18%; }
.page-hero-general .page-hero-visual img { object-position: 72% 33%; }

.editorial-grid { display: grid; grid-template-columns: minmax(15rem,.65fr) minmax(14rem,.7fr) 1fr; gap: clamp(2rem,5vw,6rem); align-items: start; }
.editorial-media { border-radius: var(--radius); aspect-ratio: 4 / 3; box-shadow: var(--shadow); }
.editorial-media img { width: 100%; height: 100%; object-fit: cover; }
.editorial-copy > p { font-size: 1.08rem; }
.signature { border-top: 1px solid var(--line); margin-top: 2.5rem; padding-top: 1.5rem; display: flex; flex-direction: column; }
.signature strong { font-family: Georgia, serif; font-size: 1.35rem; }
.signature span { color: var(--muted); font-size: .9rem; }
.timeline { border-top: 1px solid var(--line); }
.timeline article { display: grid; grid-template-columns: 8rem 13rem 1fr; gap: 2rem; padding: 2.5rem 0; border-bottom: 1px solid var(--line); align-items: center; }
.timeline-image { width: 100%; height: 8rem; object-fit: cover; border-radius: .8rem; }
.timeline time { color: var(--gold); font-family: Georgia, serif; font-size: 2.2rem; }
.timeline h3 { margin-bottom: .55rem; }
.value-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem; }
.value-grid article { padding: 1.3rem; border: 1px solid var(--line); min-height: 24rem; border-radius: var(--radius); background: linear-gradient(145deg, #fff, #f5f2eb); transition: transform .3s var(--ease), border-color .3s ease; overflow: hidden; }
.value-image { width: calc(100% + 2.6rem); max-width: none; height: 10rem; object-fit: cover; margin: -1.3rem -1.3rem 1.2rem; }
.value-grid article:hover { transform: translateY(-.4rem); border-color: rgba(196,154,85,.6); }
.value-grid span { color: var(--gold); font-weight: 800; font-size: .75rem; letter-spacing: .12em; }
.mission-panel { background: linear-gradient(125deg, #c69c55, #e0c58d 36%, #91aaa2 68%, #c69c55); background-size: 240% 240%; padding: clamp(5rem,9vw,10rem) 0; position: relative; isolation: isolate; overflow: hidden; animation: toneCanvas 13s ease-in-out infinite alternate; }
.mission-panel::before, .mission-panel::after { content: ""; position: absolute; z-index: 0; pointer-events: none; border: 1px solid rgba(255,255,255,.34); opacity: .6; }
.mission-panel::before { width: 28rem; height: 28rem; border-radius: 50%; left: -9rem; top: -14rem; animation: slowOrbit 24s linear infinite; }
.mission-panel::after { width: 16rem; height: 16rem; right: 5%; bottom: -8rem; transform: rotate(35deg); animation: panelShapeDrift 15s ease-in-out infinite alternate; }
.mission-panel .site-shell { max-width: 70rem; text-align: center; position: relative; z-index: 2; }
.mission-media { width: min(42rem,100%); aspect-ratio: 16 / 7; margin: 0 auto 2.5rem; border-radius: var(--radius); box-shadow: 0 18px 50px rgba(72,49,12,.18); }
.mission-media img { width: 100%; height: 100%; object-fit: cover; }
.mission-image-glow { animation-duration: 5.8s; }
.mission-motion { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.mission-runner { position: absolute; left: -34vw; width: 28vw; height: 1px; background: linear-gradient(90deg,transparent,rgba(255,255,255,.88),rgba(84,118,110,.72),transparent); opacity: 0; filter: drop-shadow(0 0 .32rem rgba(255,255,255,.72)); animation: missionLineRun 9s linear infinite; }
.mission-runner-a { top: 11%; animation-duration: 8.5s; }
.mission-runner-b { top: 27%; animation-duration: 12s; animation-delay: -6.2s; transform: rotate(-5deg); }
.mission-runner-c { top: 44%; animation-duration: 10.6s; animation-delay: -3.8s; transform: rotate(4deg); }
.mission-runner-d { top: 61%; animation-duration: 14.5s; animation-delay: -10.1s; }
.mission-runner-e { top: 78%; animation-duration: 11.4s; animation-delay: -7.5s; transform: rotate(-3deg); }
.mission-runner-f { top: 90%; animation-duration: 16s; animation-delay: -12.4s; transform: rotate(2deg); }
.mission-symbol { --shape-size: clamp(4rem,7vw,7.5rem); position: absolute; left: 0; top: 0; width: var(--shape-size); color: rgba(255,255,255,.42); opacity: .68; filter: drop-shadow(0 0 .6rem rgba(255,255,255,.3)); }
.mission-symbol svg { display: block; width: 100%; height: auto; overflow: visible; fill: none; stroke: currentColor; stroke-width: 2; vector-effect: non-scaling-stroke; }
.mission-symbol-eye { animation: missionEyeBounce 18s linear infinite; }
.mission-symbol-eye svg circle:last-child { fill: currentColor; stroke: none; }
.mission-symbol-glasses { --shape-size: clamp(5.5rem,9vw,10rem); animation: missionGlassesBounce 23s linear infinite; }
.mission-symbol-lens { --shape-size: clamp(3.8rem,6vw,6.5rem); animation: missionLensBounce 15s linear infinite; }
.mission-symbol-frame { --shape-size: clamp(4rem,6.5vw,7rem); animation: missionFrameBounce 20s linear infinite; }
.mission-panel .eyebrow { color: #544223; }
.mission-panel p:not(.eyebrow) { color: rgba(17,19,17,.72); font-size: 1.1rem; }

.service-detail-list { max-width: 90rem; }
.service-detail { display: grid; grid-template-columns: 6rem minmax(14rem,.55fr) 1fr; gap: clamp(1.5rem,3vw,3.5rem); padding: clamp(3rem,6vw,6rem) 0; border-bottom: 1px solid var(--line); align-items: start; }
.service-detail figure { border-radius: var(--radius); aspect-ratio: 4 / 3; box-shadow: var(--shadow); }
.service-detail-image { width: 100%; height: 100%; object-fit: cover; }
.detail-number { width: 5rem; height: 5rem; border: 1px solid var(--gold); color: var(--gold); border-radius: 50%; display: grid; place-items: center; font-family: Georgia, serif; font-size: 1.5rem; }
.service-detail > div:last-child { max-width: 62rem; }
.service-detail ul { display: grid; grid-template-columns: repeat(2,1fr); gap: .8rem 2rem; list-style: none; padding: 0; margin: 2rem 0 0; }
.service-detail li { border-top: 1px solid var(--line); padding: .9rem 0; color: var(--ink-soft); }
.service-detail li::before { content: "•"; color: var(--gold); margin-right: .7rem; }

.brand-feature-media { width: min(42rem,100%); aspect-ratio: 4 / 3; border-radius: var(--radius); margin: 0 auto 3rem; box-shadow: var(--shadow); }
.brand-feature-media img { width: 100%; height: 100%; object-fit: cover; }
.brand-logo-grid { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.brand-logo-card { min-height: 11rem; display: grid; place-items: center; padding: 1.1rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--paper-bright); transition: background .35s ease, transform .35s var(--ease), box-shadow .35s ease; transition-delay: var(--delay, 0ms); }
.brand-logo-card:hover { background: var(--white); transform: translateY(-.3rem) scale(1.02); box-shadow: var(--shadow); z-index: 2; }
.brand-logo-card img { width: 90%; max-width: 15rem; max-height: 6.75rem; object-fit: contain; image-rendering: auto; filter: saturate(.94) contrast(1.12); transition: filter .35s ease, transform .35s var(--ease); }
.brand-logo-card:hover img { filter: saturate(1.05) contrast(1.04); transform: scale(1.04); }
.campaign-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.campaign-card { margin: 0; border-radius: var(--radius); overflow: hidden; border: 1px solid rgba(255,255,255,.13); background: #070807; box-shadow: 0 18px 50px rgba(0,0,0,.22); }
.campaign-card picture, .campaign-card img { width: 100%; height: 100%; }
.campaign-card img { object-fit: cover; aspect-ratio: 16 / 6; }
.campaign-card.campaign-wide { grid-column: 1 / -1; }
.campaign-card.campaign-nine-clean { position: relative; aspect-ratio: 192 / 50; }
.campaign-nine-clean .campaign-nine-picture { display: block; width: 100%; height: 100%; overflow: hidden; }
.campaign-nine-clean .campaign-nine-picture img { display: block; width: 100%; height: auto; max-width: none; aspect-ratio: auto; object-fit: contain; object-position: top center; transform: none !important; filter: brightness(1.03) contrast(1.025) saturate(1.035) !important; }
.lens-story { background: var(--paper); }
.lens-partners { display: grid; grid-template-columns: minmax(13rem,.6fr) .8fr 1fr; gap: clamp(2rem,5vw,6rem); align-items: center; position: relative; }
.lens-story-media { border-radius: var(--radius); aspect-ratio: 4 / 5; box-shadow: var(--shadow); }
.lens-story-media img { width: 100%; height: 100%; object-fit: cover; }
.partner-list { display: grid; grid-template-columns: repeat(2,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); background: rgba(255,255,255,.38); box-shadow: 0 18px 50px rgba(35,42,36,.08); }
.partner-list > span { min-height: 7.5rem; display: grid; place-items: center; padding: 1rem; overflow: hidden; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.88); color: #20312e; font-size: 1.28rem; font-weight: 800; letter-spacing: .02em; transition: color .3s ease, background .3s ease, transform .3s var(--ease); }
.partner-list > span:hover { color: #856225; background: var(--white); transform: translateY(-.15rem); }
.partner-list .partner-logo { padding: 1.1rem; }
.partner-logo img { width: 88%; height: 4.8rem; object-fit: contain; }
.partner-list .partner-logo-zeiss { background: linear-gradient(135deg,#18211f,#314a45); }
.partner-logo-zeiss img { width: 92%; max-height: 4.1rem; }
.partner-list .partner-logo-seiko { background: linear-gradient(135deg,#18211f,#314a45); overflow: hidden; }
.partner-logo-seiko img { width: 78%; max-width: 12rem; height: auto; transform: none !important; filter: contrast(1.08) !important; }
.partner-wordmark { text-align: center; }
.wordmark-acuvue { color: #563482 !important; font-size: 1.55rem !important; font-style: italic; letter-spacing: .08em !important; }
.wordmark-alcon { color: #086aa7 !important; font-size: 1.7rem !important; letter-spacing: -.03em !important; }
.wordmark-bausch { color: #155b67 !important; font-size: 1.25rem !important; }
.wordmark-cooper { color: #253d74 !important; font-size: 1.35rem !important; }

.locations-section { background: linear-gradient(130deg, #eef0ec, #f4ecde 52%, #e5eeea); padding-top: clamp(1.6rem,3vw,3.25rem); }
.page-hero-locations { min-height: 33rem; padding-bottom: 3.5rem; }
.filter-panel { display: grid; grid-template-columns: 1.4fr 1fr 1fr auto; gap: 1rem; align-items: end; background: var(--white); border-radius: var(--radius); padding: 1.2rem; box-shadow: 0 14px 50px rgba(17,24,19,.08); margin-bottom: 2rem; position: relative; z-index: 10; }
.filter-panel label, .contact-form label { color: var(--ink-soft); font-size: .76rem; font-weight: 800; letter-spacing: .04em; }
.filter-panel input, .filter-panel select, .contact-form input, .contact-form select, .contact-form textarea { --spark-angle: 0deg; width: 100%; border: 1px solid transparent; border-radius: .7rem; background: linear-gradient(#fff,#fff) padding-box, conic-gradient(from var(--spark-angle), #737b75 0 37%, #d2aa64 41%, #78a69f 44%, #737b75 48% 100%) border-box; color: var(--ink); padding: .84rem .95rem; box-shadow: 0 2px 7px rgba(17,19,17,.08); outline: none; margin-top: .4rem; transition: box-shadow .2s ease, color .2s ease; animation: sparkBorder 8s linear infinite; }
.filter-panel select, .contact-form select { appearance: none; -webkit-appearance: none; padding-right: 2.75rem; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10'%3E%3Cpath fill='%23111311' d='M1.5 1.25 8 7.75l6.5-6.5L16 2.75l-8 8-8-8z'/%3E%3C/svg%3E") right .95rem center / .72rem auto no-repeat, linear-gradient(#fff,#fff) padding-box, conic-gradient(from var(--spark-angle), #737b75 0 37%, #d2aa64 41%, #78a69f 44%, #737b75 48% 100%) border-box; }
.filter-panel label:nth-child(2) select, .contact-form label:nth-child(2) input { animation-duration: 10s; animation-delay: -4s; }
.filter-panel label:nth-child(3) select, .contact-form label:nth-child(3) input { animation-duration: 12s; animation-delay: -7s; }
.filter-panel input::placeholder, .contact-form input::placeholder, .contact-form textarea::placeholder { color: #b8bcb8; opacity: 1; }
.filter-panel select.is-placeholder, .contact-form select.is-placeholder { color: #b8bcb8; }
.filter-panel select option, .contact-form select option { color: var(--ink); }
.filter-panel input:focus, .filter-panel select:focus, .contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { box-shadow: 0 0 0 3px rgba(94,129,124,.18), 0 2px 7px rgba(17,19,17,.08); animation-duration: 3.5s; }
.result-count { min-width: 6rem; text-align: center; padding: .6rem; border-radius: .75rem; background: linear-gradient(145deg, #ede1c8, #d4b577); }
.result-count strong { display: block; font-family: Georgia, serif; font-size: 1.7rem; line-height: 1; }
.result-count span { font-size: .68rem; text-transform: uppercase; letter-spacing: .09em; }
.location-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
.location-card { display: flex; flex-direction: column; min-height: 25rem; padding: 1.4rem; border-radius: var(--radius); background: linear-gradient(145deg,#fff,#f6f3ec); border: 1px solid rgba(17,19,17,.08); box-shadow: 0 10px 35px rgba(17,24,19,.05); overflow: hidden; transition: transform .35s var(--ease), box-shadow .35s ease, border-color .35s ease; }
.location-card[hidden], .location-card.is-filtered-out { display: none !important; }
.location-card:hover { transform: translateY(-.4rem); box-shadow: var(--shadow); border-color: rgba(196,154,85,.45); }
.location-logo { width: 100%; height: 6.25rem; display: grid; place-items: center; margin: 0 0 1.3rem; padding: .65rem 1rem; border-radius: .8rem; background: linear-gradient(125deg,#171a18,#3e514b 55%,#2b302d); background-size: 180% 180%; border: 1px solid rgba(230,199,141,.32); box-shadow: 0 12px 30px rgba(0,0,0,.14); overflow: hidden; z-index: 2; animation: toneCanvas 12s ease-in-out infinite alternate; }
.location-logo img { width: auto; max-width: 84%; height: auto; max-height: 4.15rem; object-fit: contain; }
.location-logo.logo-eyez img { max-width: 76%; max-height: 3.15rem; }
.location-logo.logo-icare img { max-width: 68%; max-height: 4rem; }
.location-logo.logo-zvc img { max-width: 84%; max-height: 3rem; }
.location-logo.logo-qol img { max-width: 64%; max-height: 3.85rem; }
.location-logo.logo-eyez-plus img { max-width: 72%; max-height: 3.7rem; }
.location-logo.logo-vision-management img { max-width: 84%; max-height: 4rem; }
.location-top { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; }
.location-top span { color: var(--teal); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.location-top small { color: var(--muted); }
.location-card h2 { font-size: 1.85rem; }
.location-card > p { margin-bottom: 1.5rem; }
.location-actions { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: auto; padding-top: 1rem; }
.location-actions a { border: 1px solid var(--line); border-radius: 999px; padding: .55rem .8rem; font-size: .72rem; font-weight: 800; text-decoration: none; background: linear-gradient(145deg, #fff, #f1eee7); transition: background .25s ease, border-color .25s ease; }
.location-actions a:hover { background: #e8dfcb; border-color: var(--gold); }
.empty-state { text-align: center; padding: 5rem 1rem; }

.contact-layout { display: grid; grid-template-columns: .65fr 1.35fr; gap: clamp(3rem,8vw,9rem); align-items: start; }
.contact-details { position: sticky; top: calc(var(--header-height) + 2rem); }
.contact-media { border-radius: var(--radius); aspect-ratio: 4 / 3; margin-bottom: 2rem; box-shadow: var(--shadow); }
.contact-media img { width: 100%; height: 100%; object-fit: cover; }
.contact-detail { border-top: 1px solid var(--line); padding: 1.2rem 0; display: flex; flex-direction: column; }
.contact-detail span { color: var(--muted); font-size: .73rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.contact-detail a { font-weight: 700; }
.privacy-note { font-size: .86rem; border-left: 2px solid var(--gold); padding-left: 1rem; margin-top: 2rem; }
.contact-form-wrap { background: #f0eee8; padding: clamp(1.5rem,4vw,4rem); border-radius: var(--radius); border: 1px solid rgba(17,19,17,.09); }
.contact-form-media { height: clamp(17rem,25vw,22rem); margin: calc(clamp(1.5rem,4vw,4rem) * -1) calc(clamp(1.5rem,4vw,4rem) * -1) 2rem; border-radius: var(--radius) var(--radius) 0 0; }
.contact-form-media img { width: 100%; height: 100%; object-fit: cover; }
.contact-form-media .contact-form-image { object-position: 50% 24%; }
.form-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
.form-wide { grid-column: 1 / -1; }
.contact-form textarea { resize: vertical; min-height: 9rem; }
.consent-field { display: flex !important; align-items: flex-start; gap: .7rem; margin: 1rem 0; font-weight: 500 !important; letter-spacing: 0 !important; }
.consent-field input { width: 1.1rem; height: 1.1rem; margin: .2rem 0 0; box-shadow: none; background: #fff; border: 1px solid #737b75; animation: none; }
.form-note { font-size: .78rem; margin: .7rem 0 0; }
.form-security-note { display: flex; align-items: center; gap: .48rem; color: #496057; }
.security-lock { flex: 0 0 auto; width: 1.12rem; height: 1.12rem; display: inline-grid; place-items: center; color: #278a4c; }
.security-lock svg { width: 100%; height: 100%; fill: currentColor; }
.honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.page-alert { padding: 1rem 1.2rem; border-radius: .75rem; margin-top: 1.2rem; border: 1px solid; }
.page-alert.success { background: #edf7f0; border-color: #78a886; color: #234d2e; }
.page-alert.error { background: #fff0ef; border-color: #c77f78; color: #742a24; }

.faq-layout { display: grid; grid-template-columns: minmax(15rem,.55fr) minmax(0,1.45fr); gap: clamp(2rem,6vw,7rem); align-items: start; }
.faq-media { position: sticky; top: calc(var(--header-height) + 2rem); border-radius: var(--radius); aspect-ratio: 4 / 5; box-shadow: var(--shadow); }
.faq-media img { width: 100%; height: 100%; object-fit: cover; }
.faq-list { max-width: 74rem; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item:first-child { border-top: 1px solid var(--line); }
.faq-item summary { list-style: none; display: flex; justify-content: space-between; gap: 2rem; align-items: center; cursor: pointer; padding: 1.7rem 0; font-family: Georgia, serif; font-size: clamp(1.2rem,2vw,1.7rem); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary span { color: var(--gold); font-family: Arial, sans-serif; font-weight: 300; font-size: 1.8rem; transition: transform .25s ease; }
.faq-item[open] summary span { transform: rotate(45deg); }
.faq-item div { padding: 0 3rem 1.7rem 0; max-width: 60rem; }
.legal-content { max-width: 72rem; }
.legal-media { width: min(42rem,100%); aspect-ratio: 16 / 7; border-radius: var(--radius); margin-bottom: 4rem; box-shadow: var(--shadow); }
.legal-media img { width: 100%; height: 100%; object-fit: cover; }
.legal-content h2 { font-size: 2rem; margin-top: 3rem; }
.legal-content p { font-size: 1.05rem; }

.group-brands { position: relative; isolation: isolate; overflow: hidden; padding: clamp(4.5rem,7vw,7rem) 0; color: var(--white); background: linear-gradient(128deg,#171a18,#263833 50%,#30291e); }
.group-brands::before { content: ""; position: absolute; inset: -40%; z-index: -1; pointer-events: none; opacity: .66; background: radial-gradient(circle at 24% 32%,rgba(196,154,85,.24),transparent 24%),radial-gradient(circle at 76% 70%,rgba(94,129,124,.32),transparent 27%),linear-gradient(115deg,transparent 31%,rgba(255,255,255,.08),transparent 66%); animation: sectionToneDrift 17s ease-in-out infinite alternate; }
.group-brands-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(18rem,.55fr); align-items: end; gap: clamp(2rem,5vw,5rem); margin-bottom: 3rem; }
.group-brands-heading h2 { max-width: 55rem; margin-bottom: 0; }
.group-brands-heading > p { color: rgba(255,255,255,.68); margin-bottom: .3rem; }
.group-brand-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border-top: 1px solid rgba(255,255,255,.16); border-left: 1px solid rgba(255,255,255,.16); }
.group-brand-card { position: relative; min-height: 9rem; display: grid; place-items: center; padding: 1rem; overflow: hidden; border-right: 1px solid rgba(255,255,255,.16); border-bottom: 1px solid rgba(255,255,255,.16); background: rgba(7,10,8,.2); transition: background .3s ease, transform .35s var(--ease); }
.group-brand-card:hover { background: rgba(196,154,85,.12); transform: translateY(-.2rem); }
.group-brand-card img { width: auto; max-width: 90%; height: auto; max-height: 4.6rem; object-fit: contain; }
.group-brand-card.group-logo-icare img { max-width: 82%; }
.group-brand-card.group-logo-eyez img { max-width: 88%; }
.group-brand-card.group-logo-zvc img { max-width: 96%; }
.group-brand-card.group-logo-qol img { max-width: 78%; }
.group-brand-card.group-logo-eyez-plus img { max-width: 88%; }
.group-brand-card.group-logo-vision-management { width: min(100%,48rem); min-height: 10rem; margin: -1px auto 0; border: 1px solid rgba(255,255,255,.16); }
.group-brand-card.group-logo-vision-management img { max-width: 88%; max-height: 6.1rem; }

.site-footer { background: #101210; color: var(--white); padding: 5rem 0 1.5rem; }
.footer-grid { display: grid; grid-template-columns: 1.5fr repeat(3,1fr); gap: clamp(2rem,5vw,6rem); padding-bottom: 4rem; }
.footer-brand img { width: 12rem; margin-bottom: 1.3rem; }
.footer-brand p { max-width: 22rem; }
.site-footer h2 { font-family: Inter, sans-serif; font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 1.2rem; }
.site-footer a { display: block; width: fit-content; color: rgba(255,255,255,.68); text-decoration: none; margin: .55rem 0; transition: color .2s ease, transform .2s ease; }
.site-footer a:hover { color: var(--white); transform: translateX(.18rem); }
.site-footer p { color: rgba(255,255,255,.52); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.11); padding-top: 1.4rem; display: flex; justify-content: space-between; gap: 2rem; align-items: center; }
.footer-bottom p, .footer-bottom a { font-size: .76rem; margin: 0; }

.chat-launcher { position: fixed; right: 1.4rem; bottom: calc(1.875rem + env(safe-area-inset-bottom, 0px)); z-index: 95; min-height: 3.3rem; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; background: linear-gradient(145deg, #527770, #304d49); color: var(--white); padding: .78rem 1.15rem; box-shadow: 0 12px 40px rgba(22,45,40,.34); font-weight: 800; font-size: .79rem; letter-spacing: .03em; cursor: pointer; display: flex; gap: .65rem; align-items: center; transition: transform .3s var(--ease), filter .3s ease; }
.chat-launcher:hover { transform: translateY(-.25rem); filter: brightness(1.08); }
.chat-pulse { width: .72rem; height: .72rem; background: #bde0c7; border-radius: 50%; position: relative; }
.chat-pulse::after { content: ""; position: absolute; inset: 0; border: 1px solid #bde0c7; border-radius: 50%; animation: chatPulse 2.6s ease-out infinite; }
.chat-launcher.jump { animation: chatJump .6s ease 3; }
.chat-launcher.wobble { animation: chatWobble .75s ease 2; }
.contact-drawer { position: fixed; inset: 0; z-index: 200; }
.drawer-backdrop { position: absolute; inset: 0; border: 0; background: rgba(6,8,7,.72); backdrop-filter: blur(7px); }
.drawer-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(42rem,100%); background: #f4f1e9; padding: clamp(1.2rem,3.5vw,3.2rem); overflow-y: auto; box-shadow: -20px 0 70px rgba(0,0,0,.25); animation: drawerIn .45s var(--ease); }
.drawer-heading { display: flex; justify-content: space-between; gap: 2rem; align-items: start; border-bottom: 1px solid var(--line); margin-bottom: 1.4rem; }
.drawer-media { height: 11rem; border-radius: var(--radius); margin-bottom: 1.4rem; box-shadow: var(--shadow); }
.drawer-media img { width: 100%; height: 100%; object-fit: cover; }
.drawer-heading h2 { font-size: 2.5rem; }
.drawer-close { border: 1px solid var(--line); background: var(--white); color: var(--ink); border-radius: 50%; width: 2.8rem; height: 2.8rem; cursor: pointer; font-size: 1.7rem; line-height: 1; }
.back-to-top { position: fixed; left: 50%; bottom: 1.25rem; transform: translate(-50%, 5rem); opacity: 0; z-index: 90; width: 2.85rem; height: 2.85rem; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); color: var(--white); background: rgba(17,19,17,.86); backdrop-filter: blur(10px); cursor: pointer; transition: transform .35s var(--ease), opacity .35s ease; }
.back-to-top.visible { transform: translate(-50%, 0); opacity: 1; }
.submit-progress { height: .28rem; border-radius: 999px; background: rgba(17,19,17,.1); overflow: hidden; margin-top: 1rem; }
.submit-progress i { display: block; width: var(--progress,0%); height: 100%; background: linear-gradient(90deg, var(--teal), var(--gold)); transition: width .3s ease; }

body.motion-ready .reveal { opacity: 0; transform: translateY(1.6rem); }
body.motion-ready .reveal.is-visible { opacity: 1; transform: none; transition: opacity .8s var(--ease), transform .8s var(--ease); }
body.motion-ready img[data-legacy-image] { opacity: 0; transform: scale(1.035) translateY(1rem); filter: brightness(.92) saturate(.92); transition: opacity .9s var(--ease), transform 1.15s var(--ease), filter 1.15s ease; }
body.motion-ready img[data-legacy-image][data-motion="slide-left"] { transform: scale(1.025) translateX(1.6rem); }
body.motion-ready img[data-legacy-image][data-motion="slide-right"] { transform: scale(1.025) translateX(-1.6rem); }
body.motion-ready img[data-legacy-image].is-inview { opacity: 1; transform: none; filter: brightness(1) saturate(1); }
img[data-legacy-image] { transition: transform .7s var(--ease), filter .7s ease; }
figure:hover > img[data-legacy-image], picture:hover > img[data-legacy-image], .brand-logo-card:hover img[data-legacy-image], .location-card:hover img[data-legacy-image] { transform: scale(1.035); filter: brightness(1.045) saturate(1.04); }

@keyframes heroBreathe { from { transform: scale(1); filter: saturate(.92) contrast(1.03); } to { transform: scale(1.035); filter: saturate(1.05) contrast(1.06); } }
@keyframes lightLineRun { 0% { transform: translate(-120vw,-25vh) rotate(18deg); opacity: 0; } 12% { opacity: .9; } 68% { opacity: .55; } 100% { transform: translate(48vw,82vh) rotate(18deg); opacity: 0; } }
@keyframes lightCircleRun { 0%,100% { transform: translate(24vw,-18vh) scale(.55); opacity: 0; } 18% { opacity: .72; } 54% { transform: translate(-12vw,16vh) scale(1); opacity: .68; } 82% { opacity: 0; } }
@keyframes lightSquareRun { 0%,100% { transform: translate(-44vw,35vh) rotate(0deg) scale(.7); opacity: 0; } 16% { opacity: .68; } 64% { transform: translate(18vw,-22vh) rotate(210deg) scale(1); opacity: .55; } 84% { opacity: 0; } }
@keyframes lightTriangleRun { 0%,100% { transform: translate(20vw,32vh) rotate(-18deg) scale(.65); opacity: 0; } 20% { opacity: .62; } 58% { transform: translate(-42vw,-12vh) rotate(125deg) scale(1); opacity: .58; } 82% { opacity: 0; } }
@keyframes sparkBorder { to { --spark-angle: 360deg; } }
@keyframes sectionToneDrift { 0% { transform: translate3d(-4%,-3%,0) rotate(-3deg) scale(1); filter: hue-rotate(0deg); } 100% { transform: translate3d(5%,4%,0) rotate(4deg) scale(1.08); filter: hue-rotate(18deg); } }
@keyframes toneCanvas { 0% { background-position: 0% 42%; } 100% { background-position: 100% 58%; } }
@keyframes panelShapeDrift { 0% { transform: translate(-2rem,1rem) rotate(20deg); opacity: .34; } 100% { transform: translate(3rem,-2rem) rotate(80deg); opacity: .72; } }
@keyframes slowOrbit { to { transform: rotate(360deg) scale(1.03); } }
@keyframes mediaGlow { 0% { box-shadow: 0 16px 42px rgba(44,83,76,.16), 0 0 0 1px rgba(196,154,85,.16); } 50% { box-shadow: 0 20px 58px rgba(196,154,85,.34), 0 0 1.6rem rgba(230,199,141,.22), 0 0 0 1px rgba(255,255,255,.38); } 100% { box-shadow: 0 18px 54px rgba(68,122,112,.31), 0 0 1.9rem rgba(126,184,174,.2), 0 0 0 1px rgba(255,255,255,.3); } }
@keyframes serviceImageGlow { 0% { filter: brightness(1.01) saturate(1.01) drop-shadow(0 .15rem .2rem rgba(230,199,141,.08)); } 50% { filter: brightness(1.09) saturate(1.08) drop-shadow(0 .3rem .7rem rgba(230,199,141,.38)); } 100% { filter: brightness(1.05) saturate(1.05) drop-shadow(0 .25rem .65rem rgba(110,170,161,.34)); } }
@keyframes missionLineRun { 0% { left: -34vw; opacity: 0; } 10% { opacity: .88; } 88% { opacity: .55; } 100% { left: 108vw; opacity: 0; } }
@keyframes missionEyeBounce { 0%,100% { left: 1%; top: 16%; transform: rotate(-8deg); } 24% { left: 38%; top: 72%; transform: rotate(18deg); } 50% { left: calc(99% - var(--shape-size)); top: 38%; transform: rotate(-12deg); } 76% { left: 55%; top: 5%; transform: rotate(13deg); } }
@keyframes missionGlassesBounce { 0%,100% { left: calc(99% - var(--shape-size)); top: 13%; transform: rotate(8deg); } 27% { left: 46%; top: 75%; transform: rotate(-15deg); } 52% { left: 1%; top: 47%; transform: rotate(12deg); } 78% { left: 62%; top: 7%; transform: rotate(-8deg); } }
@keyframes missionLensBounce { 0%,100% { left: 1%; top: 76%; transform: rotate(0deg) scale(.9); } 32% { left: 52%; top: 8%; transform: rotate(150deg) scale(1.05); } 58% { left: calc(99% - var(--shape-size)); top: 58%; transform: rotate(270deg) scale(.94); } 82% { left: 35%; top: 84%; transform: rotate(330deg) scale(1); } }
@keyframes missionFrameBounce { 0%,100% { left: calc(99% - var(--shape-size)); top: 78%; transform: rotate(12deg); } 22% { left: 58%; top: 20%; transform: rotate(-24deg); } 51% { left: 1%; top: 62%; transform: rotate(18deg); } 77% { left: 31%; top: 4%; transform: rotate(70deg); } }
@keyframes chatPulse { 0% { transform: scale(1); opacity: .8; } 80%,100% { transform: scale(3.2); opacity: 0; } }
@keyframes chatJump { 0%,100% { transform: translateY(0); } 45% { transform: translateY(-.7rem); } }
@keyframes chatWobble { 0%,100% { transform: rotate(0); } 25% { transform: rotate(-4deg); } 75% { transform: rotate(4deg); } }
@keyframes drawerIn { from { transform: translateX(100%); } to { transform: none; } }

@media (max-width: 1120px) {
    .site-shell { min-width: 0; }
    .service-grid { grid-template-columns: repeat(2,1fr); }
    .service-card:nth-child(3) { border-left: 1px solid rgba(255,255,255,.12); }
    .value-grid { grid-template-columns: repeat(2,1fr); }
    .brand-logo-grid { grid-template-columns: repeat(4,1fr); }
    .lens-partners { grid-template-columns: minmax(12rem,.55fr) 1fr; }
    .lens-partners .partner-list { grid-column: 1 / -1; }
    .location-grid { grid-template-columns: repeat(2,1fr); }
    .filter-panel { grid-template-columns: repeat(3,1fr); }
    .result-count { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; gap: .5rem; }
    .group-brand-grid { grid-template-columns: repeat(3,1fr); }
    .group-brand-card.group-logo-vision-management { width: min(100%,44rem); }
}

@media (max-width: 900px) {
    :root { --header-height: 4.8rem; }
    .site-shell { width: min(92vw, 52rem); min-width: 0; }
    .menu-toggle { display: block; z-index: 3; }
    .primary-navigation { position: fixed; inset: 0; z-index: 2; background-color: #0d0f0e; background-image: linear-gradient(145deg, #0d0f0e 0%, #18231f 56%, #2a2419 100%); flex-direction: column; justify-content: center; align-items: stretch; padding: 6rem 8vw 3rem; overflow-y: auto; transform: translateX(100%); visibility: hidden; opacity: 1; transition: transform .4s var(--ease), visibility .4s; }
    .primary-navigation.open { transform: none; visibility: visible; }
    .primary-navigation a { font-family: Georgia, serif; font-weight: 500; text-transform: none; letter-spacing: 0; font-size: clamp(1.9rem,7vw,3.2rem); border-bottom: 1px solid rgba(255,255,255,.1); padding: .5rem 0; }
    .primary-navigation .nav-cta { text-align: center; font-family: Inter, sans-serif; font-size: .9333rem; text-transform: uppercase; letter-spacing: .08em; margin-top: 1rem; }
    .hero-section { min-height: 52rem; align-items: end; padding-bottom: 4rem; }
    .hero-picture img { object-position: 68% center; }
    .hero-shade { background: linear-gradient(0deg, rgba(7,9,8,.96) 0%, rgba(7,9,8,.72) 52%, rgba(7,9,8,.16) 100%); }
    .hero-content > * { max-width: 42rem; }
    .trust-grid { grid-template-columns: repeat(2,1fr); }
    .trust-grid .trust-image { grid-column: 1 / -1; height: 13rem; }
    .trust-grid div:nth-child(4) { border-left: 1px solid rgba(255,255,255,.11); border-top: 1px solid rgba(255,255,255,.11); }
    .trust-grid div:nth-child(5) { border-top: 1px solid rgba(255,255,255,.11); }
    .split-intro, .editorial-grid, .lens-partners, .contact-layout, .faq-layout { grid-template-columns: 1fr; gap: 3rem; }
    .section-media { width: min(28rem,100%); aspect-ratio: 16 / 9; }
    .editorial-media { width: min(38rem,100%); }
    .section-heading { grid-template-columns: 1fr; align-items: start; gap: 1rem; }
    .concept-card.featured { grid-template-columns: minmax(10rem,.5fr) 1fr; }
    .journey-grid { grid-template-columns: 1fr; }
    .journey-image { height: 12rem; }
    .journey-grid article { min-height: 15rem; }
    .journey-grid b { margin-bottom: 2.5rem; }
    .location-callout .site-shell { grid-template-columns: minmax(12rem,.55fr) 1fr; align-items: center; }
    .location-callout .button { grid-column: 2; justify-self: start; }
    .service-detail { grid-template-columns: 5rem 1fr; }
    .service-detail figure, .service-detail > div:last-child { grid-column: 2; }
    .brand-logo-grid { grid-template-columns: repeat(3,1fr); }
    .campaign-grid { grid-template-columns: 1fr; }
    .campaign-card.campaign-wide { grid-column: auto; }
    .contact-details, .faq-media { position: static; }
    .group-brands-heading { grid-template-columns: 1fr; align-items: start; gap: 1rem; }
    .footer-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 680px) {
    body { font-size: 1.0533rem; }
    h1 { font-size: clamp(2.483rem,calc(13vw - .167rem),3.833rem); }
    .site-shell { width: 90vw; }
    .brand-mark { width: 9.8rem; }
    .hero-section { min-height: 48rem; }
    .hero-picture img { object-position: 67% center; }
    .page-hero-about .page-hero-visual img { object-position: 74% 30%; }
    .page-hero-services .page-hero-visual img { object-position: 78% 44%; }
    .page-hero-brands .page-hero-visual img { object-position: 82% 38%; }
    .page-hero-locations .page-hero-visual img, .page-hero-contact .page-hero-visual img { object-position: 72% 12%; }
    .page-hero-general .page-hero-visual img { object-position: 74% 30%; }
    .hero-geometry { opacity: .5; }
    .light-square, .light-triangle { display: none; }
    .button-row, .button { width: 100%; }
    .trust-grid { grid-template-columns: 1fr 1fr; }
    .trust-grid div { min-height: 7.2rem; padding: 1rem; }
    .service-grid { grid-template-columns: 1fr; }
    .service-card, .service-card:nth-child(3) { border-left: 1px solid rgba(255,255,255,.12); min-height: 20rem; }
    .concept-grid { grid-template-columns: 1fr; }
    .concept-card, .concept-card:nth-child(even), .concept-card.featured { grid-column: auto; grid-template-columns: 7rem 1fr; border-right: 0; padding: 1.2rem .5rem; }
    .concept-photo, .concept-card.featured .concept-photo { height: 7rem; }
    .concept-media, .concept-card.featured .concept-media { height: 7rem; }
    .concept-photo-eyez { --concept-scale: 1.24; }
    .concept-photo-icare { --concept-scale: 1.28; }
    .concept-photo-zvc { --concept-scale: 1.22; }
    .page-hero { min-height: 34rem; padding-top: calc(var(--header-height) + 5rem); }
    .timeline article { grid-template-columns: 1fr; gap: .5rem; }
    .value-grid { grid-template-columns: 1fr; }
    .service-detail { grid-template-columns: 1fr; }
    .service-detail figure, .service-detail > div:last-child { grid-column: auto; }
    .service-detail ul { grid-template-columns: 1fr; }
    .brand-logo-grid { grid-template-columns: repeat(2,1fr); }
    .brand-logo-card { min-height: 8.5rem; padding: .8rem; }
    .brand-logo-card img { width: 92%; max-width: 10rem; max-height: 5.4rem; }
    .campaign-card.campaign-nine-clean { aspect-ratio: 4 / 5; }
    .campaign-card.campaign-nine-clean::after { content: ""; position: absolute; left: 0; bottom: 0; z-index: 2; width: 58%; height: 18%; background: #f8f4eb; pointer-events: none; }
    .partner-list { grid-template-columns: 1fr; }
    .filter-panel { position: static; grid-template-columns: 1fr; }
    .result-count { grid-column: auto; }
    .location-grid { grid-template-columns: 1fr; }
    .location-card { min-height: 24rem; }
    .location-callout .site-shell { grid-template-columns: 1fr; }
    .location-callout .button { grid-column: auto; }
    .callout-media { width: 100%; max-width: 28rem; }
    .form-grid { grid-template-columns: 1fr; }
    .form-wide { grid-column: auto; }
    .contact-form-wrap { padding: 1.25rem; }
    .contact-form-media { height: 19rem; }
    .group-brand-grid { grid-template-columns: repeat(2,1fr); }
    .group-brand-card { min-height: 7.5rem; padding: .75rem; }
    .group-brand-card img { max-width: 90%; max-height: 4.2rem; }
    .group-brand-card.group-logo-vision-management { width: 100%; min-height: 8rem; }
    .group-brand-card.group-logo-vision-management img { max-width: 92%; max-height: 5rem; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; align-items: start; }
    .chat-launcher { right: .8rem; bottom: calc(1.875rem + env(safe-area-inset-bottom, 0px)); }
    .chat-launcher span:last-child { display: none; }
    .chat-launcher { width: 3.3rem; padding: 0; justify-content: center; }
    .drawer-panel { padding: 1.2rem; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
    body.motion-ready .reveal { opacity: 1; transform: none; }
    body.motion-ready img[data-legacy-image] { opacity: 1; transform: none; filter: none; }
    .mission-motion { display: none; }
}