/* Advanced Eye Care 1.1.0 — bilingual + motion layer ("Into Focus").
   All motion stops with prefers-reduced-motion or the "Pause motion" accessibility tool (html.a11y-still). */

/* ---------- language ---------- */
.lang-en .t-es,.lang-es .t-en{display:none!important}
html:not(.lang-en):not(.lang-es) .t-es{display:none!important}
.lang-btn{min-height:44px; padding:0 16px; border-radius:999px; border:1.5px solid currentColor; background:transparent; color:inherit; font:600 var(--fs-sm) var(--sans); cursor:pointer; transition:background .2s,color .2s}
.lang-btn:hover{background:var(--navy); color:#fff; border-color:var(--navy)}
body.home header.site .lang-btn:hover{background:#fff; color:var(--navy); border-color:#fff}
@media (max-width:760px){header.site .lang-btn{display:none}}

/* ---------- modern links: no plain underlines, animated rule instead ---------- */
.ip-entry a,.ip-intro a,.ip-note a,.ans a,.consent a,.fmail a{color:var(--brass-text); font-weight:600; text-decoration:none; background:linear-gradient(currentColor,currentColor) left bottom/100% 2px no-repeat; padding-bottom:1px; transition:background-size .35s var(--ease-out),color .2s}
.ip-entry a:hover,.ip-intro a:hover,.ip-note a:hover,.ans a:hover,.consent a:hover{background-size:0 2px}
.fmail a{color:#fff}
.ip-card .more{display:inline-flex; gap:8px; align-items:center; margin-top:14px; font-weight:700; color:var(--brass-text); text-decoration:none; border:0}
.ip-card .more span{transition:transform .3s var(--ease-out)}
.ip-card .more:hover span{transform:translateX(5px)}
html.a11y-links a{text-decoration:underline!important}

/* ---------- scroll progress ---------- */
.aec-progress{position:fixed; left:0; top:0; height:3px; width:100%; z-index:200; transform-origin:left; transform:scaleX(var(--sp,0)); background:linear-gradient(90deg,var(--brass),var(--brass-light)); pointer-events:none}

/* ---------- hero: live iris ---------- */
.aec-hero .aec-iris{position:absolute; inset:0; width:100%; height:100%}
.aec-hero #irisLook{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.aec-cue{position:absolute; left:50%; bottom:22px; width:26px; height:42px; margin-left:-13px; border:2px solid rgba(255,255,255,.55); border-radius:16px; z-index:3}
.aec-cue span{position:absolute; left:50%; top:7px; width:4px; height:8px; margin-left:-2px; border-radius:2px; background:var(--brass-light); animation:aecCue 1.8s ease-in-out infinite}
@keyframes aecCue{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}
@media (max-width:760px){.aec-cue{display:none}}

/* ---------- focus story ---------- */
.aec-focus{position:relative; background:var(--navy-3); color:#d8d8dc; padding:110px 0; overflow:clip}
.aec-focus::before{content:""; position:absolute; inset:0; background:radial-gradient(50% 60% at 18% 50%,rgba(168,25,46,.28),transparent 70%),radial-gradient(40% 50% at 95% 100%,rgba(255,143,156,.12),transparent 70%); pointer-events:none}
.aec-focus__grid{position:relative; display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:center}
.aec-focus__art{position:relative; display:grid; place-items:center; aspect-ratio:1; max-width:520px; width:100%; margin:0 auto}
.aec-chart{position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:.18em; background:#fbfaf8; color:#111; border-radius:18px; padding:34px 44px 28px; box-shadow:0 40px 80px -30px rgba(0,0,0,.8); font-family:Georgia,"Times New Roman",serif; line-height:1}
.aec-chart span{display:block; font-size:calc(4.2rem - var(--r) * .58rem); letter-spacing:.14em; filter:blur(calc(var(--blur,0) * (1 + var(--r) * .35) * 1px)); transition:filter .15s linear}
.aec-lens{position:absolute; inset:0; pointer-events:none}
.aec-lens i{position:absolute; inset:2%; border-radius:50%; border:2px solid rgba(255,143,156,.35); transform:rotate(calc(var(--focus,1) * 120deg))}
.aec-lens i:nth-child(2){inset:9%; border-style:dashed; border-color:rgba(255,255,255,.2); transform:rotate(calc(var(--focus,1) * -200deg))}
.aec-lens i:nth-child(3){inset:-3%; border-width:10px; border-color:rgba(168,25,46,.45); clip-path:inset(0 0 50% 0)}
.aec-meter{position:absolute; left:50%; bottom:-34px; width:70%; margin-left:-35%; height:6px; border-radius:6px; background:rgba(255,255,255,.12)}
.aec-meter__fill{position:absolute; inset:0; border-radius:6px; background:linear-gradient(90deg,var(--brass),var(--brass-light)); transform-origin:left; transform:scaleX(var(--focus,1))}
.aec-meter__lbl{position:absolute; left:0; top:12px; font:700 .72rem var(--sans); letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.62)}
.aec-focus h2{color:#fff; font-family:var(--serif); font-size:var(--fs-xl); line-height:1.02; margin:6px 0 30px}
.aec-focus .eyebrow{color:var(--brass-light)}
.aec-steps{list-style:none; margin:0 0 34px; padding:0; display:grid; gap:4px}
.aec-step{position:relative; display:grid; grid-template-columns:52px 1fr; column-gap:10px; padding:14px 0 14px 18px; border-left:2px solid rgba(255,255,255,.14); transition:opacity .45s}
.aec-step::before{content:""; position:absolute; left:-2px; top:0; width:2px; height:100%; background:linear-gradient(var(--brass-light),var(--brass)); transform:scaleY(0); transform-origin:top; transition:transform .6s var(--ease-out)}
.aec-step__n{grid-row:span 2; font:700 1rem/1.7 var(--sans); color:rgba(255,255,255,.55)}
.aec-step h3{color:#fff; font:400 clamp(1.3rem,2vw,1.7rem)/1.25 var(--serif); margin:0}
.aec-step p{margin:6px 0 0; color:#c4c4ca; max-width:30em}
/* pinned version (JS adds .is-pin) */
.aec-focus.is-pin{height:330vh; padding:0}
.aec-focus.is-pin .aec-focus__stick{position:sticky; top:0; height:100vh; height:100svh; display:flex; align-items:center}
.aec-focus.is-pin .aec-step{opacity:.4}
.aec-focus.is-pin .aec-step p{display:grid; grid-template-rows:0fr; overflow:hidden; opacity:0; margin:0; transition:grid-template-rows .5s var(--ease-out),opacity .4s,margin .4s}
.aec-focus.is-pin .aec-step p>span{min-height:0}
.aec-focus.is-pin .aec-step.is-on{opacity:1}
.aec-focus.is-pin .aec-step.is-on p{grid-template-rows:1fr; opacity:1; margin-top:6px}
.aec-focus.is-pin .aec-step.is-on::before,.aec-focus.is-pin .aec-step.is-done::before{transform:scaleY(1)}
.aec-focus.is-pin .aec-step.is-on .aec-step__n{color:var(--brass-light)}
.aec-focus.is-pin .aec-step.is-done{opacity:.68}
@media (max-width:900px){
  .aec-focus{padding:80px 0}
  .aec-focus__grid{grid-template-columns:1fr; gap:46px}
  .aec-focus__art{max-width:300px}
  .aec-chart{padding:20px 26px 16px}
  .aec-chart span{font-size:calc(2.6rem - var(--r) * .36rem)}
  .aec-focus.is-pin .aec-focus__grid{grid-template-columns:118px 1fr; gap:18px; align-items:center}
  .aec-focus.is-pin .aec-focus__art{max-width:118px}
  .aec-focus.is-pin .aec-chart{padding:10px 8px 8px; border-radius:10px}
  .aec-focus.is-pin .aec-chart span{font-size:calc(1.35rem - var(--r) * .17rem); letter-spacing:.06em}
  .aec-focus.is-pin .aec-meter{bottom:-22px; width:100%; margin-left:-50%}
  .aec-focus.is-pin .aec-meter__lbl{display:none}
  .aec-focus h2{font-size:clamp(2rem,9vw,2.6rem); margin-bottom:18px}
  .aec-step{grid-template-columns:1fr; padding:10px 0 10px 14px}
  .aec-step__n{grid-row:auto; font-size:.8rem; line-height:1.4}
  .aec-step h3{font-size:1.15rem}
  .aec-step p{font-size:.95rem}
}

/* ---------- marquee ---------- */
.aec-marquee{overflow:hidden; background:#fff; padding:34px 0 30px; border-top:1px solid var(--line)}
.aec-marquee__track{display:flex; align-items:center; gap:34px; width:max-content; font:400 clamp(2.6rem,7vw,6rem)/1 var(--serif); color:var(--navy); transform:skewX(var(--skew,0deg)); animation:aecMarq 40s linear infinite}
.aec-marquee__track .o{color:transparent; -webkit-text-stroke:1.5px var(--brass)}
.aec-marquee__track i{font-style:normal; color:var(--brass); font-size:.5em}
@keyframes aecMarq{to{translate:-50% 0}}

/* ---------- cards: tilt + light ---------- */
.aec-tilt{transform-style:preserve-3d; will-change:transform}
.aec-tilt::before{content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:2; opacity:0; transition:opacity .3s; background:radial-gradient(260px circle at var(--lx,50%) var(--ly,50%),rgba(255,255,255,.22),transparent 60%)}
.aec-tilt:hover::before{opacity:1}
.ip-card{position:relative}
.aec-card-n{display:block; font:700 .78rem var(--sans); letter-spacing:.2em; color:var(--brass-text); margin-bottom:10px}

/* ---------- inner page band: dark, with the page's own art ---------- */
.ip-hero.aec-band{position:relative; overflow:hidden; isolation:isolate; background:var(--navy-3); color:#d8d8dc; padding:64px 0 70px; border:0; text-align:left}
.aec-band .g{display:grid!important; grid-template-columns:1.15fr .85fr; gap:48px; align-items:center; text-align:left}
.aec-band:not(.has-art) .g{grid-template-columns:1fr}
.aec-band h1{color:#fff; text-transform:none; letter-spacing:-.01em; font-family:var(--serif); font-size:clamp(2.3rem,5.2vw,4.4rem); line-height:1.02; max-width:15ch; margin:0}
.aec-band .lead{color:#c9c9cf; font-size:1.15rem; margin-top:18px; max-width:42ch}
.aec-band__crumb{margin:0 0 18px; font:600 .78rem var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--brass-light)}
.aec-band__crumb a{color:#fff; text-decoration:none; background:linear-gradient(currentColor,currentColor) left bottom/0 1px no-repeat; transition:background-size .3s}
.aec-band__crumb a:hover{background-size:100% 1px}
.aec-band__crumb span[aria-hidden]{opacity:.5; margin:0 6px}
.aec-band__art img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:22px; box-shadow:0 40px 80px -30px rgba(0,0,0,.8); animation:aecFloat 7s ease-in-out infinite}
.aec-band__art img.ip-doc{aspect-ratio:1; object-position:50% 20%}
@keyframes aecFloat{50%{transform:translateY(-10px) rotate(-.6deg)}}
.aec-band__rings{position:absolute; right:-12vw; top:50%; width:60vw; aspect-ratio:1; transform:translateY(-50%); z-index:-1; pointer-events:none}
.aec-band__rings i{position:absolute; inset:0; border-radius:50%; border:1px solid rgba(255,143,156,.16); animation:aecSpin 80s linear infinite}
.aec-band__rings i:nth-child(2){inset:12%; border-style:dashed; animation-duration:120s; animation-direction:reverse}
.aec-band__rings i:nth-child(3){inset:26%; border-color:rgba(168,25,46,.4); border-width:2px}
@keyframes aecSpin{to{transform:rotate(360deg)}}
.aec-band::after{content:""; position:absolute; inset:0; z-index:-2; background:radial-gradient(45% 80% at 85% 120%,rgba(168,25,46,.45),transparent 70%),radial-gradient(35% 60% at 0% 0%,rgba(255,143,156,.12),transparent 70%)}
@media (max-width:900px){.aec-band .g{grid-template-columns:1fr; gap:28px}.aec-band__art{max-width:420px}.ip-hero.aec-band{padding:44px 0 50px}}

/* per-page layouts so inner pages don't look cookie-cutter */
.aec-body--steps .ip-cards{counter-reset:s}
.aec-body--steps .ip-card{border-top:0; border-left:4px solid var(--brass); background:var(--soft)}
.aec-body--split .ip-intro{grid-template-columns:1fr; max-width:820px}
.aec-body--split .ip-cards{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.aec-body--split .ip-card{background:var(--navy); color:#d8d8dc; border:0}
.aec-body--split .ip-card h3{color:#fff}
.aec-body--split .ip-card .aec-card-n,.aec-body--split .ip-card .more{color:var(--brass-light)}
.aec-body--alert .ip-intro{border-left:6px solid var(--brass); padding-left:28px}
.aec-body--alert .ip-card{border-top-color:var(--brass); background:#fff5f6}
.aec-body--profile .ip-intro{grid-template-columns:1fr; max-width:860px}
.aec-body--profile .ip-intro .txt p:first-child{font-size:1.25rem; color:var(--ink)}
.aec-body--grid .ip-card{background:#fff; box-shadow:0 18px 40px -26px rgba(18,18,22,.35)}

/* ---------- cursor halo ---------- */
.aec-cursor{position:fixed; left:0; top:0; width:34px; height:34px; margin:-17px 0 0 -17px; border-radius:50%; border:1.5px solid rgba(168,25,46,.75); pointer-events:none; z-index:9999; opacity:0; transition:width .25s,height .25s,margin .25s,background .25s,opacity .3s}
.aec-cursor.is-on{opacity:1}
.aec-cursor.is-link{width:62px; height:62px; margin:-31px 0 0 -31px; background:rgba(168,25,46,.1)}

/* ---------- page-to-page fade ---------- */
@view-transition{navigation:auto}
::view-transition-old(root){animation:aecVtOut .25s ease both}
::view-transition-new(root){animation:aecVtIn .4s cubic-bezier(.2,.8,.2,1) both}
@keyframes aecVtOut{to{opacity:0}}
@keyframes aecVtIn{from{opacity:0; transform:translateY(14px)}}

/* ---------- stop everything when asked ---------- */
html.a11y-still *,html.a11y-still *::before,html.a11y-still *::after{animation:none!important; transition:none!important}
html.a11y-still .aec-cursor{display:none}
@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .aec-marquee__track,.aec-band__art img,.aec-band__rings i,.aec-cue span{animation:none}
  .aec-cursor{display:none}
}

/* ---------- 1.2.0: real office photos ---------- */
.aec-office__grid{display:grid; grid-template-columns:1.5fr 1fr; grid-template-rows:1fr 1fr; gap:18px; height:min(560px,62vw)}
.aec-ph{position:relative; margin:0; overflow:hidden; border-radius:22px; background:var(--navy); box-shadow:0 30px 60px -36px rgba(18,18,22,.6)}
.aec-ph--big{grid-row:span 2}
.aec-ph img{width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.aec-ph:hover img{transform:scale(1.06)}
.aec-ph figcaption{position:absolute; left:14px; bottom:14px; background:rgba(14,14,17,.82); color:#fff; font:600 .88rem var(--sans); padding:8px 14px; border-radius:999px; backdrop-filter:blur(6px)}
html.js:not(.a11y-still) .aec-ph.rv{clip-path:inset(12% 12% 12% 12% round 22px); transition:clip-path 1.2s cubic-bezier(.2,.8,.2,1),opacity .8s}
html.js:not(.a11y-still) .aec-ph.rv.in{clip-path:inset(0 0 0 0 round 22px)}
@media (prefers-reduced-motion:reduce){html.js .aec-ph.rv{clip-path:none!important}}
@media (max-width:760px){.aec-office__grid{grid-template-columns:1fr 1fr; grid-template-rows:auto auto; height:auto}.aec-ph--big{grid-column:span 2; grid-row:auto; aspect-ratio:3/2}.aec-ph:not(.aec-ph--big){aspect-ratio:1}}
.v3-card img[src$=".jpg"]{object-fit:cover}

/* =========================================================================
   1.3.0 — plain, bold advertising type (Arial/Helvetica) and NO underlined links.
   Links are told apart by color and weight; the "Underline links" accessibility tool still adds underlines on request.
   ========================================================================= */
:root{
  --serif:Arial,"Helvetica Neue",Helvetica,system-ui,sans-serif;
  --sans:Arial,"Helvetica Neue",Helvetica,system-ui,sans-serif;
  --ink:#141418; --ink-2:#1A1A1E; --muted:#4D4D55;
  --link:#D0142C; --link-dark:#FF8F9C;
}
body{font-family:var(--sans)}
h1,h2,h3,h4,.ip-title,.v3-hero h1,.aec-focus h2,.aec-step h3,.aec-band h1,.aec-why h3,.v3-phone,.num,.fphone{font-family:var(--sans)!important; font-weight:700!important; letter-spacing:-.025em}
.v3-hero h1{letter-spacing:-.04em; line-height:1}
h3,.aec-step h3,.aec-why h3{letter-spacing:-.01em}
.eyebrow{font-weight:700}
.aec-chart{font-family:Arial,Helvetica,sans-serif; font-weight:700}

/* links: never underlined */
a,a:hover,a:focus{text-decoration:none!important}
.v3-link,.v3-res a,.v3-link-light,.aec-band__crumb a,.ip-entry a,.ip-intro a,.ip-note a,.ans a,.consent a,.fmail a,footer.site-foot--simple .ft-links a,.crumb a{background:none!important; border-bottom:0!important; padding-bottom:0}
.ip-entry a,.ip-intro a,.ip-note a,.ans a,.consent a,.err-top a,.fine a{color:var(--link); font-weight:700}
.ip-entry a:hover,.ip-intro a:hover,.ip-note a:hover,.ans a:hover,.consent a:hover{color:var(--brass-text)}
.v3-link,.v3-res a{color:var(--link); font-weight:700; display:inline-flex; align-items:center; gap:6px; transition:color .2s,gap .25s}
.v3-link::after,.v3-res a::after{content:"\2192"; transition:transform .25s}
.v3-link:hover,.v3-res a:hover{color:var(--brass-text)}
.v3-link:hover::after,.v3-res a:hover::after{transform:translateX(4px)}
.v3-link-light{color:var(--link-dark)!important}
.v3-link-light:hover{color:#fff!important}
.fmail a,footer.site-foot--simple .ft-links a,footer .fcredit a{color:#fff}
footer.site-foot--simple .ft-links a:hover,footer.site-foot--simple .ft-legal a:hover,footer.site-foot--simple .ft-legal button:hover,footer .flink:hover,.fmail a:hover{color:var(--link-dark); text-decoration:none!important}
.foot-legal #cookieSettings,.cookie .c-no,.nothanks{text-decoration:none!important; font-weight:700}
.cookie .c-no{color:var(--link-dark)}
html.a11y-links a{text-decoration:underline!important; text-underline-offset:3px}
footer.site-foot .fcredit a,footer.site-foot--simple .fcredit a,.fcredit a{text-decoration:none!important; color:#fff; font-weight:700}
footer.site-foot .fcredit a:hover{color:var(--link-dark)}
.ip-card .more,.aec-body .ip-card .more{border-bottom:0!important; padding-bottom:0}
.aec-body--split .ip-card p{color:#d0d0d6}