/* EasyMenew website — built only on tokens.css (docs/07-design-system.md, design-system/easymenew/MASTER.md).
   Style: warm "Vibrant & Block-based" — colour blocks, flat illustrations (static/site/img), stagger reveal. */
/* Website font: IRANYekanX (owner's choice, 2026-11-13; commercial Fontiran font, self-hosted in static/fonts, site only).
   Light/Black/ExtraBlack files have no Latin glyphs, so Latin text falls through to Vazirmatn. Files: 300, 400,
   600 (named "Bold" but really DemiBold), 900, 950; weight ranges map every weight the site uses with no faux bold.
   The panel, KDS and guest menus keep their own fonts. */
@font-face{font-family:"IRANYekanX";font-style:normal;font-weight:100 350;font-display:swap;src:url("../fonts/iranyekanx-300.52793e66ac60.woff2") format("woff2")}
@font-face{font-family:"IRANYekanX";font-style:normal;font-weight:400 500;font-display:swap;src:url("../fonts/iranyekanx-400.f8d85c893c84.woff2") format("woff2")}
@font-face{font-family:"IRANYekanX";font-style:normal;font-weight:600 750;font-display:swap;src:url("../fonts/iranyekanx-600.6a1fa711b45c.woff2") format("woff2")}
@font-face{font-family:"IRANYekanX";font-style:normal;font-weight:800 900;font-display:swap;src:url("../fonts/iranyekanx-900.14a85a436e1d.woff2") format("woff2")}
@font-face{font-family:"IRANYekanX";font-style:normal;font-weight:950 1000;font-display:swap;src:url("../fonts/iranyekanx-950.9989e895b20a.woff2") format("woff2")}
/* Digits (Persian, Arabic, Latin) and number separators stay in Vazirmatn (owner, 2026-11-13). */
@font-face{font-family:"EM Digits";font-weight:100 900;font-display:swap;src:url("../fonts/vazirmatn.05d9ce2a23d3.woff2") format("woff2");unicode-range:U+0660-066C,U+06F0-06F9}
@font-face{font-family:"EM Digits";font-weight:100 900;font-display:swap;src:url("../fonts/vazirmatn-latin.e7eada615dc3.woff2") format("woff2");unicode-range:U+0025,U+002C,U+0030-0039}
:root{--font:"EM Digits","IRANYekanX","Vazirmatn",system-ui,-apple-system,"Segoe UI",sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--font);font-size:16px;line-height:var(--lh-body);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;color:var(--text);letter-spacing:0}
p{margin:0}
a{color:var(--accent-text);text-underline-offset:3px}
img,svg{display:block}
.icon{flex:none}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--radius-xs)}
.wrap{max-width:1180px;margin:0 auto;padding:0 var(--space-5)}
@media (min-width:900px){.wrap{padding:0 var(--space-7)}}
.narrow{max-width:760px}
.muted{color:var(--muted)}.small{font-size:var(--fs-small)}.center{text-align:center}
.center-block{margin-inline:auto;text-align:center}
.center-row{justify-content:center}
.skip{position:absolute;inset-inline-start:var(--space-2);top:-60px;background:var(--primary);color:var(--on-primary);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);z-index:var(--z-toast)}
.skip:focus{top:var(--space-2)}
.ornament{display:none}

/* type ------------------------------------------------------------- */
.eyebrow{display:inline-flex;align-items:center;gap:var(--space-2);margin:0 0 var(--space-4);font-size:var(--fs-label);font-weight:600;color:var(--accent-text)}
.eyebrow::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--accent);transform:rotate(45deg)}
.h1{font-size:clamp(1.875rem,3.6vw,var(--fs-h1));line-height:var(--lh-h1);font-weight:800;margin-bottom:var(--space-4);text-wrap:balance}
.h2{font-size:clamp(1.5rem,2.6vw,var(--fs-h2));line-height:var(--lh-h2);font-weight:750;margin-bottom:var(--space-3);text-wrap:balance}
.h3{font-size:var(--fs-h3);line-height:var(--lh-h3);font-weight:700}
.lead{font-size:var(--fs-body-lg);line-height:var(--lh-body-lg);color:var(--muted);max-width:620px;text-wrap:pretty}
.sec-head{max-width:640px;margin:0 0 var(--space-9)}
.sec-head.center-block,.center .sec-head{margin-inline:auto}

