/* generated from packages/ui/src/tokens.ts and apps/web/fonts.mjs; edit apps/web/styles.css */
:root{--paper:#EEF2EF;--sheet:#FFFFFF;--ink:#16213A;--ink-soft:#4F5B6E;--rule:#D3DCD6;--rule-strong:#AEBBB3;--mark:#1F4BA5;--mark-soft:#E3EAF7;--correct:#1D7348;--correct-soft:#E1F0E6;--wrong:#B3322A;--wrong-soft:#F7E3E0;--time:#9A5B0B;--night-bg:#0A0F1C;--night-text:#EEF2F8;--night-soft:#9AA6BF;--night-phone:#0D1322;--night-blue:#3D74FF;--night-blue-deep:#2457D6;--night-blue-light:#8FB0FF;--night-violet:#8C64FF;--night-violet-light:#B9A2FF;--night-green:#3CBE78;--night-green-light:#7DDBA5;--night-teal:#28C8BE;--night-teal-light:#8FE3DC;--size-small:13px;--size-body:16px;--size-lead:19px;--size-title:24px;--size-display:34px;--size-tabLabel:12px;--space-xs:4px;--space-s:8px;--space-m:12px;--space-l:16px;--space-xl:24px;--space-xxl:36px;--radius-control:10px;--radius-sheet:14px;--radius-tile:16px;--radius-row:20px;--radius-card:24px;--motion-fast:150ms;--motion-base:200ms;--motion-slow:250ms}
@font-face{font-family:"Noto Sans Armenian";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/5.3.0/noto-sans-armenian-armenian-400-normal.woff2) format("woff2");unicode-range:U+0308,U+0530-058F,U+2010,U+2024,U+25CC,U+FB13-FB17}
@font-face{font-family:"Noto Sans Armenian";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/5.3.0/noto-sans-armenian-armenian-700-normal.woff2) format("woff2");unicode-range:U+0308,U+0530-058F,U+2010,U+2024,U+25CC,U+FB13-FB17}
@font-face{font-family:"Noto Sans Armenian";font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/5.3.0/noto-sans-armenian-armenian-800-normal.woff2) format("woff2");unicode-range:U+0308,U+0530-058F,U+2010,U+2024,U+25CC,U+FB13-FB17}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/5.3.0/noto-sans-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/5.3.0/noto-sans-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/5.3.0/noto-sans-latin-800-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/5.3.0/noto-sans-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/5.3.0/noto-sans-cyrillic-700-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/5.3.0/noto-sans-cyrillic-800-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Sans Fallback";font-weight:100 600;src:local("Arial"),local("Helvetica"),local("Liberation Sans");size-adjust:105.2%;ascent-override:101.6%;descent-override:27.9%;line-gap-override:0%}@font-face{font-family:"Sans Fallback";font-weight:700 900;src:local("Arial Bold"),local("Arial-BoldMT"),local("Helvetica Bold"),local("Liberation Sans Bold");size-adjust:106.6%;ascent-override:100.3%;descent-override:27.5%;line-gap-override:0%}
/* Parapel marketing site: the night design. Rules: design-system/parapel/MASTER.md and pages/*.md.
   Colours, spacing, radii and durations come only from the generated :root block above
   (packages/ui/src/tokens.ts). Translucent colours are mixed from those tokens with color-mix();
   this file holds no colour literal. No element uses overflow:hidden: it would make a scroll
   container and freeze the scroll-linked motion below (overflow:clip crops without that). */

/* ===== base ===== */
:root{--font:"Noto Sans Armenian","Noto Sans","Sans Fallback",system-ui,sans-serif;--panel:color-mix(in srgb,var(--night-text) 5%,transparent);--panel-strong:color-mix(in srgb,var(--night-text) 9%,transparent);--line:color-mix(in srgb,var(--night-text) 10%,transparent);--line-strong:color-mix(in srgb,var(--night-text) 18%,transparent);--shade:color-mix(in srgb,black 45%,transparent)}
*{box-sizing:border-box}
html{background:var(--night-bg);scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--night-bg);color:var(--night-text);font-family:var(--font);font-size:16px;line-height:1.6;overflow-x:clip;overflow-wrap:break-word}
h1,h2,h3{font-family:"Noto Sans Armenian","Noto Sans","Sans Fallback",system-ui,sans-serif;font-weight:800;margin:0;color:var(--night-text);overflow-wrap:anywhere}
h1{font-size:clamp(36px,4.6vw,56px);line-height:1.12;text-wrap:balance}
h2{font-size:clamp(28px,3vw,38px);line-height:1.2;text-wrap:balance}
h3{font-size:18px;line-height:1.3}
p{margin:0}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--night-blue-light);outline-offset:4px}
.close-card :focus-visible{outline-color:var(--sheet)}
.icon{display:inline-block;flex-shrink:0;vertical-align:-3px}
.skip{position:absolute;left:16px;top:-100px;z-index:30;background:var(--sheet);color:var(--ink);padding:10px 14px;border-radius:10px;font-weight:700}
.skip:focus{top:12px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:32px;position:relative}
.wrap.narrow{max-width:900px}
.eyebrow{font-size:13px;font-weight:700;color:var(--night-blue-light);margin-bottom:10px}
.lead{font-size:18px;color:var(--night-soft);max-width:56ch}
.small{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--night-soft)}
.small .icon{color:var(--night-green-light)}
.text-link{display:inline-flex;align-items:center;gap:6px;color:var(--night-blue-light);font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:999px;font-weight:700;font-size:15px;line-height:1.2;cursor:pointer;overflow-wrap:anywhere;transition:transform var(--motion-base) ease-out,background var(--motion-base) ease-out,box-shadow var(--motion-base) ease-out,border-color var(--motion-base) ease-out}
.button.primary,.legal-body .button{background:var(--night-blue-deep);color:var(--sheet);box-shadow:0 10px 30px color-mix(in srgb,var(--night-blue) 40%,transparent)}
.button.primary:hover,.legal-body .button:hover{transform:translateY(-2px);box-shadow:0 14px 36px color-mix(in srgb,var(--night-blue) 55%,transparent)}
.button.ghost{background:var(--panel);color:var(--night-text);border:1px solid var(--line-strong)}
.button.ghost:hover{border-color:var(--night-blue-light)}
.button.white{background:var(--sheet);color:var(--ink)}
.button.white:hover{transform:translateY(-2px)}
.button.nav-cta{min-height:44px;padding:8px 16px;font-size:14px;background:var(--sheet);color:var(--ink)}
.cta{display:flex;flex-wrap:wrap;gap:var(--space-m);margin-top:var(--space-xl)}
.app-downloads{margin-top:var(--space-xl)}
.download-label{font-size:14px;color:var(--night-soft);margin-bottom:var(--space-m)}
.download-options{display:flex;flex-wrap:wrap;align-items:stretch;gap:var(--space-m)}
.download-link,.download-pending{display:inline-flex;align-items:center;gap:var(--space-m);max-width:100%;min-height:60px;padding:10px 14px;border-radius:var(--radius-sheet)}
.download-link{border:1px solid var(--line-strong);background:var(--panel);color:var(--night-text);transition:border-color var(--motion-fast) ease-out,background var(--motion-fast) ease-out}
.download-link:hover{border-color:var(--night-blue-light);background:var(--panel-strong)}
.download-pending{color:var(--night-soft)}
.download-link>span,.download-pending>span{display:grid;gap:2px;min-width:0}
.download-options small{font-size:12px;line-height:1.4}
.download-options strong{font-size:16px;line-height:1.4}
.download-options .icon{flex-shrink:0}
.download-link>.icon:first-child,.download-pending>.icon{width:24px;height:24px}

