/* taghvim.dev: Taghvim.dev's layer over the kit theme (styles.css, datepicker.css). Brandbook v1.0 palette on the
   kit's layout language; tg-* components for the landing's own sections. Phone layout designed on its own (spec §39). */

/* ---------- fonts: self-hosted, woff2, OFL (public/fonts/*-OFL.txt) ---------- */
@font-face{font-family:"Estedad";src:url("/fonts/Estedad-arabic-wght.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Estedad";src:url("/fonts/Estedad-latin-wght.woff2") format("woff2");font-weight:100 900;font-display:swap;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-200B,U+2012-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Geist Mono";src:url("/fonts/GeistMono-latin-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("/fonts/GeistMono-latin-500.woff2") format("woff2");font-weight:500 700;font-display:swap}

:root{
  --pom:#9F1239; --bur:#7A1735; --plum:#4E1746; --dplum:#32112F; --saffron:#D4A017; --cream:#FFF8EE; --soft:#ECE7E2; --char:#1E1B1D;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
body{font-family:"Estedad","Vazirmatn",Tahoma,sans-serif;font-feature-settings:"ss01" 0}
code,pre,kbd{font-family:var(--mono)}
bdi{unicode-bidi:isolate}
.nw{white-space:nowrap}
html:not(.js) .reveal{opacity:1;transform:none}
.tg-inline input{flex:1 1 80px;width:auto}
.tg-inline select{width:auto;max-width:60%;min-height:46px;border:1.5px solid var(--line-2);border-radius:12px;background:#fff;padding:6px 10px;font-size:15px;flex:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
h1,h2,h3{font-weight:800}
.sec-head h2{line-height:1.5}
.eyebrow{font-weight:700}
.eyebrow .dot{border-color:var(--orange)}

/* ---------- nav: cream on the hero, frosted after scrolling (spec §2) ---------- */
.nav{background:var(--cream)}
.nav.is-stuck{background:rgba(255,248,238,.88);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px)}
.brand__logo{width:160px}
.brand__logo--footer{width:200px}
.nav__links a{min-height:44px;display:inline-flex;align-items:center}
.nav__burger{width:46px;height:46px}
.drawer{inset:70px 0 0 0;background:var(--dplum);overflow-y:auto;padding:12px 16px calc(28px + env(safe-area-inset-bottom))}
.drawer nav{gap:0}
.drawer a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid rgba(255,255,255,.08)}
.drawer .btn{margin-top:18px}

/* ---------- hero: pomegranate cover, white type, the console mock (spec §3) ---------- */
.tg-hero .hero__title{font-size:clamp(34px,5vw,60px);line-height:1.4}
.tg-hero__l2{display:inline-block}
.tg-hero .eyebrow{font-size:11.5px;letter-spacing:.08em;font-family:"Estedad",sans-serif}
.tg-hero__micro{margin-top:14px;font-size:14px;color:rgba(255,255,255,.9)}
.tg-hero__surfaces{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;justify-content:flex-start}
.tg-hero__surfaces a{display:inline-flex;align-items:center;min-height:32px;font-size:13px;font-weight:700;padding:2px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.5);color:#fff;text-decoration:none;transition:background .18s,border-color .18s,color .18s}
.tg-hero__surfaces a:hover{background:rgba(255,255,255,.14);border-color:#fff}
.tg-hero__surfaces a:focus-visible{outline:2px solid var(--saffron);outline-offset:2px}
.tg-hero__surfaces a:active{background:#fff;color:var(--orange)}
.tg-hero__tertiary{margin-top:14px}
.tg-hero__tertiary a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:700;color:#fff;text-decoration:underline;text-underline-offset:5px}
.hero .btn--ghost{border-color:rgba(255,255,255,.75)}
.tg-con{padding:0 0 16px}
.tg-con__tabs{display:flex;gap:2px;padding:10px 12px 0;overflow-x:auto;scrollbar-width:none}
.tg-con__tabs::-webkit-scrollbar{display:none}
.tg-con__tabs button{flex:none;min-height:36px;padding:4px 10px;border-radius:9px;font-size:13px;font-weight:700;color:var(--gray)}
.tg-con__tabs button[aria-selected="true"]{background:var(--black);color:#fff}
.tg-con__state{padding:14px 18px 4px;min-height:228px;animation:tgFade .35s var(--ease)}
/* all four states share one grid cell, so the console keeps the height of the tallest and the page below never
   shifts while it rotates (it did on phones, every 4.5 s) */
.tg-con__stack{display:grid}
.tg-con__stack>.tg-con__state{grid-area:1/1}
.js .tg-con__stack>.tg-con__state:not(.is-on){visibility:hidden;animation:none}
.tg-con__title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.tg-con__title b{font-size:14px}
.tg-con__in{display:flex;gap:8px;align-items:center;border:1.5px solid var(--line-2);border-radius:12px;padding:8px 10px 8px 8px}
.tg-con__q{flex:1;font-weight:600;font-size:15px}
.tg-con__go{text-decoration:none}
.tg-con__out{margin-top:12px;border-top:1px dashed var(--line-2);padding-top:12px;display:grid;gap:8px}
.tg-con__ok{display:flex;align-items:center;gap:8px;font-size:18px;color:var(--black)}
.tg-con__ok .ico{color:var(--ok)}
.tg-con__meta{display:flex;flex-wrap:wrap;gap:6px}
.tg-con__meta span{font-size:12.5px;padding:1px 8px;border-radius:6px;background:var(--dash-bg);border:1px solid var(--line)}
.tg-con__who{font-weight:700;margin-bottom:10px}
.tg-con__slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;direction:ltr}
.tg-con__slots span{text-align:center;padding:6px 0;border-radius:9px;border:1px solid var(--line-2);font-weight:600;font-size:14px}
.tg-con__slots span.is-on{background:var(--saffron);border-color:var(--saffron);color:var(--char);animation:tgPulse .9s var(--ease) 1}
.tg-con__sel{margin-top:10px;font-size:13px;color:var(--gray);direction:ltr;text-align:right}
.tg-con__dl{display:grid;gap:6px;margin:0}
.tg-con__dl div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:6px}
.tg-con__dl dt{color:var(--gray);font-size:14px}
.tg-con__dl dd{margin:0;font-weight:700}
.tg-con__timeline{display:flex;gap:6px;margin:12px 18px 0}
.tg-con__timeline i{flex:1;height:4px;border-radius:4px;background:var(--line)}
.tg-con__timeline i.is-on{background:var(--orange)}
.tg-con__timeline.is-run i.is-on{background:linear-gradient(90deg,var(--orange) var(--p,100%),var(--line) var(--p,100%))}
.tg-tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:2px 10px;border-radius:999px;white-space:nowrap;border:1px solid var(--line-2);color:var(--muted)}
.tg-tag--live{background:rgba(21,128,61,.08);border-color:rgba(21,128,61,.3);color:var(--ok)}
.tg-tag--live i{width:7px;height:7px;border-radius:50%;background:currentColor}
.section--deep .tg-tag{color:#E6D9E2;border-color:rgba(255,255,255,.25)}

/* ---------- proof strip (spec §4): wraps on desktop, scrolls on phones, no marquee ---------- */
.tg-proof{background:#fff;border-bottom:1px solid var(--line);padding:22px 0 20px}
.tg-proof__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.tg-proof__list li{display:flex}
/* each chip is a link to its section: hover, keyboard focus, press and "this section is on screen" all show */
.tg-proof__list a{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:6px 12px 6px 14px;border-radius:999px;border:1px solid var(--line-2);font-weight:700;font-size:14.5px;white-space:nowrap;background:var(--cream);color:var(--black);text-decoration:none;transition:border-color .18s,background .18s,color .18s,box-shadow .18s}
.tg-proof__go{opacity:.45;transition:opacity .18s,transform .18s}
.tg-proof__list a:hover{border-color:var(--orange);color:var(--orange)}
.tg-proof__list a:hover .tg-proof__go{opacity:1;transform:translateX(-2px)}
.tg-proof__list a:focus-visible{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(159,18,57,.28)}
.tg-proof__list a:active,.tg-proof__list a[aria-current="true"]{background:var(--orange);border-color:var(--orange);color:#fff}
.tg-proof__list a:active .tg-proof__go,.tg-proof__list a[aria-current="true"] .tg-proof__go{opacity:1}
.tg-swap{width:16px;height:16px;flex:none;margin-inline:3px;stroke-width:2}
.tg-convert__x .ico{width:22px;height:22px}
/* the brand mark in diagrams: the header's calendar icon plus the wordmark */
.tg-brandmark{display:inline-flex;align-items:center;gap:8px;direction:rtl}
.tg-brandmark img{width:22px;height:22px;flex:none;display:block}
.tg-brandmark b{font-weight:800}
.tg-brandmark--lg img{width:30px;height:30px}
.tg-brandmark--lg b{font-size:21px}
.tg-node--brand{padding:8px 18px;min-height:46px;font-size:16px}
.tg-route__hub .tg-brandmark{flex-direction:column;gap:4px;font-size:13px}
.tg-proof__note{text-align:center;margin-top:12px;color:var(--muted);font-size:15px}

/* ---------- shared bits ---------- */
.tg-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px}
.section--paper .tg-card{background:var(--cream)}
.tg-node{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:6px 16px;border-radius:999px;border:1.5px solid var(--line-2);background:#fff;font-weight:700;font-size:14px;color:var(--black);text-align:center}
.tg-node--ink{background:var(--black);border-color:var(--black);color:#fff}
.tg-node--accent{background:var(--orange);border-color:var(--orange);color:#fff}
.tg-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tg-chips li{display:inline-flex;align-items:center;gap:7px;padding:4px 2px;font-weight:600;font-size:14.5px;color:var(--black)}
.tg-chips li:not(:has(.ico))::before{content:"";flex:none;width:6px;height:6px;border-radius:2px;background:var(--orange);opacity:.75}
.tg-chips:not(.tg-chips--filter){column-gap:18px;row-gap:2px}
.tg-chips--filter li{padding:5px 13px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface)}
.tg-chips--filter li::before{display:none}
.tg-chips li .ico{color:var(--ok)}
.tg-chips--center{justify-content:center;margin-top:30px}
.tg-checks{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:10px}
.tg-checks li{display:flex;gap:10px;align-items:flex-start;line-height:1.8}
.tg-checks li .ico{margin-top:6px;color:var(--ok)}
.tg-checks--x{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px}
.tg-checks--x li .ico{color:var(--orange)}
.tg-statement{max-width:760px;margin:36px auto 0;text-align:center;font-size:clamp(18px,2vw,22px);font-weight:700;line-height:1.9;color:var(--black)}
.tg-statement--start{text-align:start;margin:24px 0 0}
.section--deep .tg-statement{color:#fff}
.tg-note{font-size:13.5px;color:var(--muted);margin-top:12px}
.tg-note--center{text-align:center}
.tg-sub{font-size:18px;margin-bottom:14px}
.tg-more{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:700;color:var(--orange)}
.tg-more .ico{transition:transform .2s var(--ease)}
.tg-more:hover .ico{transform:translateX(-3px)}
.tg-dl{display:grid;gap:0;margin:0}
.tg-dl div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.tg-dl div:last-child{border-bottom:0}
.tg-dl dt{color:var(--muted);font-size:14px}
.tg-dl dd{margin:0;font-weight:700;text-align:end}
.tg-dl--mono dd{font-family:var(--mono);font-weight:500;font-size:14px}
.tg-kv{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px}
.tg-kv span{color:var(--muted)}
.tg-inline{display:flex;align-items:center;gap:8px}
.tg-inline em{font-style:normal;color:var(--muted);font-size:14px;white-space:nowrap}
.tg-result{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:14px;padding:12px 14px;border-radius:12px;background:var(--dash-bg);border:1px solid var(--line)}
.tg-result span{color:var(--muted);font-size:14px}
.tg-result b{font-size:17px}

/* code blocks: LTR, Geist Mono, horizontal scroll on phones (spec §39) */
.tg-code{background:var(--char);color:#F4EEF1;border-radius:var(--r-card);overflow:hidden;text-align:left}
.tg-code__bar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 8px 6px 14px;background:#2A2427;color:#CDBFC6;font-size:12px;font-family:var(--mono)}
.tg-code__copy{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 10px;border-radius:8px;color:#E9DDE3;font-family:"Estedad",sans-serif;font-size:12.5px}
.tg-code__copy:hover{background:rgba(255,255,255,.08)}
.tg-code pre{margin:0;padding:14px 16px;overflow-x:auto;font-size:13.5px;line-height:1.75;white-space:pre;-webkit-overflow-scrolling:touch}
.tg-code code{font-family:var(--mono)}
.tg-code [data-tg-qs]{color:#F7C948}

/* ---------- problem: the DIY stack collapses into one engine (spec §5) ---------- */
.tg-problem{align-items:start}
.tg-problem__after{margin-top:22px;font-weight:700;font-size:17px;padding:14px 16px;border-inline-start:4px solid var(--orange);background:#fff;border-radius:0 12px 12px 0}
.tg-diy{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;display:grid;gap:14px}
.tg-diy figcaption{font-size:14px;font-weight:700;color:var(--muted)}
.tg-diy__panel{border-radius:16px;padding:16px;text-align:center;position:relative}
.tg-diy__panel--before{background:var(--dash-bg);border:1px dashed var(--line-2)}
.tg-diy__panel--after{background:var(--cream);border:1px solid var(--line)}
.tg-diy__label{position:absolute;top:10px;inset-inline-start:12px;font-size:12px;font-weight:700;color:var(--muted)}
.tg-diy__fan{height:22px;margin:4px auto 6px;width:70%;border:2px solid var(--rail);border-bottom:0;border-radius:14px 14px 0 0}
.tg-diy__parts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.tg-diy__parts li{font-size:13.5px;padding:5px 10px;border-radius:9px;background:#fff;border:1px solid var(--line-2);transform:rotate(calc((var(--i) - 3.5) * .8deg));transition:transform .6s var(--ease),opacity .6s var(--ease)}
.tg-diy.in .tg-diy__parts li{animation:tgPop .45s var(--ease) both;animation-delay:calc(var(--i) * 90ms)}
.tg-flowv{display:flex;flex-direction:column;align-items:center;gap:0}
.tg-flowv__line{display:block;width:2px;height:16px;background:var(--rail)}
.tg-pills{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.tg-pills li{font-size:13px;font-weight:700;padding:4px 12px;border-radius:999px;border:1.5px solid var(--orange);color:var(--orange);background:#fff}

/* ---------- category map (spec §6) ---------- */
.tg-map{margin:0;text-align:center}
.tg-map__root{display:inline-flex;flex-direction:column;align-items:center;gap:2px;background:var(--orange);color:#fff;border-radius:20px;padding:12px 28px}
.tg-map__root b{font-size:20px}
.tg-map__root span{font-size:14px;opacity:.9}
.tg-map__rail{height:28px;width:calc(66% + 4px);margin:0 auto;border:2px solid var(--rail);border-bottom:0;border-radius:16px 16px 0 0;position:relative;top:14px}
.tg-map__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:14px}
.tg-map__col{background:var(--cream);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 16px;position:relative}
.tg-map__col::before{content:"";position:absolute;top:-8px;left:50%;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--orange);transform:translateX(-50%)}
.tg-map__col h3{font-size:19px;margin-bottom:10px;color:var(--orange)}
.tg-map__col ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.tg-map__col li{padding:6px 10px;border-radius:10px;background:#fff;border:1px solid var(--line);font-weight:600;font-size:14.5px}

/* ---------- surfaces (spec §7) ---------- */
.tg-surfaces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tg-surface{display:flex;flex-direction:column;gap:12px;transition:border-color .2s,transform .25s var(--ease)}
.tg-surface:hover{border-color:var(--orange);transform:translateY(-2px)}
.tg-surface h3{font-size:22px;color:var(--orange);text-align:start}
.tg-surface p{color:var(--muted)}
.tg-surface .tg-code pre{white-space:pre-wrap;overflow-wrap:anywhere}
.tg-surface .tg-more{margin-top:auto;align-self:flex-start}
.tg-surface__w{list-style:none;margin:0;padding:14px;display:grid;gap:8px;border-radius:var(--r-card);background:var(--dash-bg);border:1px solid var(--line)}
.tg-surface__w li{display:flex;align-items:center;gap:8px;font-size:14.5px}
.tg-surface__w .ico{color:var(--ok)}

/* ---------- widgets (spec §8): grid on desktop, swipeable on phones ---------- */
.tg-widgets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.tg-widget{background:var(--cream);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;min-width:0}
.tg-widget__head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:14px}
.tg-widget__head b{font-size:17px}
.tg-widget__cap{margin-top:12px;font-size:13px;color:var(--muted)}
.tg-widget--picker{grid-row:span 2}
taghvim-date-picker{display:block;min-height:356px}
taghvim-date-picker .iofdp{width:100%;max-width:100%}
taghvim-date-picker .iofdp__d.is-sel b{background:var(--saffron);border-color:var(--saffron);color:var(--char)}
taghvim-date-picker .iofdp__d.is-sel .iofdp__node{background:var(--pom)}
taghvim-date-picker .iofdp__d{min-height:40px}
taghvim-date-picker .iofdp__nav,taghvim-date-picker .iofdp__act{min-width:44px;min-height:44px}
.tg-picker__out{margin-top:10px;font-size:14px;min-height:24px;color:var(--black)}
.tg-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px;direction:ltr}
.tg-slots button{min-height:44px;border-radius:12px;border:1.5px solid var(--line-2);background:#fff;font-weight:700;transition:all .18s}
.tg-slots button:hover{border-color:var(--orange)}
.tg-slots button[aria-pressed="true"]{border-color:var(--orange);outline:2px dashed var(--orange);outline-offset:-5px}
.tg-slots button.is-held{background:var(--saffron);border-color:var(--saffron);color:var(--char);outline:0}
.tg-slots button.is-booked{background:var(--orange);border-color:var(--orange);color:#fff;outline:0}
.tg-life{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px;font-size:12.5px}
.tg-life li{padding:3px 8px;border-radius:8px;border:1px solid var(--line-2);color:var(--muted)}
.tg-life li.is-on{background:var(--black);border-color:var(--black);color:#fff}
.tg-form{display:grid;gap:10px}
.tg-form label{display:grid;gap:4px;font-size:14px;color:var(--muted)}
.tg-form input,.tg-form select,.tg-roi input,.tg-bd input,.tg-pg__row input{min-height:46px;border:1.5px solid var(--line-2);border-radius:12px;background:#fff;padding:8px 12px;font-size:16px;color:var(--black);width:100%;min-width:0}
.tg-form input:focus,.tg-form select:focus,.tg-roi input:focus,.tg-bd input:focus,.tg-pg__row input:focus{outline:2px solid var(--orange);outline-offset:1px;border-color:var(--orange)}
.tg-form__hint{font-size:13px;color:var(--muted);margin-top:-6px}
.tg-form [aria-invalid="true"]{border-color:var(--err)}
.tg-avail{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tg-avail li{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;gap:8px;font-size:14px}
.tg-avail__bar{display:flex;align-items:center;gap:6px;direction:ltr}
.tg-avail__bar em{font-style:normal;font-size:12.5px;color:var(--muted)}
.tg-avail__track{flex:1;height:8px;border-radius:8px;background:var(--orange)}
.tg-avail__h{width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid var(--orange);flex:none;transition:transform .18s}
.tg-avail li:hover .tg-avail__h{transform:scale(1.25)}
.tg-avail__off{color:var(--muted);font-size:13px;padding:2px 10px;border:1px dashed var(--line-2);border-radius:8px;justify-self:start}
.tg-toggle{margin:12px 0 0}

/* ---------- calendar engine + playground (spec §9) ---------- */
.tg-features{list-style:none;margin:0 auto 30px;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:980px}
.tg-features{column-gap:22px!important;row-gap:4px!important}
.tg-features li{display:inline-flex;align-items:center;gap:7px;padding:4px 2px;font-weight:600;font-size:15px}
.tg-features li::before{content:"";flex:none;width:6px;height:6px;border-radius:2px;background:var(--orange)}
.tg-convert{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1.1fr) auto minmax(0,1fr);gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:20px}
.tg-convert__col{text-align:center;padding:14px;border-radius:14px;background:var(--cream);border:1px solid var(--line)}
.tg-convert__col small{display:block;color:var(--muted);font-size:13px}
.tg-convert__col b{font-size:clamp(17px,2vw,22px)}
.tg-convert__col--core{background:var(--black);color:#fff;border-color:var(--black)}
.tg-convert__col--core small{color:#CBBFC5}
.tg-convert__col--core b{font-family:var(--mono);font-weight:500}
.tg-convert__x{font-size:22px;color:var(--orange);font-family:system-ui,sans-serif}
.tg-convert__more{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:4px 0 0}
.tg-convert__more div{padding:10px 12px;border-radius:12px;background:var(--dash-bg);border:1px solid var(--line)}
.tg-convert__more dt{font-size:12px;color:var(--muted)}
.tg-convert__more dd{margin:0;font-weight:700;font-size:14.5px}
.tg-pg{margin-top:24px;background:#fff;border:1.5px solid var(--black);border-radius:var(--r-lg);padding:20px;scroll-margin-top:90px}
.tg-pg__bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.tg-pg__bar b{font-size:16px}
.tg-pg__label{display:block;font-size:14px;color:var(--muted);margin-bottom:6px}
.tg-pg__row{display:flex;gap:8px}
.tg-pg__row input{flex:1;font-weight:600}
.tg-pg__ex{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.tg-pg__ex button{min-height:44px;padding:4px 12px;border-radius:999px;border:1px dashed var(--line-2);font-size:13.5px;color:var(--muted)}
.tg-pg__ex button:hover{border-color:var(--orange);color:var(--orange)}
.tg-pg__chips{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px;min-height:8px}
.tg-pg__chips li{font-size:13px;padding:3px 10px;border-radius:8px;background:var(--dash-bg);border:1px solid var(--line);animation:tgPop .3s var(--ease) both}
.tg-pg__chips li b{color:var(--orange);font-weight:700}
.tg-pg__chips li.warn{border-color:rgba(161,98,7,.35);color:var(--warn)}
.tg-datecard{margin-top:12px;border-radius:16px;padding:16px 18px;background:var(--cream);border:1px solid var(--line);border-inline-start:5px solid var(--saffron)}
.tg-datecard.is-err{border-inline-start-color:var(--err)}
.tg-datecard__k{font-size:13px;color:var(--muted)}
.tg-datecard__big{font-size:clamp(22px,3vw,30px);font-weight:800}
.tg-datecard__long{font-weight:600}
.tg-datecard__iso{font-family:var(--mono);font-size:12px;color:var(--muted);text-align:right;overflow-wrap:anywhere}
.tg-datecard__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.tg-datecard__grid span{font-size:13px;padding:6px 10px;border-radius:10px;background:#fff;border:1px solid var(--line)}
.tg-honest{display:flex;gap:8px;margin-top:14px;font-size:13.5px;color:var(--muted);line-height:1.9}
.tg-honest .ico{flex:none;margin-top:5px;color:var(--orange)}

/* ---------- business days timeline (spec §10) ---------- */
.tg-bd{background:var(--cream);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px}
.tg-bd__ctl{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.tg-bd__ctl label{display:flex;align-items:center;gap:8px;font-weight:700}
.tg-bd__ctl input[name="from"]{width:150px}
.tg-bd__ctl input[name="n"]{width:90px}
.tg-bd__res{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tg-bd__card{padding:14px 16px;border-radius:14px;background:#fff;border:1px solid var(--line)}
.tg-bd__card small{display:block;color:var(--muted)}
.tg-bd__card b{font-size:clamp(17px,2vw,21px)}
.tg-bd__card--on{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange)}
.tg-tl{display:flex;flex-wrap:wrap;gap:5px;margin-top:16px;direction:rtl}
.tg-tl i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;border:2px solid var(--rail);background:#fff;color:var(--muted);animation:tgPop .25s var(--ease) both}
.tg-tl i.bd{border-color:var(--black);color:var(--black)}
.tg-tl i.off{border-style:dashed;color:var(--dim)}
.tg-tl i.hol{border-color:var(--orange);background:var(--orange);color:#fff}
.tg-tl i.end{background:var(--saffron);border-color:var(--saffron);color:var(--char)}
.tg-tl__legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:12px;font-size:13px;color:var(--muted)}
.tg-tl__legend span{display:inline-flex;align-items:center;gap:6px}
.tg-tl__legend .lg{width:12px;height:12px;border-radius:50%;border:2px solid var(--black);display:inline-block}
.tg-tl__legend .lg--off{border-color:var(--rail);border-style:dashed}
.tg-tl__legend .lg--hol{background:var(--orange);border-color:var(--orange)}
.tg-tl__legend .lg--end{background:var(--saffron);border-color:var(--saffron)}
.tg-bd__more{margin-top:28px;align-items:center}

/* ---------- scheduling flow and race (spec §11) ---------- */
.tg-flow{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:0;counter-reset:f}
.tg-flow li{display:flex;align-items:center;font-weight:700;font-size:14.5px}
.tg-flow li::before{content:"";display:none}
.tg-flow li{padding:9px 16px;border-radius:999px;background:#fff;border:1.5px solid var(--line-2)}
.tg-flow li:not(:last-child){margin-inline-end:26px;position:relative}
.tg-flow li:not(:last-child)::after{content:"";position:absolute;inset-inline-end:-24px;top:50%;width:20px;height:2px;background:var(--rail)}
.tg-flow li.is-on{border-color:var(--orange);color:var(--orange)}
.tg-flow li:last-child{background:var(--black);border-color:var(--black);color:#fff}
.tg-race{margin:26px auto 0;max-width:760px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;display:grid;gap:14px;justify-items:start}
.tg-race__slot{display:flex;align-items:center;gap:10px}
.tg-race__slot span{color:var(--muted);font-size:13px}
.tg-race__slot b{font-size:20px;padding:4px 14px;border-radius:10px;border:1.5px dashed var(--orange)}
.tg-race.is-done .tg-race__slot b{background:var(--saffron);border:1.5px solid var(--saffron)}
.tg-race__users{display:grid;gap:8px;width:100%}
.tg-race__u{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--dash-bg);border:1px solid var(--line);font-size:14px}
.tg-race__st{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;opacity:0;transition:opacity .3s}
.tg-race.is-done .tg-race__st,.tg-race:not(.is-js) .tg-race__st{opacity:1}
.tg-race__st em{font-style:normal;font-weight:700}
.tg-race__st em.ok{color:var(--ok)}
.tg-race__st em.no{color:var(--err)}
.tg-race__st i{font-style:normal;padding:1px 8px;border-radius:7px;border:1px solid var(--line-2);background:#fff}
.tg-race figcaption{font-weight:700}

/* ---------- deadline formula (spec §12) ---------- */
.tg-formula{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tg-formula li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-radius:14px;background:#fff;border:1px solid var(--line);font-size:14.5px}
.tg-formula li.plus b::before{content:"+ ";font-weight:800;color:var(--orange)}
.tg-formula li span{font-family:"Estedad",sans-serif;color:var(--muted)}
.tg-formula__out{background:var(--black)!important;border-color:var(--black)!important;color:#fff}
.tg-formula__out span{color:var(--saffron)!important;font-size:18px;font-weight:800}

/* ---------- agents: dark plum (spec §13, §38) ---------- */
.tg-plum{--bg:var(--dplum);--surface:var(--plum);--line:rgba(255,255,255,.12);--line-2:rgba(255,255,255,.24);--muted:#D8CBD5;--dim:#B9A6B4;background:var(--dplum)}
.tg-plum .sec-head p{color:#E3D6DF}
.tg-plum .eyebrow{color:#fff;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.3)}
.tg-plum .eyebrow .dot{border-color:var(--saffron)}
.tg-agent{display:grid;gap:14px}
.tg-agent__card{background:var(--plum);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-lg);padding:8px 18px}
.tg-dl--dark dt{color:#D8CBD5}
.tg-dl--dark div{border-color:rgba(255,255,255,.1)}
.tg-dl--dark [data-tg-agent-next]{color:var(--saffron)}
.tg-run{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tg-run{counter-reset:run}
.tg-run li{counter-increment:run}
.tg-run li::before{content:counter(run, persian) ". ";opacity:.7}
.tg-run li{padding:10px 8px;border-radius:12px;border:1px solid rgba(255,255,255,.2);text-align:center;font-size:13px;font-weight:700;color:#E3D6DF;transition:all .3s}
.tg-run li.is-on{background:#fff;color:var(--dplum);border-color:#fff}
.tg-run li.is-now{background:var(--saffron);border-color:var(--saffron);color:var(--char)}
.tg-plum .tg-note{color:#D8CBD5}

/* ---------- events route (spec §14) ---------- */
.tg-route{margin:0;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:20px;align-items:center;background:var(--cream);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px}
.tg-route ol,.tg-route ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tg-route__stream code{display:block;padding:8px 12px;border-radius:10px;background:var(--char);color:#F4EEF1;font-size:13px}
.tg-route__stream li.is-on code{background:var(--orange)}
.tg-route__hub{position:relative;width:110px;height:110px;border-radius:50%;display:grid;place-items:center;background:var(--orange);color:#fff;font-weight:800}
.tg-route__dot{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--saffron);top:-24px;right:-30px;opacity:0}
.tg-route.is-run .tg-route__dot{animation:tgRoute 1.4s var(--ease) 1}
.tg-route__targets li{padding:9px 12px;border-radius:12px;background:#fff;border:1px solid var(--line-2);font-weight:700;font-size:14px;transition:border-color .3s}
.tg-route__targets li.is-on{border-color:var(--orange);color:var(--orange)}

/* ---------- evidence and search panels (spec §15, §30) ---------- */
.tg-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tg-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:18px}
.section--paper .tg-panel{background:var(--cream)}
.tg-panel__bar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.tg-panel__k{font-size:12.5px;color:var(--muted);margin-top:12px}
.tg-search{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;border:1.5px solid var(--black);background:#fff;font-weight:600}
.tg-search .ico{color:var(--orange);flex:none}
.tg-searchmock{max-width:860px;margin:0 auto;display:grid;gap:14px}
.tg-searchmock .tg-chips li{opacity:0;animation:tgPop .35s var(--ease) both;animation-play-state:paused;animation-delay:calc(var(--i) * 140ms + .2s)}
.tg-searchmock.in .tg-chips li{animation-play-state:running}
.tg-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.tg-dc{display:grid;gap:2px;padding:12px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.tg-dc code{font-size:12.5px;color:var(--muted)}
.tg-dc__st{color:var(--err);font-weight:700;font-size:13px}
.tg-dc small{color:var(--muted)}

/* ---------- connectors hub (spec §16) ---------- */
.tg-hub{margin:0;display:flex;flex-direction:column;align-items:center;background:var(--cream);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px}
.tg-hub__fork{display:grid;grid-template-columns:repeat(3,1fr);width:80%;height:26px;border:2px solid var(--rail);border-bottom:0;border-radius:14px 14px 0 0;margin-top:14px}
.tg-hub__fork i:nth-child(2){border-inline-start:2px solid var(--rail);margin-top:-14px}
.tg-hub__nodes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%}
.tg-hub__join{width:80%;height:22px;border:2px solid var(--rail);border-top:0;border-radius:0 0 14px 14px;margin-bottom:12px}
.tg-ics{display:flex;gap:12px;align-items:flex-start;margin-top:18px;padding:14px 16px;border-radius:14px;border:1.5px solid var(--orange);background:#fff}
.tg-ics .ico{color:var(--orange);margin-top:4px}
.tg-ics b{display:block;color:var(--orange)}
.tg-ics small{color:var(--muted);font-size:13px}

/* ---------- build once (spec §17) ---------- */
.tg-once{margin:0 auto;max-width:900px;display:flex;flex-direction:column;align-items:center;gap:0}
.tg-once__core{font-size:17px;padding:12px 26px}
.tg-once__list{list-style:none;margin:0;padding:22px 0 0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;width:100%;position:relative}
.tg-once__list::before{content:"";position:absolute;top:10px;left:7%;right:7%;height:2px;background:var(--rail)}
.tg-once__list li{display:flex;flex-direction:column;align-items:center;position:relative}
.tg-once__list li::before{content:"";width:2px;height:12px;background:var(--rail);margin-top:-12px}
.tg-once__list .tg-node{width:100%;font-size:13px;padding:6px 8px}

/* ---------- quickstart (spec §18) ---------- */
.tg-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tg-step{display:flex;flex-direction:column;gap:12px;min-width:0}
.tg-step h3{display:flex;align-items:center;gap:10px;font-size:18px}
.tg-step__n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--black);color:#fff;font-size:15px;flex:none}
.tg-step .tg-code{flex:1}
.tg-resp{max-width:620px;margin:18px auto 0}

/* ---------- temporal sandbox (spec §19) ---------- */
.tg-sbx{max-width:860px;margin:0 auto;background:var(--cream);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;display:grid;gap:14px}
.tg-sbx__clock{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px}
.tg-sbx__clock small{color:var(--muted)}
.tg-sbx__clock b{font-size:clamp(22px,3vw,30px)}
.tg-sbx__day{font-size:13px;color:var(--muted)}
.tg-sbx__btns{display:flex;flex-wrap:wrap;gap:8px}
.tg-sbx__btns .btn{min-height:44px;font-weight:700}
.tg-sbx__reset{color:var(--muted);font-family:"Estedad",sans-serif!important}
.tg-sbx__log{list-style:none;margin:0;padding:12px;border-radius:12px;background:#fff;border:1px solid var(--line);display:grid;gap:6px;min-height:64px}
.tg-sbx__log li{display:flex;gap:8px;align-items:baseline;font-size:14.5px;animation:tgFade .3s var(--ease)}
.tg-sbx__log li b{color:var(--ok)}
.tg-sbx__log li.over b{color:var(--err)}

/* ---------- tabs (use cases, interfaces) ---------- */
.tg-tabs{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:10px}
.section--paper .tg-tabs{background:var(--cream)}
.tg-tabs__list{display:flex;flex-wrap:wrap;gap:4px;padding:4px}
.tg-tabs__list button{min-height:44px;padding:6px 14px;border-radius:var(--r-btn);font-weight:700;font-size:14.5px;color:var(--muted);transition:background .18s,color .18s}
.tg-tabs__list button:hover{color:var(--text);background:var(--wash)}
.tg-tabs__list button[aria-selected="true"]{background:var(--black);color:#fff}
.tg-tabs__panel{padding:20px 14px 14px;animation:tgFade .3s var(--ease)}
.tg-tabs__lead{font-size:18px;font-weight:600;margin-bottom:16px;line-height:1.9}
.tg-uc{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.tg-uc li{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;background:#fff;border:1px solid var(--line);font-weight:700;animation:tgPop .35s var(--ease) both;animation-delay:calc(var(--i) * 70ms)}
.tg-uc__n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--orange);color:var(--orange);font-size:12px;flex:none}
.tg-tabs--code .tg-tabs__panel{padding:12px 4px 4px}

/* ---------- enterprise (spec §21) ---------- */
.tg-grid2{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tg-grid2 li{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid var(--line);font-weight:600;font-size:14px;line-height:1.6}
.tg-grid2 .ico{color:var(--ok);flex:none;margin-top:2px}
.tg-tree{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:22px}
.tg-tree ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tg-tree li{position:relative}
.tg-tree li.d1{padding-inline-start:34px}
.tg-tree li.d2{padding-inline-start:68px}
.tg-tree li.d1::before,.tg-tree li.d2::before{content:"";position:absolute;top:-10px;height:30px;width:18px;border-inline-start:2px solid var(--rail);border-bottom:2px solid var(--rail);border-end-start-radius:10px}
.tg-tree li.d1::before{inset-inline-start:12px}
.tg-tree li.d2::before{inset-inline-start:46px}
.tg-tree figcaption{margin-top:16px;font-weight:700}

/* ---------- benefits (spec §22) ---------- */
.tg-benefits{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.tg-benefit{grid-column:span 2;display:flex;flex-direction:column;gap:10px}
.tg-benefit:nth-child(1),.tg-benefit:nth-child(2){grid-column:span 3}
.tg-benefit__n{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--orange);color:#fff;font-weight:800}
.tg-benefit__k{font-size:13px;color:var(--muted);text-align:right}
.tg-benefit h3{font-size:19px;line-height:1.7}
.tg-benefit__t,.tg-benefit__f{font-size:14px;color:var(--muted);text-align:right}
.tg-benefit .tg-chips{justify-content:flex-end}

/* ---------- ROI calculator (spec §23) ---------- */
.tg-roi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:18px;align-items:start}
.tg-roi__in legend{float:right;width:100%;padding:0;margin-bottom:4px}
.tg-roi__in{border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;background:#fff;margin:0;display:grid;gap:12px;min-width:0}
.tg-roi__f{display:grid;gap:4px;font-size:14.5px;font-weight:600}
.tg-roi__f input{font-size:16px;font-weight:600}
.tg-roi__us{padding-top:12px;border-top:1px dashed var(--line-2);display:grid;gap:6px}
.tg-roi__us small{font-size:13px;color:var(--muted)}
.tg-roi__out{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tg-roi__o{padding:14px 16px;border-radius:14px;background:#fff;border:1px solid var(--line);display:grid;gap:2px;min-width:0}
.tg-roi__o small{color:var(--muted);font-size:13.5px}
.tg-roi__o b{font-size:clamp(18px,2.2vw,24px);color:var(--black);overflow-wrap:anywhere}
.tg-roi__fx{font-size:12px;color:var(--dim)}
.tg-roi__o--sm b{font-size:18px}
.tg-bars{grid-column:1/-1;display:grid;gap:14px;padding:16px;border-radius:14px;background:var(--black);color:#fff}
.tg-bar p{display:flex;justify-content:space-between;gap:10px;font-size:14px}
.tg-bar p span{font-family:"Estedad",sans-serif;direction:rtl;color:#E9DDE3}
.tg-bar__track{height:16px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden;margin:6px 0 4px}
.tg-bar__track i{display:block;height:100%;width:var(--w,0%);border-radius:999px;background:#fff;transition:width .6s var(--ease)}
.tg-bar--us .tg-bar__track i{background:var(--saffron)}
.tg-bar small{color:#CBBFC5;font-size:12.5px}

/* ---------- what you stop building (spec §24) ---------- */
.tg-stop{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:stretch}
.tg-stop__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tg-stop__list li{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:var(--cream);border:1px solid var(--line);font-weight:600;font-size:14px}
.tg-stop__list li .ico{color:var(--rail);transition:color .3s;transition-delay:calc(var(--i) * 120ms)}
.tg-stop__list li span{transition:color .3s,text-decoration-color .3s;transition-delay:calc(var(--i) * 120ms);text-decoration:line-through;text-decoration-color:transparent}
.tg-stop.in .tg-stop__list li .ico{color:var(--ok)}
.tg-stop.in .tg-stop__list li span{color:var(--muted);text-decoration-color:var(--muted)}
.tg-stop__ship{display:flex;flex-direction:column;justify-content:flex-end;padding:22px;border-radius:var(--r-lg);background:var(--black);color:#fff;position:relative;overflow:hidden;min-height:220px}
.tg-stop__ship b{font-size:26px;position:relative;z-index:1}
.tg-stop__grow{position:absolute;inset:auto 0 0 0;height:0;background:var(--orange);transition:height 1.6s var(--ease) .3s}
.tg-stop.in .tg-stop__grow{height:100%}

/* ---------- trust ring (spec §25) ---------- */
.tg-trust{align-items:center}
.tg-ring{margin:0;max-width:420px;width:100%;justify-self:center}
.tg-ring svg{width:100%;height:auto;overflow:visible}
.tg-ring polygon{fill:none;stroke:var(--rail);stroke-width:2}
.tg-ring circle{fill:#fff;stroke:var(--orange);stroke-width:3}
.tg-ring text{font-family:"Estedad",sans-serif;font-size:14px;font-weight:700;fill:var(--black);text-anchor:middle}
.tg-ring text.c{font-size:30px;font-weight:900;fill:var(--orange);letter-spacing:.08em}
.tg-trust__list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0}
.tg-trust__list div{padding:14px;border-radius:14px;background:#fff;border:1px solid var(--line)}
.tg-trust__list dt{font-weight:800;color:var(--orange);text-align:start}
.tg-trust__list dd{margin:4px 0 0;color:var(--muted);font-size:14.5px}

/* ---------- comparison (spec §26) ---------- */
.tg-table{overflow-x:auto;border-radius:var(--r-card);border:1px solid var(--line);background:var(--cream);-webkit-overflow-scrolling:touch}
.tg-table:focus-visible{outline:2px solid var(--orange)}
.tg-table table{width:100%;border-collapse:collapse;min-width:640px}
.tg-table th,.tg-table td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:center;font-size:14.5px}
.tg-table thead th{font-weight:800;background:#fff}
.tg-table tbody th{text-align:right;font-weight:700;position:sticky;inset-inline-start:0;background:var(--cream)}
.tg-table td.us,.tg-table th.us{background:rgba(159,18,57,.06);font-weight:700}
.tg-table thead th.us{background:var(--orange);color:#fff}
.tg-table .ico--ok{margin:0 auto;color:var(--ok)}
.tg-none{color:var(--dim)}
.tg-table tr:last-child th,.tg-table tr:last-child td{border-bottom:0}

/* ---------- pricing (spec §27) ---------- */
.tg-plans{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;align-items:stretch}
.tg-plan{display:flex;flex-direction:column;gap:10px;padding:20px 16px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line)}
.tg-plan--on{border:2px solid var(--orange)}
.tg-plan h3{font-size:20px;text-align:start}
.tg-plan__sub{font-size:13px;color:var(--muted);text-align:start}
.tg-plan__price{font-size:20px;font-weight:800;color:var(--orange)}
.tg-plan:not(.tg-plan--on) .tg-plan__price{font-size:14px;color:var(--muted);font-weight:700}
.tg-plan ul{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:6px;flex:1;align-content:start}
.tg-plan li{display:flex;align-items:center;gap:6px;font-size:13.5px}
.tg-plan li .ico{color:var(--ok);flex:none}
.tg-plan .btn{white-space:normal;text-align:center;min-height:46px;font-size:14px;padding:8px 10px}

/* ---------- dashboard mock (spec §29) ---------- */
.tg-dash{color:var(--black)}
div.tg-dash{border:1px solid var(--line-2);border-radius:var(--r-lg);overflow:hidden;background:#fff;box-shadow:0 30px 60px -40px rgba(30,27,29,.45)}
.tg-dash__top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 16px;background:var(--black);color:#fff}
.tg-dash__env{font-size:12px;padding:1px 8px;border-radius:6px;background:var(--saffron);color:var(--char);font-weight:700}
.tg-dash__top code{font-size:12.5px;color:#CBBFC5}
.tg-dash__top .tg-tag{margin-inline-start:auto;color:#E3D6DF;border-color:rgba(255,255,255,.3)}
.tg-dash__body{display:grid;grid-template-columns:190px minmax(0,1fr)}
.tg-dash__nav{display:grid;align-content:start;gap:2px;padding:12px;background:var(--dash-bg);border-inline-end:1px solid var(--line)}
.tg-dash__nav span{padding:7px 10px;border-radius:8px;font-size:13.5px;color:var(--muted)}
.tg-dash__nav span.on{background:#fff;color:var(--black);font-weight:700;box-shadow:inset -3px 0 0 var(--orange)}
.tg-dash__main{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px}
.tg-dash__card{padding:14px;border-radius:14px;border:1px solid var(--line);background:#fff}
.tg-dash__card:first-child{grid-column:1/-1}
.tg-dash__card small{color:var(--muted);font-size:12.5px}
.tg-meter{height:12px;border-radius:999px;background:var(--sink);overflow:hidden;margin-top:8px}
.tg-meter i{display:block;height:100%;width:0;background:var(--orange);border-radius:999px;transition:width 1.4s var(--ease)}
.tg-dash.in .tg-meter i{width:var(--p)}
.tg-dash__ev{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.tg-dash__ev li{font-size:13px;animation:tgFade .4s var(--ease) both}
.tg-dash__ev code{padding:2px 8px;border-radius:6px;background:var(--dash-bg)}
.tg-health{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.tg-health span{font-size:13px;padding:3px 10px;border-radius:999px;border:1px solid var(--line-2)}
.tg-health i{font-style:normal;color:var(--ok);font-weight:800}

/* ---------- marketplace (spec §31) ---------- */
.tg-mk{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tg-packs{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tg-packs li{display:flex;align-items:center;gap:8px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid var(--line);font-weight:700}
.tg-packs li.on{border-inline-start:3px solid var(--orange)}
.tg-packs li .ico{color:var(--ok)}
.tg-packs--future li{border-style:dashed;color:var(--muted);background:transparent}

/* ---------- example stories (spec §32) ---------- */
.tg-stories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tg-story{display:flex;flex-direction:column;gap:10px}
.tg-story .tg-tag{align-self:flex-start}
.tg-story h3{font-size:19px}
.tg-story p{font-size:15px;color:var(--muted)}
.tg-story p b{color:var(--black)}

/* ---------- final call to action: dark plum, one saffron moment (spec §34) ---------- */
.tg-final{position:relative;padding:112px 0;text-align:center;background:var(--dplum);color:#fff;overflow:hidden}
.tg-final__in{position:relative;max-width:860px}
.tg-final h2{font-size:clamp(28px,4.4vw,50px);margin-bottom:18px;line-height:1.45}
.tg-final p{color:#E3D6DF;font-size:17px}
.tg-final .micro{margin-top:18px;font-size:14px;color:#D8CBD5}
.tg-final .btn--ghost{color:#fff;border-color:rgba(255,255,255,.7)}
.tg-final .btn--ghost:hover{background:rgba(255,255,255,.08)}
.tg-final__bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px}
.tg-final__line{position:absolute;left:6%;right:6%;bottom:56px;height:2px;background:rgba(255,255,255,.18)}
.tg-final__dot{position:absolute;bottom:50px;right:6%;width:14px;height:14px;border-radius:50%;background:var(--saffron);transition:right 2.4s var(--ease)}
.tg-final.in .tg-final__dot{right:62%}
.tg-final :focus-visible{outline-color:var(--saffron)}

/* ---------- footer: four columns, the statement ---------- */
.footer__cols{grid-template-columns:repeat(4,minmax(0,1fr))}
.footer__cols a,.footer__cols .link{min-height:32px;display:inline-flex;align-items:center;color:#D9D2D5;text-decoration:none}
.footer__cols a:hover,.footer__cols .link:hover{color:#fff}
.footer__legal{display:grid;gap:4px}
.tg-foot__statement{font-size:16px;color:#fff}

/* ---------- sticky phone CTA (spec §39), after the hero; the kit pads the footer so it never covers the end ---------- */
.tg-sticky{position:fixed;inset-inline:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:45;display:none;visibility:hidden}
.tg-sticky .btn{width:100%;box-shadow:0 12px 30px -10px rgba(50,17,47,.55)}
@media (max-width:760px){.tg-sticky{display:block;transform:translateY(160%);transition:transform .3s var(--ease),visibility 0s linear .3s}.tg-sticky.is-on{transform:none;visibility:visible;transition:transform .3s var(--ease)}}

/* ---------- 404 ---------- */
.tg-404{min-height:100vh;display:grid;place-items:center;background:var(--cream)}
.tg-404__in{text-align:center;display:grid;justify-items:center;gap:14px;padding:40px 0}
.tg-404__code{font-size:72px;font-weight:900;color:var(--pom);line-height:1}

/* ---------- motion ---------- */
@keyframes tgFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes tgPop{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@keyframes tgPulse{0%{box-shadow:0 0 0 0 rgba(212,160,23,.6)}100%{box-shadow:0 0 0 10px rgba(212,160,23,0)}}
@keyframes tgRoute{0%{opacity:1;right:-30px}50%{opacity:1;right:48px}100%{opacity:0;right:140px}}

/* ---------- tablets ---------- */
@media (max-width:1100px){
  .tg-plans{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tg-widgets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tg-convert__more{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tg-once__list{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:14px}
  .tg-once__list::before{display:none}
  .tg-once__list li::before{display:none}
}
@media (max-width:900px){
  .tg-surfaces,.tg-steps,.tg-stories{grid-template-columns:minmax(0,1fr)}
  .tg-roi,.tg-stop,.tg-two,.tg-mk{grid-template-columns:minmax(0,1fr)}
  .tg-benefits{grid-template-columns:minmax(0,1fr)}
  .tg-benefit,.tg-benefit:nth-child(1),.tg-benefit:nth-child(2){grid-column:auto}
  .tg-uc{grid-template-columns:1fr 1fr}
}

/* ---------- phones: designed on their own (spec §39) ---------- */
@media (max-width:640px){
  .section{padding:64px 0}
  .sec-head{margin-bottom:30px;text-align:start}
  .sec-head h2{font-size:25px}
  .sec-head p{font-size:16px}
  .tg-hero .hero__title{font-size:33px}
  .tg-hero .eyebrow{font-size:10px;letter-spacing:.04em;padding:4px 10px}
  .hero__visual{margin-top:8px}
  .tg-con__state{min-height:0;padding:12px 14px 2px}
  .tg-con__tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px}
  .tg-con__tabs button{min-height:40px}
  .footer__cols a,.footer__cols .link{min-height:44px}
  .tg-con__slots{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tg-con__ok{font-size:16px}
  .tg-proof__list{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;padding:2px 2px 6px;margin-inline:-16px;padding-inline:16px;scroll-snap-type:x proximity}
  .tg-proof__list::-webkit-scrollbar{display:none}
  .tg-proof__list li{scroll-snap-align:start}
  .tg-proof__list a{min-height:44px}
  .tg-proof__note{text-align:start;font-size:14px}
  .tg-checks--x{grid-template-columns:minmax(0,1fr)}
  .tg-map__rail{display:none}
  .tg-map__cols{grid-template-columns:minmax(0,1fr);gap:22px;margin-top:22px}
  .tg-map__col ul{grid-template-columns:1fr 1fr}
  /* widgets: a swipeable row, one card per screen */
  .tg-widgets{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:-16px;padding:2px 16px 14px;scrollbar-width:thin}
  .tg-widget{flex:0 0 86%;scroll-snap-align:center}
  .tg-widget--picker{grid-row:auto}
  .tg-convert{grid-template-columns:minmax(0,1fr);gap:8px;padding:14px}
  .tg-convert__x{transform:rotate(90deg);justify-self:center;line-height:1}
  .tg-convert__more{grid-template-columns:1fr 1fr}
  .tg-pg{padding:16px}
  .tg-pg__row{flex-direction:column}
  .tg-pg__row .btn{width:100%}
  .tg-datecard__grid{grid-template-columns:minmax(0,1fr)}
  .tg-bd{padding:14px}
  .tg-bd__res{grid-template-columns:minmax(0,1fr)}
  .tg-tl i{width:26px;height:26px;font-size:11px}
  /* diagrams collapse into vertical flows */
  .tg-flow{flex-direction:column;align-items:center}
  .tg-flow li:not(:last-child){margin-inline-end:0;margin-bottom:18px}
  .tg-flow li:not(:last-child)::after{inset-inline-end:auto;left:50%;top:auto;bottom:-16px;width:2px;height:14px}
  .tg-run{grid-template-columns:1fr 1fr}
  .tg-route{grid-template-columns:minmax(0,1fr);justify-items:stretch;padding:16px}
  .tg-route__hub{justify-self:center;width:90px;height:90px}
  .tg-route__dot{display:none}
  .tg-route__targets{grid-template-columns:1fr 1fr}
  .tg-cards{grid-template-columns:minmax(0,1fr)}
  .tg-hub__nodes .tg-node{font-size:12.5px;padding:6px 8px}
  .tg-once__list{grid-template-columns:1fr 1fr}
  .tg-uc{grid-template-columns:minmax(0,1fr)}
  /* use-case tabs become horizontal chips */
  .tg-tabs{padding:6px}
  .tg-tabs__list{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .tg-tabs__list::-webkit-scrollbar{display:none}
  .tg-tabs__list button{flex:none;border:1px solid var(--line-2);border-radius:999px}
  .tg-tabs__list button[aria-selected="true"]{border-color:var(--black)}
  .tg-tabs__lead{font-size:16px}
  .tg-grid2{grid-template-columns:minmax(0,1fr)}
  .tg-tree li.d1{padding-inline-start:26px}
  .tg-tree li.d2{padding-inline-start:52px}
  .tg-tree li.d1::before{inset-inline-start:8px}
  .tg-tree li.d2::before{inset-inline-start:34px}
  .tg-roi__out{grid-template-columns:minmax(0,1fr)}
  .tg-stop__list{grid-template-columns:minmax(0,1fr)}
  .tg-stop__ship{min-height:120px}
  .tg-trust__list{grid-template-columns:minmax(0,1fr)}
  .tg-ring{max-width:320px}
  .tg-plans{grid-template-columns:minmax(0,1fr)}
  .tg-dash__body{grid-template-columns:minmax(0,1fr)}
  /* the mock sidebar would read as a row of tabs on a phone: it is left out there */
  .tg-dash__nav{display:none}
  .tg-dash__main{grid-template-columns:minmax(0,1fr);padding:12px}
  .tg-final{padding:76px 0 96px}
  .tg-final .actions .btn{flex:1 1 100%}
  .footer__cols{grid-template-columns:1fr 1fr}
  .tg-statement{font-size:17px;text-align:start}
  .tg-steps .tg-code pre{font-size:12.5px}
}
@media (prefers-reduced-motion:reduce){
  .tg-diy__parts li{transform:none}
  .tg-final__dot{transition:none;right:62%}
  .tg-stop__grow{transition:none}
  .tg-searchmock .tg-chips li{opacity:1;animation:none}
  .tg-meter i{transition:none}
}