/* buttons ---------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:44px;padding:0 var(--space-5);border-radius:var(--radius-sm);border:1px solid transparent;font:inherit;font-size:.9375rem;font-weight:600;line-height:1;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background var(--dur-1) var(--ease),border-color var(--dur-1),color var(--dur-1),transform var(--dur-1)}
.btn:active{transform:translateY(1px)}
.btn--lg{min-height:52px;padding:0 var(--space-6);font-size:1rem}
.btn--sm{min-height:36px;padding:0 var(--space-4);font-size:var(--fs-small)}
.btn--block{width:100%}
.btn--primary{background:var(--primary);color:var(--on-primary);box-shadow:0 3px 0 var(--copper-800)}
.btn--primary:hover{background:var(--primary-hover)}
.btn--primary:active,.btn--light:active{transform:translateY(2px);box-shadow:0 1px 0 var(--copper-800)}
.btn--ghost{background:var(--surface);border-color:var(--line-strong);color:var(--text)}
.btn--ghost:hover{border-color:var(--copper-600);color:var(--copper-700)}
.btn--light{background:var(--saffron-400);color:var(--espresso-900);box-shadow:0 3px 0 rgb(0 0 0 / .25)}
.btn--light:hover{background:#F6C25E}
.btn--outline-light{border-color:rgb(255 255 255 / .28);color:var(--white);background:transparent}
.btn--outline-light:hover{border-color:rgb(255 255 255 / .6)}
.btn--link{background:none;border:0;padding:0;min-height:36px;color:var(--text);text-decoration:underline;text-decoration-color:var(--line-strong)}
.btn--link:hover{text-decoration-color:var(--accent)}
.link{color:var(--text);text-decoration:none;font-weight:600}
.link:hover{color:var(--text-2)}
.arrow-link{display:inline-flex;align-items:center;gap:var(--space-2);font-weight:600;color:var(--text);text-decoration:none}
.arrow-link .icon{transition:transform var(--dur-1) var(--ease)}
.arrow-link:hover .icon{transform:translateX(-3px)}

/* nav --------------------------------------------------------------- */
.nav{position:sticky;top:0;z-index:var(--z-nav);background:rgb(255 249 240 / .9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav__in{display:flex;align-items:center;gap:var(--space-7);min-height:64px}
.logo{display:inline-flex;align-items:center;gap:var(--space-2);text-decoration:none;color:var(--text)}
.logo img{display:block}
.logo__word{font-weight:800;font-size:1.1875rem;letter-spacing:0}
.logo__word b{font-weight:800;color:var(--copper-600)}
.nav__links{display:none;gap:var(--space-1)}
.nav__links a{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);text-decoration:none;color:var(--muted);font-size:.9375rem;font-weight:500;transition:color var(--dur-1),background var(--dur-1)}
.nav__links a:hover{color:var(--text);background:var(--surface-2)}
.nav__links a[aria-current]{color:var(--text);font-weight:600}
.nav__cta{display:none;margin-inline-start:auto;align-items:center;gap:var(--space-4)}
@media (min-width:900px){.nav__links,.nav__cta{display:flex}}
.nav__mobile{margin-inline-start:auto;position:relative}
@media (min-width:900px){.nav__mobile{display:none}}
.nav__mobile summary{list-style:none;cursor:pointer;width:40px;height:40px;border-radius:var(--radius-sm);border:1px solid var(--line-strong);display:grid;place-items:center;background:var(--surface);color:var(--text)}
.nav__mobile summary::-webkit-details-marker{display:none}
.nav__sheet{position:absolute;inset-inline-end:0;top:48px;width:min(300px,calc(100vw - 40px));background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-2);display:flex;flex-direction:column;box-shadow:var(--shadow-2)}
.nav__sheet a{padding:var(--space-3);border-radius:var(--radius-sm);text-decoration:none;color:var(--text);font-weight:500}
.nav__sheet a:hover{background:var(--surface-2)}
.nav__sheet .btn{margin-top:var(--space-2);color:var(--on-primary)}

/* sections ---------------------------------------------------------- */
.section{padding:var(--space-10) 0}
@media (min-width:900px){.section{padding:var(--space-12) 0}}
.section--alt{background:var(--surface-2)}
.section--tight{padding:var(--space-10) 0 var(--space-6)}
.section--flush{padding:0 0 var(--space-10)}