/* ===== header ===== */

.site-header{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--night-bg) 72%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;gap:28px;min-height:72px}
.logo{display:inline-flex;align-items:center;min-width:0}
.logo img{display:block;width:124px;max-width:100%;height:auto;filter:brightness(0) invert(1)}
.site-header nav{display:flex;flex-wrap:wrap;gap:0 24px}
.site-header nav a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;font-size:15px;color:var(--night-soft);transition:color var(--motion-fast) ease-out}
.site-header nav a:hover,.site-header nav [aria-current]{color:var(--night-text)}
.header-right{margin-left:auto;display:flex;align-items:center;gap:18px}
.nav-short{display:none}
.languages{display:flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--panel);font-size:13px;font-weight:700}
.languages a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 8px;border-radius:999px;color:var(--night-soft)}
.languages a:hover{color:var(--night-text)}
.languages [aria-current]{color:var(--night-text);background:var(--panel-strong);box-shadow:inset 0 0 0 1px var(--line-strong)}

/* ===== moving backgrounds ===== */
.glows{position:absolute;inset:0 0 -240px;z-index:-1;pointer-events:none;overflow:clip;-webkit-mask-image:linear-gradient(black 55%,transparent);mask-image:linear-gradient(black 55%,transparent)}
.glows .grid{position:absolute;inset:-64px;opacity:.28;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 60% 70% at 72% 32%,black,transparent 72%);mask-image:radial-gradient(ellipse 60% 70% at 72% 32%,black,transparent 72%);animation:pan 26s linear infinite}
.blob{position:absolute;border-radius:50%;filter:blur(30px)}
.b1{width:760px;height:760px;right:-220px;top:-280px;background:radial-gradient(closest-side,color-mix(in srgb,var(--night-blue) 38%,transparent),transparent);animation:drift1 18s ease-in-out infinite}
.b2{width:540px;height:540px;right:22%;top:18%;background:radial-gradient(closest-side,color-mix(in srgb,var(--night-violet) 20%,transparent),transparent);animation:drift2 22s ease-in-out infinite}
.b3{width:440px;height:440px;left:-160px;bottom:-120px;background:radial-gradient(closest-side,color-mix(in srgb,var(--night-teal) 16%,transparent),transparent);animation:drift1 26s ease-in-out infinite reverse}
.section-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(640px 420px at 0% 40%,color-mix(in srgb,var(--night-violet) 16%,transparent),transparent 70%)}
.band-light{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,color-mix(in srgb,var(--night-blue) 8%,transparent),transparent 70%);border-top:1px solid color-mix(in srgb,var(--night-blue-light) 22%,transparent)}
.band-light::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--night-blue-light),transparent);animation:sweep 6s ease-in-out infinite}

/* ===== hero ===== */
.hero,.detail-hero{position:relative;overflow-x:clip;isolation:isolate}
.hero-inner{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:center;min-height:640px;padding-top:56px;padding-bottom:72px}
.hero-copy{position:relative;z-index:3}
.hero-copy .lead{max-width:48ch;text-wrap:pretty}
.badge{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border:1px solid color-mix(in srgb,var(--night-blue-light) 22%,transparent);border-radius:999px;background:color-mix(in srgb,var(--night-blue) 16%,transparent);color:var(--night-blue-light);font-size:13px;font-weight:700}
.badge i{width:7px;height:7px;border-radius:50%;background:var(--night-blue-light);animation:pulse 2.4s ease-in-out infinite}
.hero h1{margin:var(--space-xl) 0 var(--space-l);background:linear-gradient(90deg,var(--night-text) 0%,var(--night-text) 55%,var(--night-blue-light) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .small{margin-top:var(--space-l)}
.hero-copy>*{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.hero-copy>:nth-child(2){animation-delay:.08s}
.hero-copy>:nth-child(3){animation-delay:.16s}
.hero-copy>:nth-child(4){animation-delay:.24s}
.hero-copy>:nth-child(5){animation-delay:.32s}

/* the drawn phone: the app's catalogue */
.stage{position:relative;display:flex;justify-content:center;isolation:isolate}
.stage::before{content:"";position:absolute;z-index:-1;inset:44px -18px 48px;border:1px solid color-mix(in srgb,var(--night-blue-light) 20%,transparent);border-radius:48px;background:radial-gradient(ellipse at 50% 20%,color-mix(in srgb,var(--night-blue) 18%,transparent),transparent 74%),var(--panel);transform:rotate(-7deg)}
.stage::after{content:"";position:absolute;z-index:-1;width:360px;height:360px;top:100px;border:1px solid color-mix(in srgb,var(--night-blue-light) 14%,transparent);border-radius:50%}
.phone-wrap{transform-style:preserve-3d}
.phone{display:flex;flex-shrink:0;width:280px;height:560px;padding:10px;border-radius:46px;background:var(--night-phone);box-shadow:0 40px 80px var(--shade),0 0 0 1px var(--line),0 0 90px color-mix(in srgb,var(--night-blue) 25%,transparent)}
.screen{flex:1;min-height:0;display:flex;flex-direction:column;padding-bottom:12px;border-radius:37px;background:var(--paper);color:var(--ink);overflow:clip}
.sbar{display:flex;justify-content:space-between;align-items:center;height:36px;padding:0 24px;font-size:11px;font-weight:700}
.notch{width:88px;height:24px;border-radius:12px;background:var(--night-phone)}
.app-top{display:flex;justify-content:space-between;align-items:center;padding:6px 18px}
.app-top img{display:block;width:70px;height:auto}
.app-top span{font-size:12px;font-weight:700;color:var(--mark)}
.app-title{padding:12px 18px 4px;font-size:20px;font-weight:800;line-height:1.2}
.app-sub{padding:0 18px 10px;font-size:12px;color:var(--ink-soft)}
.app-row{display:flex;align-items:center;gap:11px;margin:0 12px 9px;padding:11px 12px;border-radius:16px;background:var(--sheet);box-shadow:0 2px 8px color-mix(in srgb,var(--ink) 7%,transparent);animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.app-row:nth-child(5){animation-delay:.5s}
.app-row:nth-child(6){animation-delay:.65s}
.app-row:nth-child(7){animation-delay:.8s}
.app-row:nth-child(n+8){animation-delay:.95s}
.app-row>span{min-width:0}
.app-row b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:clip;font-size:12.5px;line-height:1.3}
.app-row small{display:block;white-space:nowrap;overflow:clip;text-overflow:ellipsis;font-size:11px;color:var(--ink-soft)}
.float{position:absolute;z-index:2}
.f1{left:-6px;top:104px}
.f2{right:-14px;bottom:20px}
.chip{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:14px;background:var(--sheet);color:var(--ink);font-size:13px;font-weight:700;white-space:nowrap;box-shadow:0 16px 36px var(--shade);animation:bob 5s ease-in-out infinite}
.f2 .chip{animation-delay:-2.5s}
.chip .dot{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--correct);color:var(--sheet)}
.chip .dot .icon{width:13px;height:13px;vertical-align:0}
.chip .clock{padding:2px 9px;border-radius:999px;background:var(--ink);color:var(--sheet);font-variant-numeric:tabular-nums}

/* ===== exam icons and tones ===== */
.tone-blue{--tone:var(--night-blue);--tone-light:var(--night-blue-light)}
.tone-violet{--tone:var(--night-violet);--tone-light:var(--night-violet-light)}
.tone-green{--tone:var(--night-green);--tone-light:var(--night-green-light)}
.tone-teal{--tone:var(--night-teal);--tone-light:var(--night-teal-light)}
.exam-icon{display:grid;place-items:center;flex-shrink:0;width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--tone) 18%,transparent);color:var(--tone-light)}
.exam-icon .glyph{width:24px;height:24px}
.screen .exam-icon{width:36px;height:36px;border-radius:11px;background:color-mix(in srgb,var(--tone) 13%,var(--sheet));color:color-mix(in srgb,var(--tone) 72%,var(--ink))}
.screen .exam-icon .glyph{width:20px;height:20px}

