/* /answer-engine-optimisation (owner, 1 Oct 2026: the page redesigned in the Google Ads pattern). This file is the
   render-blocking part: the hero. The sections below it load from sv-aeo-extra.css without blocking the first paint. */

/* the hero's columns on laptop-height screens (from the previous design's svz-aeo.css) */
@media (min-width:1081px) and (max-height:950px){
  main[data-svc="aeo"] .wdp-hero{padding-top:124px}
  main[data-svc="aeo"] .wdp-hero__cols{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:56px;align-items:start}
  main[data-svc="aeo"] .wdp-hero__title{font-size:clamp(40px,min(4.6vw,7.4vh),74px)}
  main[data-svc="aeo"] .wdp-hero__intro{font-size:16px;max-width:620px}
}
@media (min-width:1081px){main.svc[data-svc="aeo"] .svc-stats--wide{grid-template-columns:minmax(0,.8fr) repeat(4,minmax(0,1fr))}}
@media (min-width:701px) and (max-width:1080px){main.svc[data-svc="aeo"] .svc-stats--wide{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ============ HERO: the answer, lifted (kit/aeo/hero). Phases on [data-phase]: type → read → lift → answer → done ============ */
.aeh{display:grid;gap:16px}
.aeh__pic{position:relative;height:560px;container-type:inline-size}
.aeh__cap{margin:0;display:grid;gap:4px;padding-left:14px;border-left:2px solid var(--gold)}
.aeh__cap span{font:800 17px/1.3 var(--font-head);letter-spacing:-.01em;color:var(--text)}
.aeh__cap b{color:var(--gold)}
.aeh__cap small{font:500 12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}

/* your page */
.aeh-page{--over:30px;position:absolute;left:0;top:30px;bottom:124px;z-index:1;display:flex;flex-direction:column;width:calc(100% - min(252px,46cqw) + var(--over));border-radius:18px;border:1px solid var(--edge-2);background:#0E1116;
  box-shadow:0 30px 60px -30px rgba(0,0,0,.9);overflow:hidden;transition:opacity .4s}
.aeh-page__bar{display:flex;align-items:center;gap:5px;height:34px;padding:0 calc(var(--over) + 10px) 0 12px;border-bottom:1px solid var(--edge);background:#12151B}
.aeh-page__bar > i{width:7px;height:7px;border-radius:50%;background:#2A2E36}
.aeh-page__url{display:flex;min-width:0;margin-left:8px;padding:4px 10px;border-radius:100px;background:#0A0C10;font:600 11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim);white-space:nowrap;overflow:hidden}
.aeh-page__url b{font-weight:700;color:var(--text-mid)}
.aeh-page__url span{overflow:hidden;text-overflow:ellipsis}
.aeh-page__body{position:relative;flex:1 1 auto;display:flex;flex-direction:column;gap:9px;padding:16px calc(var(--over) + 14px) 14px 18px}
.aeh-page__k{font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.aeh-page__h{margin:0;min-height:2.5em;font:800 15.5px/1.25 var(--font-head);letter-spacing:-.01em;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.aeh-page__p{margin:0;min-height:7.25em;font-size:12.5px;line-height:1.45;color:var(--text-soft);display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.aeh-page__ans{padding:1px 0;border-radius:3px;color:inherit;background:linear-gradient(rgba(244,160,0,.24),rgba(244,160,0,.24)) 0 0/100% 100% no-repeat;box-decoration-break:clone;-webkit-box-decoration-break:clone;
  transition:background-size .9s var(--ease),color .5s}
.aeh-page__lines{display:grid;gap:6px}
.aeh-page__lines i{height:6px;border-radius:3px;background:#20242C}
.aeh-page__lines i.s{width:64%}
.aeh-page__sub{display:block;width:48%;height:9px;margin-top:6px;border-radius:4px;background:#2A2F38}
.aeh-page__scan{position:absolute;left:0;right:0;top:0;height:46px;background:linear-gradient(rgba(79,191,160,0),rgba(79,191,160,.16) 70%,rgba(79,191,160,.7) 96%,rgba(79,191,160,0));opacity:0;pointer-events:none}
.aeh-checks{display:grid;gap:7px;margin:auto 0 0;padding:4px calc(var(--over) + 14px) 16px 18px;list-style:none}
.aeh-checks li{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--text-mid);transition:opacity .35s calc(var(--i) * .28s + .5s),transform .35s calc(var(--i) * .28s + .5s)}
.aeh-checks li i{flex:0 0 auto;display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--teal);color:#0A1512}
.aeh-checks li i::before{content:"";width:6px;height:3.5px;margin-top:-2px;border:solid currentColor;border-width:0 0 1.8px 1.8px;transform:rotate(-45deg)}
.aeh[data-phase="type"] .aeh-page{opacity:.45}
.aeh[data-phase="type"] .aeh-page__ans{background-size:0 100%;transition:none}
.aeh:is([data-phase="type"],[data-phase="read"]) .aeh-checks li{opacity:0;transform:translateX(-6px)}
.aeh[data-phase="type"] .aeh-checks li{transition:none}
.aeh[data-phase="read"] .aeh-page__ans{background-size:0 100%;transition:none}
.aeh[data-phase="read"] .aeh-page__scan{animation:aehScan 1.3s var(--ease) both}
@keyframes aehScan{0%{opacity:0;transform:translateY(0)}15%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translateY(190px)}}
.aeh:is([data-phase="lift"],[data-phase="answer"],[data-phase="done"]) .aeh-page__ans{color:var(--text)}

/* the sentence in flight */
.aeh-lift{position:absolute;left:8cqw;top:168px;z-index:4;display:flex;align-items:center;gap:6px;max-width:44cqw;padding:6px 11px 6px 8px;border-radius:100px;background:var(--gold);color:#111;
  font:700 11.5px/1.2 var(--font-head);white-space:nowrap;box-shadow:0 10px 30px -8px rgba(244,160,0,.7);opacity:0;pointer-events:none}
.aeh-lift span{overflow:hidden;text-overflow:ellipsis}
.aeh-lift i{flex:0 0 auto;width:14px;height:14px;border-radius:4px;background:rgba(0,0,0,.18)}
.aeh[data-phase="lift"] .aeh-lift{animation:aehLift 1s cubic-bezier(.5,0,.2,1) both}
@keyframes aehLift{0%{opacity:0;transform:translate(0,0) scale(.8)}18%{opacity:1;transform:translate(2cqw,-18px) scale(1)}78%{opacity:1}100%{opacity:0;transform:translate(52cqw,-32px) scale(.85)}}

/* the phone */
.aeh-phone{position:absolute;right:0;top:0;z-index:2;width:min(252px,46cqw);height:540px;padding:10px;border-radius:46px;background:#16181D;border:1px solid var(--edge-2);
  box-shadow:0 40px 80px -30px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.6)}
.aeh-phone__notch{position:absolute;left:50%;top:18px;z-index:2;width:78px;height:20px;margin-left:-39px;border-radius:12px;background:#0B0C0F}
.aeh-phone__screen{position:relative;height:100%;padding:46px 12px 12px;border-radius:37px;background:#F7F7F4;overflow:hidden;color:#202124}
.aeh-q{display:flex;align-items:center;gap:8px;height:40px;padding:0 12px 0 10px;border-radius:100px;background:#fff;box-shadow:0 1px 6px rgba(32,33,36,.2)}
.aeh-q__g{flex:0 0 auto;font:800 17px/1 var(--font-head);background:linear-gradient(135deg,#4285F4 0 40%,#EA4335 40% 60%,#FBBC05 60% 78%,#34A853 78%);-webkit-background-clip:text;background-clip:text;color:transparent}
.aeh-q__t{min-width:0;overflow:hidden;white-space:nowrap;font-size:13px;color:#202124}
.aeh-q__caret{flex:0 0 auto;width:1.5px;height:16px;margin-left:-6px;background:#1A73E8;opacity:0}
.aeh[data-phase="type"] .aeh-q__caret{opacity:1;animation:aehBlink .9s steps(1) infinite}
@keyframes aehBlink{50%{opacity:0}}
.aeh-q svg{flex:0 0 auto;width:16px;height:16px;margin-left:auto;fill:none;stroke:#1A73E8;stroke-width:2;stroke-linecap:round}
.aeh-tabs{display:flex;align-items:center;gap:14px;margin:12px 4px 10px;padding-bottom:8px;border-bottom:1px solid #E3E3E0}
.aeh-tabs b{padding-bottom:6px;margin-bottom:-9px;border-bottom:2.5px solid #1A73E8;font-size:11.5px;color:#1A73E8}
.aeh-tabs i{width:30px;height:6px;border-radius:3px;background:#D5D5D1}

/* the answer box: one size for every format, so the page never moves */
.aeh-ans{position:relative;display:flex;flex-direction:column;gap:7px;height:226px;padding:12px 12px 11px;border-radius:14px;background:#fff;border:1px solid #E3E3DF;
  transition:opacity .35s,transform .45s var(--ease)}
.aeh-ans__k{align-self:flex-start;font:700 10.5px/1 var(--font-body,inherit);letter-spacing:.02em;color:#5F6368}
.aeh[data-format="aio"] .aeh-ans{background:linear-gradient(180deg,#EEF3FD,#fff 60%);border-color:#D2E1FB}
.aeh[data-format="aio"] .aeh-ans__k{padding:5px 9px;border-radius:100px;background:#fff;border:1px solid #D2E1FB;color:#1A5DC9}
.aeh[data-format="paa"] .aeh-ans__k{font-size:12.5px;font-weight:800;color:#202124;letter-spacing:0}
.aeh-ans__q{display:none;margin:0;padding:7px 0;border-bottom:1px solid #ECECE8;font:700 12px/1.3 var(--font-body,inherit);color:#202124}
.aeh[data-format="paa"] .aeh-ans__q{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aeh-ans__t{margin:0;font-size:12.5px;line-height:1.45;color:#202124;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.aeh[data-format="snippet"] .aeh-ans__t{font-size:13.5px;-webkit-line-clamp:5}
.aeh[data-format="paa"] .aeh-ans__t{-webkit-line-clamp:3}
.aeh-cite{display:flex;align-items:center;gap:7px;margin-top:auto;padding:5px 9px 5px 5px;align-self:flex-start;border-radius:100px;background:#FFF7E6;border:1.5px solid var(--gold);max-width:100%;
  transition:transform .4s var(--ease),opacity .3s}
.aeh-cite > i{flex:0 0 auto;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--gold);color:#111;font:800 10px/1 var(--font-head);font-style:normal}
.aeh-cite span{display:grid;min-width:0}
.aeh-cite small{font-size:8.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8A6A1F}
.aeh-cite b{font-size:11px;color:#202124;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aeh-ans__more{display:none;gap:5px}
.aeh-ans__more i{height:16px;flex:1;border-radius:100px;background:#EDEFF3}
.aeh[data-format="aio"] .aeh-ans__more{display:flex}
.aeh[data-format="paa"] .aeh-ans__more{display:grid;position:absolute;left:12px;right:12px;bottom:-1px;transform:translateY(100%)}
.aeh[data-format="paa"] .aeh-ans{margin-bottom:46px;height:180px}
.aeh[data-format="paa"] .aeh-ans__more i{flex:none;height:20px;border-radius:0;background:linear-gradient(90deg,#DADCDF 60%,transparent 60%) 0 50%/100% 6px no-repeat;border-bottom:1px solid #ECECE8}
.aeh:is([data-phase="type"],[data-phase="read"]) .aeh-ans{opacity:0;transform:translateY(-10px) scale(.97)}
.aeh[data-phase="lift"] .aeh-ans{border-color:var(--gold);box-shadow:0 0 0 3px rgba(244,160,0,.2)}
.aeh:is([data-phase="type"],[data-phase="read"],[data-phase="lift"],[data-phase="answer"]) .aeh-cite{opacity:0;transform:scale(.7)}
.aeh[data-phase="answer"] .aeh-cite{transition-delay:0s}

/* the old top results, pushed down by the answer */
.aeh-org{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:5px;margin-top:10px;padding:9px 10px;border-radius:12px;background:#fff;border:1px solid #E6E6E2;transition:transform .6s var(--ease),opacity .4s}
.aeh-org__top{display:flex;align-items:center;gap:6px;min-width:0;font-size:10.5px;color:#4D5156;white-space:nowrap}
.aeh-org__top > span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.aeh-org__bar{width:46%;height:6px;border-radius:3px;background:#D8D8D4}
.aeh-org__top em{position:absolute;right:8px;top:-8px;padding:3px 7px;border-radius:100px;background:#FCE8E6;border:1px solid #F4B7B2;font-style:normal;font-weight:700;font-size:9.5px;line-height:1;color:#C5221F;opacity:0;transition:opacity .4s .3s}
.aeh-org__fav{flex:0 0 auto;width:14px;height:14px;border-radius:50%;background:#C9CDD3}
.aeh-org__h{display:block;width:78%;height:9px;border-radius:4px;background:#8AA3E8}
.aeh-org > i{height:5px;border-radius:3px;background:#D8D8D4}
.aeh-org > i.s{width:62%}
.aeh-org.is-dim{opacity:.6}
.aeh:is([data-phase="answer"],[data-phase="done"]) .aeh-org:not(.is-dim) .aeh-org__top em{opacity:1}
.aeh:is([data-phase="type"],[data-phase="read"]) .aeh-org{transform:translateY(-236px)}

/* the tally */
.aeh-tally{position:absolute;left:0;bottom:0;z-index:3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 12px;width:calc(100% - min(252px,46cqw) - 18px);padding:13px 15px;border-radius:18px;
  border:1px solid var(--edge-2);background:rgba(14,17,22,.97);box-shadow:0 20px 40px -24px rgba(0,0,0,.9)}
.aeh-tally__k{grid-column:1 / -1;margin-bottom:4px;font:700 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}
.aeh-tally__i{display:grid;gap:3px;min-width:0}
.aeh-tally__i b{font:800 24px/1 var(--font-head);letter-spacing:-.02em;color:var(--text);font-variant-numeric:tabular-nums;transition:color .4s,text-shadow .4s}
.aeh-tally__i small{font-size:11px;line-height:1.25;color:var(--text-soft)}
.aeh-tally__i.is-bump b{color:var(--gold);text-shadow:0 0 18px rgba(244,160,0,.6)}

/* medium screens: the hero stacks; the picture keeps its desktop shape */
@media (max-width:1000px){.aeh__pic{max-width:600px;width:100%;margin:0 auto}.aeh__cap{max-width:600px;width:100%;margin:0 auto}}

/* phones: the results page on top, your page under it (the sentence lifts up into the answer), then the tally */
@media (max-width:700px){
  .aeh__pic{display:flex;flex-direction:column;gap:12px;height:auto}
  .aeh-phone{position:relative;order:1;width:100%;height:auto;padding:0;border:0;border-radius:22px;background:none;box-shadow:none}
  .aeh-phone__notch{display:none}
  .aeh-phone__screen{height:352px;padding:12px;border-radius:22px}
  .aeh-ans{height:204px}
  .aeh[data-format="paa"] .aeh-ans{height:160px}
  .aeh:is([data-phase="type"],[data-phase="read"]) .aeh-org{transform:translateY(-214px)}
  .aeh-page{position:relative;order:2;top:0;bottom:auto;width:100%}
  .aeh-page__body{grid-template-columns:minmax(0,1fr);gap:7px;padding:12px 14px}
  .aeh-page{--over:0px}
  .aeh-page__lines,.aeh-page__sub{display:none}
  .aeh-page__p{min-height:0}
  .aeh-page__scan{height:34px}
  .aeh-checks{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:0 14px 12px}
  .aeh-checks li{align-items:flex-start;font-size:10.5px;line-height:1.25}
  .aeh-checks li i{width:14px;height:14px}
  .aeh-lift{display:none}
  .aeh-tally{position:relative;order:3;width:100%;padding:12px 14px}
  .aeh-tally__i b{font-size:21px}
}
@media (prefers-reduced-motion:reduce){.aeh *{transition:none!important;animation:none!important}}