/* feature list items (features page) -------------------------------- */
.grid3{display:grid;gap:var(--space-7) var(--space-8);grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.tile h3{font-size:var(--fs-h4);font-weight:700;margin-bottom:var(--space-1)}
.tiles{margin-top:var(--space-10)}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-6);transition:transform var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease)}
.tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-2)}
.tile__ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;margin-bottom:var(--space-4)}
.tile__ic--copper{background:var(--copper-100);color:var(--copper-700)}.tile__ic--saffron{background:var(--saffron-100);color:var(--warning)}.tile__ic--pistachio{background:var(--pistachio-100);color:var(--pistachio-600)}.tile__ic--berry{background:var(--berry-100);color:var(--berry-600)}
.tile p{color:var(--muted);font-size:.9375rem}
.tile__num{display:none}
.checks{list-style:none;padding:0;margin:0 0 var(--space-6);display:grid;gap:var(--space-3)}
.checks li{position:relative;padding-inline-start:var(--space-7);color:var(--text-2)}
.checks li::before{content:"";position:absolute;inset-inline-start:0;top:.45em;width:16px;height:16px;border-radius:var(--radius-xs);background:var(--success-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' stroke='%232F7A5E' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.toc{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-2);margin-top:var(--space-6)}
.toc a{display:inline-flex;align-items:center;gap:6px;min-height:40px;background:var(--surface);transition:background var(--dur-1),color var(--dur-1),border-color var(--dur-1);padding:var(--space-1) var(--space-4);border-radius:var(--radius-pill);border:1px solid var(--line-strong);color:var(--muted);text-decoration:none;font-size:var(--fs-small);font-weight:500}
.toc a:hover{color:var(--copper-700);border-color:var(--copper-600);background:var(--copper-100)}
.feature__in{display:grid;gap:var(--space-9);align-items:center}
@media (min-width:960px){.feature__in{grid-template-columns:1.1fr 1fr}.feature__in--rev>div:first-child{order:2}}
.mock{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-2);max-width:360px;margin-inline:auto;width:100%}
.mock__row{display:flex;justify-content:space-between;font-weight:700;margin-bottom:var(--space-3)}
.mock__group{display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--space-4)}
.mock__group small{color:var(--muted);font-weight:600;font-size:var(--fs-caption)}
.radio{padding:var(--space-2) var(--space-3);border:1px solid var(--line-strong);border-radius:var(--radius-sm);font-size:var(--fs-small)}
.radio.on{border-color:var(--copper-700);box-shadow:inset 0 0 0 1px var(--copper-700);background:var(--copper-100);font-weight:600}
.mock__btn{background:var(--primary);color:var(--on-primary);text-align:center;border-radius:var(--radius-sm);padding:var(--space-3);font-weight:600}
.mock--kds{background:var(--kds-bg);border-color:var(--kds-line);display:grid;gap:var(--space-3)}
.mock__ticket{background:var(--kds-surface);color:var(--kds-text);border:1px solid var(--kds-line);border-top:3px solid var(--kds-new);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);display:flex;flex-direction:column;gap:2px}
.mock__ticket.late{border-top-color:var(--kds-late)}
.mock__ticket b{font-size:1.375rem}.mock__ticket small{color:var(--kds-muted)}.mock__ticket p{margin:var(--space-1) 0;font-weight:600}
.mock__ticket .note{color:var(--kds-prep)}
.mock__ticket span{margin-top:var(--space-2);text-align:center;background:var(--kds-prep);color:var(--kds-bg);border-radius:var(--radius-sm);padding:var(--space-2);font-weight:700}
.mock__ticket span.ready{background:var(--kds-ready)}