/* ===== sections ===== */
section{position:relative}
.exams-section,.steps-section,.faq-section{padding:96px 0}
.exams-section h2,.steps-section h2{max-width:26ch;margin-bottom:12px}
.exams-section{border-top:1px solid var(--line)}
.section-heading{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:64px;align-items:end;margin-bottom:40px}
.section-heading h2{margin-bottom:0}
.section-heading .lead{max-width:36ch;margin-bottom:0;padding-bottom:4px}

.exam-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;--catalog-preview-count:6}
.exam-card{position:relative;display:flex;flex-direction:column;flex:0 1 calc((100% - 36px)/3);gap:18px;padding:28px;border-radius:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--tone) 9%,transparent),transparent 60%),var(--panel);border:1px solid var(--line-strong);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:transform var(--motion-slow) ease-out,border-color var(--motion-slow) ease-out,box-shadow var(--motion-slow) ease-out}
.exam-card[hidden]{display:none}
.catalog-actions{display:flex;justify-content:center}
.catalog-toggle{margin-top:32px;min-width:180px;font-family:inherit}
.catalog-toggle[hidden]{display:none}
.catalog-toggle .icon{transform:rotate(90deg);transition:transform var(--motion-base) ease-out}
.catalog-toggle[aria-expanded="true"] .icon{transform:rotate(-90deg)}
.exam-card:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--tone) 55%,transparent);box-shadow:0 22px 44px var(--shade)}
.card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.language-tag{padding:5px 10px;border:1px solid var(--line);border-radius:999px;font-size:12px;color:var(--night-soft);white-space:nowrap}
.exam-card h3{font-size:19px;line-height:1.45;text-wrap:pretty}
.card-link::after{content:"";position:absolute;inset:0;border-radius:22px}
.exam-card .sub{font-size:15px;line-height:1.7;color:var(--night-soft);text-wrap:pretty}
.exam-card .meta{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line);font-size:14px;color:var(--night-soft)}
.exam-card .meta .icon{width:32px;height:32px;padding:8px;border-radius:50%;background:color-mix(in srgb,var(--tone) 14%,transparent);color:var(--tone-light);transition:transform var(--motion-base) ease-out}
.exam-card:hover .meta .icon{transform:translateX(4px)}
@supports selector(:has(a)){.exam-card:has(.card-link:focus-visible){outline:3px solid var(--night-blue-light);outline-offset:4px}.exam-card .card-link:focus-visible{outline:none}}
.how-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.how-heading h2{margin-bottom:0}
.how-heading .button{flex-shrink:0;margin-bottom:4px}
.steps{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:44px}
.track{position:absolute;left:20px;right:calc((100% - 56px)/3 - 20px);top:20px;height:1px;background:linear-gradient(90deg,var(--night-blue-light),var(--night-green-light),var(--night-violet-light));transform-origin:left;opacity:.5}
.step{position:relative;min-width:0}
.step-n{position:relative;z-index:1;display:grid;place-items:center;width:40px;height:40px;margin-bottom:24px;border-radius:50%;background:var(--night-bg);border:1px solid var(--night-blue-light);color:var(--night-blue-light);font-size:15px;font-weight:800;box-shadow:0 0 0 6px var(--night-bg)}
.step:nth-of-type(2) .step-n{border-color:var(--night-green-light);color:var(--night-green-light)}
.step:nth-of-type(3) .step-n{border-color:var(--night-violet-light);color:var(--night-violet-light)}
.step-visual{position:relative;display:grid;place-items:center;height:216px;padding:24px;margin-bottom:24px;border:1px solid var(--line-strong);border-radius:22px;overflow:clip;background:radial-gradient(ellipse at 50% 100%,color-mix(in srgb,var(--night-blue) 16%,transparent),transparent 78%),var(--panel)}
.step-copy{padding-inline:4px}
.step h3{margin-bottom:12px;font-size:20px;line-height:1.45;text-wrap:balance}
.step-copy p{font-size:15px;line-height:1.75;color:var(--night-soft);text-wrap:pretty}
.mini-catalog{width:100%;max-width:280px}
.mini-label{display:block;margin-bottom:12px;color:var(--night-soft);font-size:12px;font-weight:700}
.mini-exam{display:flex;align-items:center;gap:10px;padding:12px;margin-top:10px;border:1px solid var(--line);border-radius:12px;background:var(--night-bg)}
.mini-exam.chosen{border-color:color-mix(in srgb,var(--night-blue-light) 60%,transparent);background:color-mix(in srgb,var(--night-blue) 12%,var(--night-bg));box-shadow:0 8px 24px color-mix(in srgb,var(--night-blue) 12%,transparent)}
.mini-exam>span:not(.exam-icon){min-width:0;flex:1;font-size:12px;line-height:1.5;font-weight:700}
.mini-exam .exam-icon{width:32px;height:32px;border-radius:10px}
.mini-exam .glyph{width:18px;height:18px}
.mini-exam>.icon{color:var(--night-blue-light)}
.practice-visual{background:radial-gradient(ellipse at 50% 100%,color-mix(in srgb,var(--night-green) 14%,transparent),transparent 78%),var(--panel)}
.answer-demo{width:100%;max-width:240px}
.answer-options{display:flex;justify-content:center;gap:12px;margin-bottom:16px}
.answer-options>span{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line-strong);border-radius:50%;color:var(--night-soft);font-size:14px}
.answer-options .answer-chosen{background:var(--night-green-light);border-color:var(--night-green-light);color:var(--night-bg);box-shadow:0 0 0 5px color-mix(in srgb,var(--night-green) 12%,transparent)}
.answer-confirm{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px;border-radius:12px;background:color-mix(in srgb,var(--night-green) 12%,var(--night-bg));border:1px solid color-mix(in srgb,var(--night-green-light) 35%,transparent);color:var(--night-green-light);font-size:15px}
.answer-progress{display:flex;gap:5px;margin-top:18px}
.answer-progress i{height:4px;flex:1;border-radius:4px;background:var(--line-strong)}
.answer-progress i:nth-child(-n+5){background:var(--night-green-light)}
.timer-visual{background:radial-gradient(ellipse at 50% 100%,color-mix(in srgb,var(--night-violet) 17%,transparent),transparent 78%),var(--panel)}
.timer-demo{position:relative;display:grid;place-items:center;width:160px;height:160px}
.timer-ring{position:absolute;inset:0;transform:rotate(-90deg)}
.timer-track{stroke:var(--line-strong);stroke-width:3}
.timer-elapsed{stroke:var(--night-violet-light);stroke-width:4;stroke-linecap:round;stroke-dasharray:330 440}
.timer-copy{display:grid;justify-items:center;gap:5px;text-align:center}
.timer-copy strong{font-size:30px;line-height:1.2;font-variant-numeric:tabular-nums;font-weight:800}
.timer-copy span{max-width:115px;font-size:11px;line-height:1.5;color:var(--night-soft)}
.faq-section{border-top:1px solid var(--line)}
.faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:48px;align-items:start}
.faq-row{margin-bottom:12px;border-radius:18px;background:var(--panel);border:1px solid var(--line);transition:background var(--motion-base) ease-out}
.faq-row:hover{background:var(--panel-strong)}
.faq-row summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:60px;padding:16px 20px;font-weight:700;cursor:pointer;list-style:none}
.faq-row summary::-webkit-details-marker{display:none}
.plus{width:28px;height:28px;padding:6px;border-radius:50%;background:var(--panel-strong);transition:transform var(--motion-base) ease-out}
.faq-row[open]{background:var(--panel-strong);border-color:var(--line-strong)}
.faq-row[open] .plus{transform:rotate(45deg)}
.faq-row p{max-width:62ch;padding:0 20px 18px;font-size:15px;color:var(--night-soft)}
.closing{padding:24px 0 96px}
.close-card{border:1px solid color-mix(in srgb,var(--sheet) 20%,transparent);position:relative;overflow:clip;display:flex;justify-content:space-between;align-items:center;gap:32px;padding:52px;border-radius:30px;background:linear-gradient(120deg,var(--night-blue-deep),color-mix(in srgb,var(--night-violet) 35%,var(--night-blue-deep)),var(--night-blue-deep));background-size:300% 100%;box-shadow:0 30px 60px color-mix(in srgb,var(--night-blue-deep) 35%,transparent);animation:shift 12s ease-in-out infinite}
.close-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,color-mix(in srgb,var(--sheet) 8%,transparent) 50%,transparent 60%);background-size:250% 100%;animation:sheen 6s ease-in-out infinite}
.close-card>*{position:relative;z-index:1}
.close-card .button{flex-shrink:0}
.close-card h2{font-size:clamp(26px,3vw,34px)}
.close-card p{max-width:54ch;margin-top:var(--space-s);color:var(--sheet)}