/* pricing ----------------------------------------------------------- */
.pricing{display:flex;flex-direction:column;align-items:center}
.cycle-input{position:absolute;opacity:0;pointer-events:none}
.cycle{display:inline-flex;gap:2px;padding:3px;margin-bottom:var(--space-8);background:var(--surface-3);border-radius:var(--radius-sm)}
.cycle label{padding:var(--space-2) var(--space-4);border-radius:5px;cursor:pointer;font-size:var(--fs-small);font-weight:600;color:var(--muted);transition:background var(--dur-1),color var(--dur-1)}
.cycle label em{font-style:normal;font-size:var(--fs-caption);color:var(--success);margin-inline-start:var(--space-1)}
.cycle-input:nth-of-type(1):checked~.cycle label:nth-of-type(1),.cycle-input:nth-of-type(2):checked~.cycle label:nth-of-type(2){background:var(--surface);color:var(--text);box-shadow:var(--shadow-1)}
.cycle-input:nth-of-type(1):focus-visible~.cycle label:nth-of-type(1),.cycle-input:nth-of-type(2):focus-visible~.cycle label:nth-of-type(2){box-shadow:var(--focus)}
.pricing .plans{width:100%}
.p-y{display:none}
.cycle-input:nth-of-type(2):checked~.plans .p-y{display:inline}
.cycle-input:nth-of-type(2):checked~.plans .plan__cta .p-y{display:inline-flex}
.cycle-input:nth-of-type(2):checked~.plans .p-m{display:none}
.plans{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));margin-bottom:var(--space-5)}
.plan{position:relative;display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:0;padding:var(--space-7) var(--space-6) var(--space-6);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md)}
.plan--pop{border:2px solid var(--copper-700);box-shadow:0 6px 0 var(--copper-100),var(--shadow-2)}
.plan h3{font-size:var(--fs-h3);font-weight:700}
.plan__tag{position:absolute;top:var(--space-6);inset-inline-end:var(--space-6);font-size:var(--fs-caption);font-weight:600;color:var(--on-primary);background:var(--primary);padding:2px var(--space-2);border-radius:var(--radius-pill)}
.plan__line{color:var(--muted);font-size:var(--fs-small)}
.plan__head,.plan__buy{display:flex;flex-direction:column;gap:var(--space-2)}
.plan__buy{margin-top:var(--space-3)}
.plan__price{font-size:1.875rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.3}
.plan__price small{font-size:var(--fs-small);font-weight:500;color:var(--muted)}
.plan__note{color:var(--muted);font-size:var(--fs-caption)}
.plan__feats{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--line)}
.plan ul{list-style:none;padding:0;margin:0 0 var(--space-3);display:grid;gap:var(--space-2)}
.plan__group{margin:var(--space-4) 0 var(--space-2);font-size:var(--fs-caption);font-weight:700;color:var(--accent-text)}
.plan__feats>.plan__group:first-child{margin-top:0}
.plan__more summary{list-style:none;cursor:pointer;user-select:none;display:inline-flex;align-items:center;gap:var(--space-2);margin:var(--space-1) 0 var(--space-3);padding:var(--space-2) var(--space-4);border:1px solid var(--line-strong);border-radius:var(--radius-pill);background:var(--surface);box-shadow:0 2px 0 var(--line-strong);font-size:var(--fs-small);font-weight:700;color:var(--accent-text);transition:background var(--dur-1),border-color var(--dur-1),transform var(--dur-1)}
.plan__more summary::after{content:"";width:14px;height:14px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 6l4.5 4.5L12.5 6' stroke='black' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 6l4.5 4.5L12.5 6' stroke='black' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform var(--dur-2,.2s)}
.plan__more[open] summary::after{transform:rotate(180deg)}
.plan__more summary:active{transform:translateY(1px);box-shadow:none}
.plan__more summary::-webkit-details-marker{display:none}
.plan__more summary:hover{background:var(--copper-100);border-color:var(--copper-400)}
.plan__more .open-yes,.plan__more[open] .open-no{display:none}.plan__more[open] .open-yes{display:inline}
.plan__count{display:inline-flex;align-items:center;gap:var(--space-2);align-self:flex-start;padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);background:var(--success-soft);color:var(--success);font-size:var(--fs-small);font-weight:600}
.plan__count b{font-size:1.0625rem;font-weight:800}
.plan__was{display:block;font-size:var(--fs-small);font-weight:500;color:var(--muted);text-decoration-color:var(--danger)}
.plan__save{display:inline-block;margin-inline-end:var(--space-1);padding:0 var(--space-2);border-radius:var(--radius-pill);background:var(--success);color:#fff;font-weight:700}
.plan__lock{display:none;gap:var(--space-2);align-items:flex-start;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--saffron-100);color:var(--espresso-900);font-size:var(--fs-caption);font-weight:600;line-height:1.7}
.plan__lock .icon{margin-top:.3em}
.cycle-input:nth-of-type(2):checked~.plans .plan__lock{display:flex}
.plan__guard{display:flex;align-items:center;justify-content:center;gap:var(--space-1);font-size:var(--fs-caption);color:var(--success);font-weight:600}
.plan__tag--gold{background:var(--saffron-400);color:var(--espresso-900)}
.plan li{position:relative;padding-inline-start:var(--space-6);font-size:.9375rem;color:var(--text-2)}
.plan li::before{content:"";position:absolute;inset-inline-start:0;top:.5em;width:14px;height:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3L12.5 5' stroke='%2392400E' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.plan__tag--no{color:var(--danger);background:var(--danger-soft)}
.plan li.is-no{color:var(--muted);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--danger) 55%,transparent)}
.plan li.is-no::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 4l8 8M12 4l-8 8' stroke='%23B42318' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}
.plan__warn{margin:var(--space-2) 0 0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--danger-soft);color:var(--danger);font-size:var(--fs-small);line-height:1.7}
.plan__cta{display:flex;flex-direction:column;gap:var(--space-1);margin-top:auto;padding-top:var(--space-2)}
.plan__cta .btn--link{align-self:center;font-size:var(--fs-small)}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}
.compare{width:100%;border-collapse:collapse;font-size:.9375rem}
.compare th,.compare td{padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--line);text-align:center;font-weight:400}
.compare thead th{font-weight:700;color:var(--text);background:var(--surface)}
.compare td:first-child,.compare th:first-child,.compare th[scope=row]{text-align:start;color:var(--text-2)}
.compare tr:last-child td,.compare tr:last-child th{border-bottom:0}
.compare--plans td{white-space:nowrap}
.mark{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;vertical-align:middle}
.mark svg{stroke-width:3}
.mark--yes{background:var(--success-soft);color:var(--success)}
.mark--no{background:var(--danger-soft);color:var(--danger)}
@media (max-width:640px){.compare th,.compare td{padding:var(--space-3) var(--space-2);font-size:var(--fs-small)}.compare th[scope=row]{min-width:8.5rem;padding-inline-start:var(--space-4)}.compare__cta{display:none}}
.compare__section th{background:var(--surface-2)!important;color:var(--text)!important;font-weight:700!important;font-size:var(--fs-small);text-align:start!important}
.buy-steps{list-style:none;padding:0;margin:0 auto;max-width:720px;counter-reset:s;display:grid}
.buy-steps li{counter-increment:s;display:grid;grid-template-columns:36px 1fr;column-gap:var(--space-4);padding:var(--space-5) 0;border-bottom:1px solid var(--line)}
.buy-steps li::before{content:counter(s,persian);grid-row:span 2;width:32px;height:32px;border-radius:var(--radius-sm);background:var(--primary);box-shadow:0 3px 0 var(--copper-800);color:var(--on-primary);display:grid;place-items:center;font-weight:700;font-size:var(--fs-small)}
.buy-steps b{font-weight:700}
.buy-steps span{color:var(--muted);font-size:.9375rem}

/* faq ----------------------------------------------------------------- */
.faq{max-width:760px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-5) 0;font-weight:600;font-size:1.0625rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:12px;height:12px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.5l4 4 4-4' stroke='%23735A4A' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;transition:transform var(--dur-2) var(--ease)}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq p{padding:0 0 var(--space-5);color:var(--muted)}

/* cta band ------------------------------------------------------------- */
.cta{position:relative;overflow:hidden;background:var(--dark) url("img/pattern-dark.159691a417bc.svg") 0 0/120px;color:var(--on-dark)}
.cta .wrap{position:relative}
.cta .h2{color:var(--on-dark)}
.cta .lead{color:var(--on-dark-muted);margin:0 auto var(--space-7)}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}

/* contact & forms --------------------------------------------------- */
.contact{display:grid;gap:var(--space-10);align-items:start}
@media (min-width:960px){.contact{grid-template-columns:1fr 1.05fr}}
.contact__direct{margin-top:var(--space-7);padding-top:var(--space-5);border-top:1px solid var(--line);display:grid;gap:var(--space-2)}
.form-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-7);box-shadow:var(--shadow-1)}
.form-card form{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5) var(--space-4)}
.form-card form>*{grid-column:span 2}
@media (min-width:560px){.form-card .f{grid-column:span 1}.form-card .f--wide{grid-column:span 2}}
.f{display:flex;flex-direction:column;gap:6px}
.f span{font-weight:600;font-size:var(--fs-label);color:var(--text)}
.f i{color:var(--danger);font-style:normal}
.f input,.f select,.f textarea{font:inherit;font-size:.9375rem;width:100%;padding:0 var(--space-3);min-height:44px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);transition:border-color var(--dur-1),box-shadow var(--dur-1)}
.f textarea{padding:var(--space-3);resize:vertical;min-height:110px}
.f input:hover,.f select:hover,.f textarea:hover{border-color:var(--espresso-300)}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--copper-700);box-shadow:0 0 0 3px rgb(224 138 60 / .3)}
.f small{color:var(--danger);font-weight:500;font-size:var(--fs-small)}
.f--err input,.f--err select{border-color:var(--danger)}
.form-error{background:var(--danger-soft);color:var(--danger);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);font-weight:500}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:-1px}
.sent{text-align:center;padding:var(--space-7) var(--space-2)}
.sent h2{font-size:var(--fs-h3);margin-bottom:var(--space-2)}
.sent__check{width:48px;height:48px;margin:0 auto var(--space-4);border-radius:50%;background:var(--success-soft);color:var(--success);display:grid;place-items:center}