/* ===== footer ===== */
.site-footer{border-top:1px solid var(--line)}
.site-footer .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:20px 36px;padding-top:30px;padding-bottom:40px}
.site-footer .logo img{width:104px}
.site-footer p{flex:1 1 320px;max-width:56ch;font-size:13px;color:var(--night-soft)}
.legal-links{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:13px;font-weight:700}
.legal-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--night-text)}
.legal-links a:hover{color:var(--night-blue-light)}
.site-footer .copyright{margin-left:auto;font-size:13px;color:var(--night-soft)}
.footer-downloads{flex-basis:100%;margin-top:0;border-top:1px solid var(--line);padding-top:var(--space-xl)}

/* ===== exam pages, support, 404 ===== */
.not-found span{display:block}
.not-found-links{display:flex;flex-wrap:wrap;gap:8px 24px}
.detail-hero{padding:48px 0 72px}
.back{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-bottom:24px;font-weight:700;color:var(--night-blue-light)}
.detail-head{display:flex;align-items:center;gap:18px;margin-bottom:16px}
.detail-head .exam-icon{width:60px;height:60px;border-radius:18px}
.detail-head .exam-icon .glyph{width:30px;height:30px}
.detail-hero h1{font-size:clamp(32px,4vw,48px)}
.detail-hero .lead{margin-top:var(--space-s);max-width:62ch}
.detail-hero .small{margin-top:var(--space-l)}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-m);margin-top:var(--space-xxl)}
.stat-card{display:flex;flex-direction:column;gap:var(--space-s);padding:var(--space-xl);border-radius:20px;background:var(--panel);border:1px solid var(--line)}
.stat-card strong{display:block;font-size:40px;font-weight:800;line-height:1.1}
.stat-card span{margin-top:auto;font-size:14px;color:var(--night-soft)}
.detail-body{padding:24px 0 72px}
.detail-body h2{margin:var(--space-xxl) 0 var(--space-l);font-size:26px}
.detail-body h2:first-child{margin-top:0}
.description{max-width:65ch;font-size:16px;color:var(--night-soft)}
.bank-list{display:grid;gap:var(--space-m)}
.bank-card{padding:var(--space-xl);border-radius:20px;background:var(--panel);border:1px solid var(--line)}
.bank-card h3{margin-bottom:var(--space-s)}
.bank-card p{font-size:15px;color:var(--night-soft)}
.bank-card .small{display:block;margin-top:var(--space-m)}
.source{margin-top:var(--space-xl)}
.exam-toc{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:var(--space-xl);padding-top:var(--space-l);border-top:1px solid var(--line)}
.exam-toc a{display:inline-flex;align-items:center;min-height:44px;color:var(--night-blue-light);font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.exam-guide-body section{padding-bottom:var(--space-xxl);margin-bottom:var(--space-xxl);border-bottom:1px solid var(--line)}
.exam-guide-body section>h2{margin-top:0}
.exam-guide-body h3{margin:var(--space-xl) 0 var(--space-m)}
.exam-guide-body .bank-card h3{margin:0 0 var(--space-s)}
.exam-guide-body p{max-width:72ch;color:var(--night-soft)}
.exam-guide-body .bank-list{margin-top:var(--space-l)}
.exam-guide-body .editorial-note{margin:var(--space-l) 0;padding:12px 18px;border-left:3px solid var(--night-blue-light);background:var(--panel);border-radius:0 12px 12px 0;color:var(--night-text)}
.related-driving{margin:var(--space-xl) 0}
.related-driving .text-link{display:flex;margin-top:var(--space-s);width:fit-content}
.archive-banks,.topic-details{margin-top:var(--space-l);border:1px solid var(--line-strong);border-radius:16px;background:var(--panel);padding:0 20px}
.archive-banks>summary,.topic-details>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding-block:14px;cursor:pointer;font-weight:700;color:var(--night-text);list-style:none}
.archive-banks>summary::-webkit-details-marker,.topic-details>summary::-webkit-details-marker{display:none}
.archive-banks[open]>summary .plus,.topic-details[open]>summary .plus{rotate:45deg}
.archive-banks[open],.topic-details[open]{padding-bottom:20px}
.archive-banks .bank-card{background:transparent}
.topic-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px 32px;padding-left:20px;color:var(--night-soft)}
.preparation-list{padding-left:24px;margin:0 0 var(--space-xl)}
.preparation-list li{padding-left:8px;margin-bottom:var(--space-xl)}
.preparation-list li::marker{color:var(--night-blue-light);font-weight:800}
.preparation-list h3{margin-top:0}
.source-documents,.related-exams{padding-left:20px}
.source-documents li,.related-exams li{margin-block:12px}
.source-documents a{overflow-wrap:anywhere}
.source-date,.content-date{display:block;margin-top:var(--space-l)}
.sample-promo{display:flex;flex-wrap:wrap;align-items:flex-start;gap:16px 32px;margin-top:var(--space-xl);padding:24px;border-top:1px solid var(--line)}
.sample-promo h3{font-size:16px}
.sample-promo>div{display:grid;gap:12px;flex:1 1 380px}
.sample-hero h1{font-size:clamp(30px,4vw,46px);max-width:24ch}
.sample-hero .lead{margin-top:var(--space-l)}
.sample-bank{font-weight:700;color:var(--night-blue-light);margin-bottom:var(--space-m)}
.sample-body [hidden]{display:none!important}
.sample-body .editorial-note{padding:16px 20px;margin-block:var(--space-l);border-left:3px solid var(--night-blue-light);background:var(--panel);border-radius:0 12px 12px 0}
.sample-tracker{margin-block:var(--space-xl);padding:20px;border:1px solid var(--line-strong);border-radius:20px;background:var(--panel)}
.sample-progress-copy{display:flex;align-items:center;justify-content:space-between;gap:16px}
.sample-reset{border:0;background:transparent;font:inherit;min-height:44px;text-align:right}
.sample-tracker progress{display:block;width:100%;height:8px;margin:12px 0 16px;accent-color:var(--night-blue-light)}
.sample-tracker .small{display:block}
.sample-tracker .button{margin-top:16px}
.sample-question{margin-block:24px;padding:28px;border:1px solid var(--line-strong);border-radius:22px;background:var(--panel)}
.sample-question h2{font-size:22px;line-height:1.45;text-wrap:initial;margin:0 0 20px}
.sample-question fieldset{min-width:0;border:0;padding:0;margin:0 0 20px}
.sample-question legend{font-size:14px;color:var(--night-soft);padding:0;margin-bottom:12px}
.sample-options{display:grid;gap:10px}
.sample-options label{display:grid;grid-template-columns:20px minmax(0,1fr);gap:12px;align-items:start;padding:16px;min-height:52px;border:1px solid var(--line-strong);border-radius:14px;cursor:pointer}
.sample-options label:has(input:focus-visible){outline:3px solid var(--night-blue-light);outline-offset:3px}
.sample-options label:has(input:checked){border-color:var(--night-blue-light);background:color-mix(in srgb,var(--night-blue) 10%,transparent)}
.sample-options input{width:20px;height:20px;margin:3px 0;accent-color:var(--night-blue-light)}
.sample-option-number{font-weight:700;color:var(--night-soft)}
.sample-options label.is-correct{border-color:var(--night-green-light);background:color-mix(in srgb,var(--night-green) 10%,transparent)}
.sample-options label.is-incorrect{border-color:var(--night-violet-light);background:color-mix(in srgb,var(--night-violet) 10%,transparent)}
.sample-question button:disabled{cursor:default;opacity:.7}
.sample-feedback{margin-block:16px;font-weight:700;color:var(--night-text)}
.sample-feedback:empty{display:none}
.sample-solution{margin-top:20px;border-top:1px solid var(--line-strong)}
.sample-solution summary{padding-block:16px;min-height:48px;color:var(--night-blue-light);font-weight:700;cursor:pointer}
.sample-solution[open]>div{display:grid;gap:14px;color:var(--night-soft)}
.sample-solution strong{color:var(--night-text)}
.sample-solution .text-link{overflow-wrap:anywhere}
.sample-result{padding:28px;margin-block:36px;border:1px solid var(--night-green-light);border-radius:22px;background:color-mix(in srgb,var(--night-green) 8%,transparent)}
.sample-result h2{margin:0 0 16px}
.sample-result p+p{margin-top:12px}
.sample-sources,.sample-courses{padding-top:24px;margin-top:36px;border-top:1px solid var(--line)}
.sample-sources h2,.sample-courses h2{margin-top:0}
.sample-sources p+p{margin-top:16px}
.sample-sources p{max-width:68ch}
.exam-guide .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.support{padding-top:56px}
.support h1{margin:var(--space-s) 0 var(--space-m)}
.support h2{margin:var(--space-xxl) 0 var(--space-s);font-size:22px}
.support p{color:var(--night-soft)}
.support .lead .text-link,.support p a{color:var(--night-blue-light);text-decoration:underline;text-underline-offset:3px}

/* ===== Armenian blog ===== */
.blog-intro h1{max-width:22ch}
.blog-intro .lead{max-width:64ch}
.blog-topics{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.blog-topics a{display:inline-flex;align-items:center;gap:16px;min-height:44px;padding:10px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-card);color:var(--night-blue-light);background:var(--panel)}
.blog-list{padding:0 0 72px}
.blog-topic-heading{margin:12px 0 28px;max-width:800px}
.blog-topic-heading h2{font-size:clamp(25px,3vw,34px)}
.blog-list section+section{margin-top:64px}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.blog-grid-pair{grid-template-columns:repeat(2,minmax(0,1fr))}
.blog-card,.blog-featured{position:relative;min-width:0;display:flex;flex-direction:column;border:1px solid var(--line-strong);border-radius:22px;background:var(--panel);transition:border-color var(--motion-base) ease-out}
.blog-card:hover,.blog-featured:hover{border-color:var(--night-blue-light)}
.blog-card:has(a:focus-visible),.blog-featured:has(a:focus-visible){outline:3px solid var(--night-blue-light);outline-offset:5px}
.blog-card a::after,.blog-featured a::after{content:"";position:absolute;inset:0;border-radius:22px}
.blog-cover{min-width:0;padding:12px}
.blog-cover svg{display:block;width:100%;height:auto;border-radius:14px}
.blog-card-copy{display:flex;flex-direction:column;gap:16px;padding:12px 24px 28px;flex:1}
.blog-card h3{font-size:21px;line-height:1.45}
.blog-card-copy>p:not(.blog-meta){color:var(--night-soft)}
.blog-card-copy>.text-link{margin-top:auto;padding-top:8px}
.blog-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;line-height:1.6;color:var(--night-soft)}
.blog-meta>span:first-child{color:var(--night-blue-light);font-weight:700}
.blog-featured{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;margin-bottom:24px}
.blog-featured .blog-card-copy{padding:28px 28px 28px 12px}
.blog-featured h2{font-size:clamp(25px,2.9vw,34px);line-height:1.3}
.blog-grid-pair>.blog-card:only-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center}
.blog-grid-pair>.blog-card:only-child .blog-card-copy{padding:28px}
.blog-editorial{padding:28px;margin-top:64px;max-width:900px;border-left:3px solid var(--night-teal-light);background:var(--panel);border-radius:0 18px 18px 0}
.blog-editorial h2{font-size:23px;margin-bottom:16px}
.blog-editorial p{color:var(--night-soft);line-height:1.85}
.blog-preview{padding:72px 0}
.blog-preview .section-heading{align-items:end}
.blog-preview .section-heading h2{font-size:clamp(25px,3vw,34px)}
.guide-breadcrumb{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-bottom:40px;font-size:14px;color:var(--night-soft)}
.guide-breadcrumb a{min-height:44px;display:inline-flex;align-items:center;color:var(--night-blue-light)}
.guide-hero-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.9fr);align-items:center;gap:40px}
.guide-hero h1{font-size:clamp(30px,3.6vw,44px);line-height:1.25}
.guide-hero .lead{font-size:18px;line-height:1.8;margin-top:24px}
.guide-hero .blog-meta{margin-top:24px}
.guide-byline{margin-top:12px;font-size:14px;color:var(--night-soft)}
.guide-byline a{color:var(--night-blue-light);text-decoration:underline;text-underline-offset:3px}
.guide-hero-art{min-width:0;border:1px solid var(--line-strong);border-radius:24px;padding:8px;background:var(--panel)}
.guide-hero-art svg{width:100%;height:auto;display:block}
.guide-layout{display:grid;grid-template-columns:220px minmax(0,760px);justify-content:space-between;gap:48px;padding-bottom:36px}
.guide-toc nav{display:flex;flex-direction:column;gap:4px;position:sticky;top:104px}
.guide-toc a{display:flex;align-items:center;min-height:44px;padding:8px 0;color:var(--night-soft);font-size:14px;line-height:1.6}
.guide-toc a:hover{color:var(--night-blue-light)}
.guide-body{min-width:0;font-size:17px;line-height:1.9}
.guide-body>section{margin-top:48px;scroll-margin-top:var(--space-l)}
.guide-body h2{font-size:clamp(23px,2.3vw,29px);line-height:1.4;margin-bottom:24px}
.guide-body p+p{margin-top:20px}
.guide-body a:not(.button){color:var(--night-blue-light);text-decoration:underline;text-underline-offset:4px}
.guide-body ul{padding-left:24px;margin:20px 0}
.guide-body li+li{margin-top:12px}
.guide-takeaway{padding:24px 28px;border:1px solid var(--line-strong);border-radius:20px;background:color-mix(in srgb,var(--night-blue) 8%,transparent)}
.guide-takeaway .eyebrow{margin-bottom:12px}
.guide-takeaway p+p{margin-top:0}
.guide-body .guide-reference{font-size:14px;color:var(--night-soft);line-height:1.7;margin-top:16px}
.guide-note{margin-top:24px;padding:20px;border-left:3px solid var(--night-teal-light);color:var(--night-soft);font-size:15px;background:var(--panel);border-radius:0 14px 14px 0}
.guide-figure{margin:28px 0}
.guide-figure svg{display:block;width:100%;height:auto;border:1px solid var(--line-strong);border-radius:24px}
.guide-figure figcaption{font-size:14px;color:var(--night-soft);line-height:1.8;margin-top:12px}
.guide-answer{margin:20px 0;padding:18px 22px;border:1px solid var(--line-strong);border-radius:18px;background:var(--panel)}
.guide-answer summary{cursor:pointer;color:var(--night-blue-light);font-weight:700;min-height:44px;padding-block:6px}
.guide-answer p{margin-top:16px}
.guide-practice{padding:28px;border:1px solid var(--night-blue-light);border-radius:24px;background:var(--panel)}
.guide-practice .cta{margin:24px 0 16px}
.guide-practice .text-link{font-size:14px}
.guide-sources{border-top:1px solid var(--line-strong);padding-top:32px;font-size:14px;color:var(--night-soft)}
.guide-sources h2{font-size:23px}
.site-header .main-nav a.blog-nav-link{display:inline-flex}
.blog-nav-link{gap:4px}