/* legal ------------------------------------------------------------- */
.legal h1{margin-bottom:var(--space-1)}
.legal h2{font-size:var(--fs-h3);margin:var(--space-8) 0 var(--space-2)}
.legal p,.legal li{color:var(--text-2)}
.legal ul{padding-inline-start:var(--space-5);display:grid;gap:var(--space-1)}

/* footer -------------------------------------------------------------- */
.foot{position:relative;padding:var(--space-10) 0 var(--space-6);background:var(--surface-2) url("img/pattern-light.1ae344b4f875.svg") 0 0/96px}
.foot__art{position:absolute;inset-inline:0;top:0;height:8px;background:linear-gradient(90deg,var(--copper-400) 0 20%,var(--saffron-400) 0 40%,var(--pistachio-400) 0 60%,var(--berry-400) 0 80%,var(--copper-700) 0)}
.foot__grid{display:grid;gap:var(--space-8);grid-template-columns:1.4fr repeat(3,1fr)}
@media (max-width:760px){.foot__grid{grid-template-columns:1fr 1fr}.foot__grid>div:first-child{grid-column:1/-1}}
.foot__grid p{margin-top:var(--space-3);color:var(--muted);font-size:var(--fs-small);max-width:280px}
.foot__grid nav{display:flex;flex-direction:column;gap:var(--space-2)}
.foot__grid nav b{font-size:var(--fs-label);font-weight:600;color:var(--text);margin-bottom:var(--space-1)}
.foot__grid nav a{color:var(--muted);text-decoration:none;font-size:var(--fs-small)}
.foot__grid nav a:hover{color:var(--text)}
.foot__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-3);margin-top:var(--space-9);padding-top:var(--space-5);border-top:1px solid var(--line);color:var(--muted);font-size:var(--fs-caption)}

/* colour blocks + illustrations ------------------------------------- */
.page-hero__art{display:flex;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-6)}
.page-hero__art img{width:56px;height:56px}
.page-hero__art img:nth-child(odd){transform:rotate(-8deg)}.page-hero__art img:nth-child(even){transform:rotate(6deg) translateY(6px)}
.page-art{width:200px;height:auto;margin:0 0 var(--space-5);margin-inline-start:-12px}
.feature__visual{position:relative;border-radius:var(--radius-xl);padding:clamp(24px,5vw,56px);display:grid;place-items:center;background:var(--surface-2) url("img/pattern-light.1ae344b4f875.svg") 0 0/96px}
.feature__visual--copper{background-color:var(--copper-100)}.feature__visual--saffron{background-color:var(--saffron-100)}.feature__visual--pistachio{background-color:var(--pistachio-100)}.feature__visual--berry{background-color:var(--berry-100)}.feature__visual--latte{background-color:var(--latte-200)}
.section--alt .feature__visual--latte{background-color:var(--surface)}
.feature__art{width:100%;max-width:400px;height:auto}
.feature__sticker{position:absolute;top:-18px;inset-inline-end:-10px;width:68px;height:68px;z-index:1}
.mock__ticket .late__time{display:inline-flex;align-items:center;gap:4px;color:var(--kds-late)}
.plan__art{width:96px;height:64px;margin:calc(-1 * var(--space-2)) 0 var(--space-2)}
.cta__art{position:absolute;inset-inline-start:max(16px,calc(50% - 600px));bottom:-8px;width:220px;height:auto;display:none}
@media (min-width:1100px){.cta__art{display:block}}