/* ===== legal ===== */
.legal{padding:56px 0 96px}
.legal-intro{max-width:820px;margin-bottom:var(--space-xxl)}
.legal-intro h1{margin-bottom:18px;font-size:clamp(32px,4vw,48px)}
.legal-intro .lead{margin-bottom:14px}
.legal-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:56px}
.legal-toc nav{position:sticky;top:96px;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-s)}
.legal-toc a{display:inline-flex;align-items:center;min-height:28px;font-size:14px;color:var(--night-soft)}
.legal-toc a:hover{color:var(--night-text)}
.legal-body{max-width:840px;min-width:0}
.legal-body section{padding-bottom:var(--space-xxl);margin-bottom:var(--space-xxl);border-bottom:1px solid var(--line);scroll-margin-top:96px}
.legal-body h2{margin-bottom:var(--space-l);font-size:24px}
.legal-body p{margin-bottom:16px;line-height:1.85;color:color-mix(in srgb,var(--night-text) 88%,var(--night-soft))}
.legal-body a{color:var(--night-blue-light);text-decoration:underline;text-underline-offset:3px}
.legal-body .button{margin-top:8px;text-decoration:none}
.legal-table{overflow-x:auto;margin-bottom:16px;border:1px solid var(--line);border-radius:16px}
table{width:100%;border-collapse:collapse;font-size:15px}
th,td{padding:var(--space-l);text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
th{background:var(--panel-strong);font-weight:700}
td{background:var(--panel)}
td:first-child{width:25%;font-weight:700}
tr:last-child td{border-bottom:0}
.pricing-table table{table-layout:fixed}
.pricing-table th,.pricing-table td{overflow-wrap:anywhere}
.pricing-table th:first-child,.pricing-table td:first-child{width:28%}

/* ===== responsive ===== */
@media(max-width:1100px){.site-header .wrap{gap:20px}.site-header nav{gap:0 16px}.header-right{gap:12px}.nav-label{display:none}.nav-short{display:inline}.hero-inner{gap:40px}}
@media(max-width:1000px){.exam-grid{--catalog-preview-count:4}.site-header .main-nav a:nth-child(2){display:none}.wrap{padding-inline:24px}.hero-inner{gap:24px}.hero h1{font-size:clamp(36px,4.6vw,46px)}.f1{top:-14px}.f2{bottom:-14px}.exam-grid{gap:18px}.exam-card{flex-basis:calc((100% - 18px)/2)}.section-heading{gap:32px}.stage::before{inset:44px 0 48px}.stage::after{width:300px;height:300px}.steps{gap:20px}.step-visual{padding:16px}.track{right:calc((100% - 40px)/3 - 20px)}}
@media(max-width:820px){.legal-layout{grid-template-columns:minmax(0,1fr);gap:32px}.legal-toc nav{position:static;flex-direction:row;flex-wrap:wrap;gap:10px 20px}.legal-toc{padding-bottom:24px;border-bottom:1px solid var(--line)}}
@media(max-width:760px){.exam-grid{--catalog-preview-count:2}.site-header .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;min-height:64px;padding-top:8px;padding-bottom:8px}.site-header .logo{grid-column:1;grid-row:1}.site-header .logo img{width:114px}.header-right{display:contents}.languages{grid-column:2;grid-row:1;justify-self:end}.site-header nav{grid-column:1;grid-row:2;gap:0 14px}.site-header nav a:not(:first-child){display:none}.app-link{grid-column:2;grid-row:2;justify-self:end}.button.nav-cta{padding:10px 14px;font-size:13px}.site-header nav a{font-size:13px}html{scroll-padding-top:152px}.exam-card{flex-basis:100%}.hero-inner{grid-template-columns:minmax(0,1fr);gap:36px;min-height:0;padding-top:36px;padding-bottom:0}.hero h1{font-size:clamp(36px,7vw,48px);line-height:1.18}.hero-copy .lead{font-size:17px;max-width:52ch}.hero .badge{font-size:12px}.stage{max-height:350px;max-width:440px;width:100%;margin-inline:auto;padding-top:16px;overflow:clip;-webkit-mask-image:linear-gradient(black 82%,transparent);mask-image:linear-gradient(black 82%,transparent)}.stage::before{inset:36px 4px 0}.f1{left:0;top:44px}.f2{right:0;top:auto;bottom:44px}.exam-grid,.steps,.stats{grid-template-columns:minmax(0,1fr)}.section-heading{grid-template-columns:minmax(0,1fr);gap:16px;margin-bottom:28px}.section-heading .lead{max-width:52ch}.track{display:none}.how-heading{display:block}.how-heading .button{margin-top:24px}.steps{gap:36px;margin-top:32px}.step{display:grid;grid-template-columns:40px minmax(0,1fr);gap:0 16px}.step:not(:last-child)::after{content:"";position:absolute;left:19px;top:52px;bottom:-24px;width:1px;background:var(--line-strong)}.step-n{grid-column:1;grid-row:1 / 3;margin-bottom:0}.step-visual{grid-column:2;height:172px;margin-bottom:18px;padding:14px}.step-copy{grid-column:2;padding:0}.step h3{font-size:19px}.mini-label{margin-bottom:8px}.mini-exam{padding:9px;margin-top:8px}.mini-exam .exam-icon{width:28px;height:28px}.mini-exam>span:not(.exam-icon){font-size:11px}.timer-demo{width:144px;height:144px}.timer-ring{width:144px;height:144px}.timer-copy strong{font-size:27px}.detail-head{flex-direction:column;align-items:flex-start;gap:14px}.faq{grid-template-columns:minmax(0,1fr);gap:24px}.close-card{flex-direction:column;align-items:flex-start;padding:32px}.exams-section,.steps-section,.faq-section{padding:56px 0}.site-footer .copyright{margin-left:0}th,td{padding:12px;font-size:14px}.legal-table table{min-width:320px}}
@media(max-width:420px){.wrap{padding-inline:18px}.detail-hero h1{font-size:min(32px,8vw)}.phone{width:250px;height:510px}.app-row:last-child{display:none}.chip{font-size:12px;padding:8px 12px}.hero .cta{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}.hero .cta .button{min-height:48px}.exam-card{padding:24px}.hero .small{font-size:13px}.stage{max-height:320px}.site-header .wrap{gap:6px 8px}}
@media(max-width:760px){.sample-question{padding:20px 16px}.sample-question h2{font-size:20px}.sample-options label{padding:14px 12px;gap:10px}.sample-promo{padding-inline:0}.sample-tracker{padding:16px}.sample-result{padding:24px 18px}}
@media(max-width:760px){.site-header .blog-locale-note{display:none}.site-header .main-nav{flex-wrap:nowrap}}
@media(max-width:1000px){.guide-layout{grid-template-columns:180px minmax(0,1fr);gap:32px}.guide-hero-grid{gap:24px}.blog-grid{gap:18px}.blog-card-copy{padding:12px 20px 24px}}
@media(max-width:820px){.guide-hero-grid{grid-template-columns:minmax(0,1fr)}.guide-hero-art{max-width:520px}.guide-layout{grid-template-columns:minmax(0,1fr);gap:28px}.guide-toc nav{position:static;border-bottom:1px solid var(--line-strong);padding-bottom:24px}.guide-toc a{min-height:44px}.blog-grid{grid-template-columns:minmax(0,1fr)}.blog-preview .section-heading{align-items:start}}
@media(max-width:760px){.blog-featured,.blog-grid-pair>.blog-card:only-child{grid-template-columns:minmax(0,1fr)}.blog-featured .blog-card-copy,.blog-grid-pair>.blog-card:only-child .blog-card-copy{padding:12px 20px 24px}.blog-intro{padding-bottom:40px}.blog-list{padding-bottom:48px}.blog-topic-heading{margin-top:0}.blog-list section+section{margin-top:48px}.blog-preview{padding:48px 0}.guide-breadcrumb{margin-bottom:24px}.guide-hero{padding-bottom:40px}.guide-hero h1{font-size:clamp(28px,5vw,36px)}.guide-hero-art{max-width:none}.guide-body{font-size:16px}.guide-body>section{scroll-margin-top:var(--space-l);margin-top:36px}.guide-takeaway,.guide-practice{padding:22px 18px}.guide-figure svg{border-radius:16px}.guide-answer{padding:14px 16px}}
@media(max-width:760px){.exam-guide .stat-card{padding:16px 12px;gap:12px}.exam-guide .stat-card strong{font-size:30px}.exam-guide .stat-card span{font-size:12px;line-height:1.5}.exam-toc{gap:4px 18px}.archive-banks,.topic-details{padding-inline:16px}.exam-guide-body h2{font-size:24px}}