/* scroll reveal: site.js adds .js to <html>; without JS everything is visible */
@media (prefers-reduced-motion:no-preference){
  .js [data-reveal]{opacity:0;transform:translateY(16px) scale(.98);transition:opacity .45s var(--ease),transform .5s cubic-bezier(.34,1.4,.64,1);transition-delay:var(--d,0ms)}
  .js [data-reveal].is-in{opacity:1;transform:none}
}

/* entrance (hero only; respects reduced motion) ----------------------- */
@media (prefers-reduced-motion:no-preference){
  .reveal{animation:rise .6s var(--ease) both}
  .reveal--2{animation-delay:.08s}.reveal--3{animation-delay:.16s}
  @keyframes rise{from{opacity:0;transform:translateY(8px)}}
}

/* brand dropdown (site.js) — replaces the browser's select popup */
.sel{position:relative}
.sel__btn{display:flex;align-items:center;gap:var(--space-2);width:100%;min-height:44px;padding:0 var(--space-3);font:inherit;font-size:.9375rem;text-align:start;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);cursor:pointer;transition:border-color var(--dur-1),box-shadow var(--dur-1)}
.sel__btn:hover{border-color:var(--espresso-300)}
.sel__btn:focus-visible,.sel.is-open .sel__btn{outline:none;border-color:var(--copper-700);box-shadow:0 0 0 3px rgb(224 138 60 / .3)}
.sel__val{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sel__btn svg{color:var(--muted);transition:transform var(--dur-2) var(--ease)}
.sel.is-open .sel__btn svg{transform:rotate(180deg);color:var(--copper-700)}
.f--err .sel__btn{border-color:var(--danger)}
.sel__list{position:absolute;z-index:20;top:calc(100% + 6px);inset-inline:0;margin:0;padding:6px;list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow-3);max-height:280px;overflow-y:auto;animation:sel-in var(--dur-2) var(--ease)}
@keyframes sel-in{from{opacity:0;transform:translateY(-4px)}}
.sel__opt{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:9px 12px;border-radius:var(--radius-sm);cursor:pointer;font-weight:500}
.sel__opt.is-active{background:var(--surface-2)}
.sel__opt[aria-selected="true"]{color:var(--copper-700);font-weight:700}
html{scrollbar-width:thin;scrollbar-color:var(--latte-300) var(--bg)}
::selection{background:var(--copper-100);color:var(--espresso-900)}
.f .sel span{font-weight:inherit;font-size:inherit;color:inherit}

/* launch-offer bar + promises (sales promises from settings: GUARANTEE_DAYS, SUPPORT_HOURS, LAUNCH_OFFER) */
.topbar{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-1) var(--space-2);padding:var(--space-2) var(--space-4);background:var(--espresso-900);color:var(--cream-50);font-size:var(--fs-small);text-align:center;text-decoration:none;line-height:1.7}
.topbar b{color:var(--saffron-400)}
.topbar u{text-underline-offset:3px;font-weight:600}
.topbar:hover u{color:var(--saffron-400)}
/* support & card-to-card bar — the very top of the home page */
.supportbar{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-1) var(--space-6);padding:var(--space-2) var(--space-4);background:var(--saffron-400);color:var(--espresso-900);font-size:var(--fs-small);line-height:1.7;text-align:center}
.supportbar__item{display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:6px}
.supportbar a{color:inherit;font-weight:700;text-underline-offset:3px;display:inline-flex;align-items:center;gap:4px}
.supportbar a:hover{text-decoration-thickness:2px}
@media (max-width:600px){.supportbar{font-size:var(--fs-caption);gap:2px var(--space-3)}.supportbar .icon{display:none}}
.foot__hours{color:inherit;opacity:.8;font-size:var(--fs-small)}
.promises{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.promise{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-6);border-radius:var(--radius-md);background:var(--surface);border:1px solid var(--line)}
.promise__ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--success-soft);color:var(--success);margin-bottom:var(--space-2)}
.promise b{font-size:1.0625rem}
.promise span{color:var(--muted);font-size:var(--fs-small);line-height:1.8}
.swap{display:grid;gap:var(--space-3);grid-template-columns:1fr;max-width:920px;margin-inline:auto!important}
@media (min-width:720px){.swap{grid-template-columns:1fr 1fr}}
.swap li{list-style:none;display:grid;grid-template-columns:auto 1fr;gap:var(--space-1) var(--space-3);align-items:center;padding:var(--space-5);border-radius:var(--radius-md);background:var(--surface);border:1px solid var(--line)}
.swap ul,.swap{padding:0;margin:0}
.swap .icon{grid-row:span 2;width:40px;height:40px;padding:10px;border-radius:12px;background:var(--copper-100);color:var(--copper-700);box-sizing:content-box}
.swap s{color:var(--muted);font-size:var(--fs-small);text-decoration-color:var(--danger)}
.swap b{font-size:1rem}
.per-day{display:inline-flex;align-items:center;gap:var(--space-2);margin-top:var(--space-3);padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);background:var(--saffron-100);color:var(--espresso-900);font-weight:600;font-size:var(--fs-small)}
@media (max-width:600px){.topbar .icon{display:none}.topbar{font-size:var(--fs-caption)}}

/* plan tiers — each step looks more premium: پایه (quiet) < حرفه‌ای (copper) < ممتاز (dark + moving gold border) */
.plan--basic{background:var(--cream-50);border-color:var(--line-strong);box-shadow:none}
.plan--basic .plan__price{color:var(--text-2)}
.plan--good{background:linear-gradient(180deg,var(--copper-100) 0,var(--surface) 220px)}
.plan--good .plan__count{background:var(--surface)}

@property --plan-spin{syntax:"<angle>";inherits:false;initial-value:0deg}
.plan--top{
  --gold:#F2B33D;--gold-hi:#FFE3A1;
  color:var(--on-dark);border:3px solid transparent;
  background:
    url("img/pattern-dark.159691a417bc.svg") 0 0/120px padding-box,
    linear-gradient(160deg,#3A2618 0,var(--espresso-900) 55%) padding-box,
    conic-gradient(from var(--plan-spin),var(--espresso-800) 0 52%,var(--copper-700) 64%,var(--copper-400) 74%,var(--gold) 82%,#fff 86%,var(--gold) 89%,var(--copper-600) 94%,var(--espresso-800)) border-box;
  box-shadow:0 22px 44px -16px rgb(35 23 16 / .55);
  animation:plan-spin 3.5s linear infinite;
}
@keyframes plan-spin{to{--plan-spin:360deg}}
/* the outer glow turns with the comet, so the motion reads clearly on the cream page */
.plans{position:relative;z-index:0}
.plan--top::after{content:"";position:absolute;inset:-10px;z-index:-1;border-radius:calc(var(--radius-md) + 10px);pointer-events:none;
  background:conic-gradient(from var(--plan-spin),transparent 0 45%,var(--copper-600) 64%,var(--copper-400) 76%,var(--gold) 85%,var(--copper-400) 92%,transparent);
  filter:blur(16px);animation:plan-spin 3.5s linear infinite}
/* Windows "Animation effects: off" makes Chrome report reduced motion; the shine then only slows down (owner's choice). */
@media (prefers-reduced-motion:reduce){.plan--top,.plan--top::after{animation-duration:7s}}
.plan--top h3,.plan--top .plan__price{color:var(--cream-50)}
.plan--top h3{background:linear-gradient(90deg,var(--gold-hi),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent;width:fit-content}
.plan--top .plan__line,.plan--top .plan__note,.plan--top .plan__price small,.plan--top .plan__was{color:var(--on-dark-muted)}
.plan--top .plan__art{filter:drop-shadow(0 4px 12px rgb(242 179 61 / .35))}
.plan--top .plan__count{background:rgb(242 179 61 / .14);color:var(--gold-hi)}
.plan--top .plan__lock{background:rgb(242 179 61 / .16);color:var(--gold-hi)}
.plan--top .plan__guard{color:#8FD3B4}
.plan--top .btn--link{color:var(--cream-50);text-decoration-color:rgb(255 249 240 / .35)}
.plan--top .plan__feats{border-top-color:rgb(255 249 240 / .14)}
.plan--top .plan__group{color:var(--gold)}
.plan--top li{color:var(--espresso-100)}
.plan--top li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3L12.5 5' stroke='%23F2B33D' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.plan--top .plan__more summary{background:rgb(255 249 240 / .08);border-color:rgb(242 179 61 / .45);box-shadow:0 2px 0 rgb(0 0 0 / .35);color:var(--gold-hi)}
.plan--top .plan__more summary:hover{background:rgb(242 179 61 / .2);border-color:var(--gold)}
.plan--top .plan__tag--gold{box-shadow:0 0 16px -2px rgb(242 179 61 / .7)}