/* ===== motion ===== */
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-90px,70px) scale(1.15)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(70px,-50px) scale(.9)}}
@keyframes pan{to{transform:translate(64px,64px)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--night-blue-light) 60%,transparent)}50%{box-shadow:0 0 0 6px transparent}}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes shift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes sheen{0%{background-position:150% 0}60%,100%{background-position:-100% 0}}
@keyframes sweep{0%,100%{opacity:.2}50%{opacity:1}}
/* Scroll-linked parallax and reveals: Chrome, Edge and Safari 26+; other browsers show the page still.
   Reveals animate translate and scale (not transform) so hover lifts keep working. */
@supports (animation-timeline: view()){
  .phone-wrap{animation:tilt linear both;animation-timeline:scroll(root);animation-range:0px 560px}
  .f1{animation:para-up linear both;animation-timeline:scroll(root);animation-range:0px 640px}
  .f2{animation:para-down linear both;animation-timeline:scroll(root);animation-range:0px 640px}
  .hero-copy{animation:copy-out linear both;animation-timeline:scroll(root);animation-range:0px 520px}
  .hero .glows{animation:bg-lag linear both;animation-timeline:scroll(root);animation-range:0px 1200px}
  .section-glow{animation:para-bg linear both;animation-timeline:view()}
  .exams-section .eyebrow,.exams-section h2,.exams-section .lead,.steps-section .eyebrow,.steps-section h2,.faq h2,.exam-card,.step,.faq-row,.bank-card{animation:reveal linear both;animation-timeline:view();animation-range:cover 0px cover 240px}
  .exam-card:nth-child(3n+2),.step:nth-child(3),.faq-row:nth-child(2){animation-range:cover 40px cover 280px}
  .exam-card:nth-child(3n),.step:nth-child(4),.faq-row:nth-child(3){animation-range:cover 80px cover 320px}
  .track{animation:draw linear both;animation-timeline:view();animation-range:cover 40px cover 320px}
  .close-card{animation:shift 12s ease-in-out infinite,reveal linear both;animation-timeline:auto,view();animation-range:normal,cover 0px cover 240px}
  @keyframes tilt{from{transform:perspective(1100px) rotateX(5deg) rotateY(-10deg) rotateZ(5deg)}to{transform:perspective(1100px) translateY(40px)}}
  @keyframes para-up{to{transform:translateY(-48px)}}
  @keyframes para-down{to{transform:translateY(48px)}}
  @keyframes copy-out{to{transform:translateY(70px);opacity:.75}}
  @keyframes bg-lag{to{transform:translateY(420px)}}
  @keyframes para-bg{from{transform:translateY(120px)}to{transform:translateY(-120px)}}
  @keyframes reveal{from{opacity:.65;translate:0 24px;scale:.99}to{opacity:1;translate:0 0;scale:1}}
  @keyframes draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  /* On narrow screens the phone sits above the next section: it only straightens, nothing drifts into the exams. */
  @media(max-width:760px){.phone-wrap{animation-name:tilt-narrow;animation-range:0px 560px}.f1,.f2,.hero-copy{animation:none}}
  @keyframes tilt-narrow{from{transform:perspective(1100px) rotateX(10deg) rotateY(-12deg) rotateZ(3deg)}to{transform:none}}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.hero h1{background:none;color:var(--night-text)}}
@media print{:root{--night-bg:var(--sheet);--night-text:var(--ink);--night-soft:var(--ink-soft);--night-blue-light:var(--mark);--night-violet-light:var(--mark);--night-green-light:var(--correct);--night-teal-light:var(--mark)}*,*::before,*::after{animation:none!important}.site-header{position:static}.glows,.section-glow,.band-light{display:none}.hero h1{background:none;color:var(--ink)}.button.primary,.legal-body .button,.step-n,.close-card p,.chip .dot,.chip .clock,.answer-options .answer-chosen{color:var(--ink)}}

@media print{.exam-grid>.exam-card{display:flex!important}.catalog-toggle{display:none}}

@media print{.sample-solution>div{display:block!important}.sample-solution summary,.sample-tracker,.sample-question button{display:none!important}}
