/* Al Awan Herbs: "Certificate Paper" theme. Light only. */
@font-face{font-family:"Newsreader";src:url(fonts/newsreader-var.woff2) format("woff2");font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url(fonts/newsreader-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(fonts/plex-sans-var.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(fonts/plex-mono-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(fonts/plex-arabic-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(fonts/plex-arabic-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(fonts/plex-arabic-600.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Naskh Arabic";src:url(fonts/naskh-arabic.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}

:root{
  color-scheme:light;
  --paper:#F7F4EC; --panel:#EDE8DA; --sheet:#FBF9F3; --ink:#1D1B16; --body:#36332B; --muted:#5A564B;
  --tur:#7C4A00; --red:#A63A22; --line:#D6CFBD; --line-subtle:rgba(214,207,189,.55); --kraft:#D8C39C; --navy:#16213A;
  --moss:#3C5537; --moss-deep:#263A24; --moss-rich:#1c2d1b; --leafline:#9AA47D; --leaf:#7E8A52;
  --gold:#B89A5A; --gold-soft:#E4D5B7;
  --wa:#25D366; --wa-dark:#128C7E; --wa-deep:#075E54;
  --shadow-xs:0 1px 3px rgba(29,27,22,.04);
  --shadow-sm:0 3px 8px -2px rgba(29,27,22,.06),0 1px 3px rgba(29,27,22,.04);
  --shadow-md:0 10px 25px -6px rgba(29,27,22,.09),0 3px 8px -2px rgba(29,27,22,.04);
  --shadow-lg:0 20px 42px -12px rgba(29,27,22,.14),0 6px 14px -3px rgba(29,27,22,.06);
  --serif:"Newsreader","Noto Serif",Georgia,"Times New Roman",serif;
  --sans:"IBM Plex Sans","Noto Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono","DejaVu Sans Mono",ui-monospace,Menlo,Consolas,monospace;
  --arabic:"Noto Naskh Arabic","Noto Sans Arabic","IBM Plex Sans Arabic","Geeza Pro","Segoe UI",Tahoma,sans-serif;
}
html[lang="ar"]{
  --serif:"Newsreader","Noto Naskh Arabic","Noto Sans Arabic",serif;
  --sans:"IBM Plex Sans","IBM Plex Sans Arabic","Noto Sans Arabic","Segoe UI",Tahoma,sans-serif;
  --mono:"IBM Plex Mono","IBM Plex Sans Arabic","Noto Sans Arabic",monospace;
}
html[lang="zh"]{
  --serif:"Newsreader","Noto Serif SC","Songti SC",SimSun,"Microsoft YaHei",serif;
  --sans:"IBM Plex Sans","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --mono:"IBM Plex Mono","Noto Sans SC","PingFang SC","Microsoft YaHei",monospace;
}
html[lang="ja"]{
  --serif:"Newsreader","Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"IBM Plex Sans","Noto Sans JP","Hiragino Sans","Meiryo",sans-serif;
  --mono:"IBM Plex Mono","Noto Sans JP",monospace;
}
html[lang="ko"]{
  --serif:"Newsreader","Noto Serif KR","Batang","Malgun Gothic",serif;
  --sans:"IBM Plex Sans","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --mono:"IBM Plex Mono","Noto Sans KR",monospace;
}
html[lang="th"]{
  --serif:"Newsreader","Noto Serif Thai","Thonburi","Cordia New",serif;
  --sans:"IBM Plex Sans","Noto Sans Thai","Thonburi","Leelawadee UI",sans-serif;
  --mono:"IBM Plex Mono","Noto Sans Thai",monospace;
}
html[lang="fa"]{
  --serif:"Newsreader","Noto Naskh Arabic","Vazirmatn","Sahel",serif;
  --sans:"IBM Plex Sans","IBM Plex Sans Arabic","Vazirmatn","Tahoma",sans-serif;
  --mono:"IBM Plex Mono","Vazirmatn",monospace;
}
html[lang="ar"] body{line-height:1.78}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{line-height:1.35}
html[lang="ar"] *{letter-spacing:normal}
html[lang="ar"] .nameplate{letter-spacing:.28em}
html[lang="zh"] body{line-height:1.8}
html[lang="zh"] h1,html[lang="zh"] h2,html[lang="zh"] h3{line-height:1.42}
html[lang="zh"] *{letter-spacing:normal}
html[lang="zh"] .nameplate{letter-spacing:.28em}
html[lang="ja"] body{line-height:1.8}
html[lang="ja"] h1,html[lang="ja"] h2,html[lang="ja"] h3{line-height:1.42}
html[lang="ja"] *{letter-spacing:normal}
html[lang="ja"] .nameplate{letter-spacing:.25em}
html[lang="ko"] body{line-height:1.75}
html[lang="ko"] h1,html[lang="ko"] h2,html[lang="ko"] h3{line-height:1.4}
html[lang="ko"] *{letter-spacing:normal}
html[lang="ko"] .nameplate{letter-spacing:.25em}
html[lang="th"] body{line-height:1.8}
html[lang="th"] h1,html[lang="th"] h2,html[lang="th"] h3{line-height:1.45}
html[lang="th"] *{letter-spacing:normal}
html[lang="fa"] body{line-height:1.8}
html[lang="fa"] h1,html[lang="fa"] h2,html[lang="fa"] h3{line-height:1.4}
html[lang="fa"] *{letter-spacing:normal}
html[lang="fa"] .nameplate{letter-spacing:.25em}
html[lang="de"] .plate-name b,html[lang="de"] .slip-sub,html[lang="es"] .plate-name b,html[lang="es"] .slip-sub,html[lang="fr"] .plate-name b,html[lang="fr"] .slip-sub,html[lang="ru"] .plate-name b,html[lang="ru"] .slip-sub,html[lang="it"] .plate-name b,html[lang="it"] .slip-sub,html[lang="tr"] .plate-name b,html[lang="tr"] .slip-sub,html[lang="pt"] .plate-name b,html[lang="pt"] .slip-sub,html[lang="nl"] .plate-name b,html[lang="nl"] .slip-sub,html[lang="pl"] .plate-name b,html[lang="pl"] .slip-sub{hyphens:auto}
html[lang="ar"] .note::before{content:"ملاحظة"}
html[lang="ar"] .ask h2::before{content:"مكتب التجارة"}
html[lang="ar"] .photo figcaption::before{content:"لوحة " attr(data-sheet)}
html[lang="ar"] .faq .qa::before{content:"س" counter(q)}
html[lang="de"] .note::before{content:"Hinweis"}
html[lang="de"] .ask h2::before{content:"Handelsabteilung"}
html[lang="de"] .photo figcaption::before{content:"Tafel " attr(data-sheet)}
html[lang="de"] .faq .qa::before{content:"F" counter(q)}
html[lang="es"] .note::before{content:"Nota"}
html[lang="es"] .ask h2::before{content:"Mesa comercial"}
html[lang="es"] .photo figcaption::before{content:"Lámina " attr(data-sheet)}
html[lang="es"] .faq .qa::before{content:"P" counter(q)}
html[lang="fr"] .note::before{content:"Note"}
html[lang="fr"] .ask h2::before{content:"Bureau commercial"}
html[lang="fr"] .photo figcaption::before{content:"Planche " attr(data-sheet)}
html[lang="fr"] .faq .qa::before{content:"Q" counter(q)}
html[lang="zh"] .note::before{content:"注"}
html[lang="zh"] .ask h2::before{content:"贸易部"}
html[lang="zh"] .photo figcaption::before{content:"图版 " attr(data-sheet)}
html[lang="zh"] .faq .qa::before{content:"问" counter(q)}
html[lang="ru"] .note::before{content:"Примечание"}
html[lang="ru"] .ask h2::before{content:"Торговый отдел"}
html[lang="ru"] .photo figcaption::before{content:"Планшет " attr(data-sheet)}
html[lang="ru"] .faq .qa::before{content:"В" counter(q)}
html[lang="it"] .note::before{content:"Nota"}
html[lang="it"] .ask h2::before{content:"Ufficio commerciale"}
html[lang="it"] .photo figcaption::before{content:"Tavola " attr(data-sheet)}
html[lang="it"] .faq .qa::before{content:"D" counter(q)}
html[lang="tr"] .note::before{content:"Not"}
html[lang="tr"] .ask h2::before{content:"Ticaret Masası"}
html[lang="tr"] .photo figcaption::before{content:"Levha " attr(data-sheet)}
html[lang="tr"] .faq .qa::before{content:"S" counter(q)}
html[lang="ja"] .note::before{content:"注記"}
html[lang="ja"] .ask h2::before{content:"貿易窓口"}
html[lang="ja"] .photo figcaption::before{content:"図版 " attr(data-sheet)}
html[lang="ja"] .faq .qa::before{content:"問" counter(q)}
html[lang="ko"] .note::before{content:"참고"}
html[lang="ko"] .ask h2::before{content:"무역 데스크"}
html[lang="ko"] .photo figcaption::before{content:"표본 " attr(data-sheet)}
html[lang="ko"] .faq .qa::before{content:"문" counter(q)}
html[lang="pt"] .note::before{content:"Nota"}
html[lang="pt"] .ask h2::before{content:"Mesa comercial"}
html[lang="pt"] .photo figcaption::before{content:"Prancha " attr(data-sheet)}
html[lang="pt"] .faq .qa::before{content:"P" counter(q)}
html[lang="nl"] .note::before{content:"Opmerking"}
html[lang="nl"] .ask h2::before{content:"Handelsdesk"}
html[lang="nl"] .photo figcaption::before{content:"Plaat " attr(data-sheet)}
html[lang="nl"] .faq .qa::before{content:"V" counter(q)}
html[lang="pl"] .note::before{content:"Uwaga"}
html[lang="pl"] .ask h2::before{content:"Dział handlowy"}
html[lang="pl"] .photo figcaption::before{content:"Tablica " attr(data-sheet)}
html[lang="pl"] .faq .qa::before{content:"P" counter(q)}
html[lang="id"] .note::before{content:"Catatan"}
html[lang="id"] .ask h2::before{content:"Meja dagang"}
html[lang="id"] .photo figcaption::before{content:"Pelat " attr(data-sheet)}
html[lang="id"] .faq .qa::before{content:"T" counter(q)}
html[lang="vi"] .note::before{content:"Ghi chú"}
html[lang="vi"] .ask h2::before{content:"Bộ phận thương mại"}
html[lang="vi"] .photo figcaption::before{content:"Tiêu bản " attr(data-sheet)}
html[lang="vi"] .faq .qa::before{content:"H" counter(q)}
html[lang="th"] .note::before{content:"ข้อสังเกต"}
html[lang="th"] .ask h2::before{content:"แผนกการค้า"}
html[lang="th"] .photo figcaption::before{content:"แผ่นภาพ " attr(data-sheet)}
html[lang="th"] .faq .qa::before{content:"ถาม" counter(q)}
html[lang="fa"] .note::before{content:"نکته"}
html[lang="fa"] .ask h2::before{content:"میز بازرگانی"}
html[lang="fa"] .photo figcaption::before{content:"لوح " attr(data-sheet)}
html[lang="fa"] .faq .qa::before{content:"س" counter(q)}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--paper);color:var(--ink);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--body);font:400 1.0625rem/1.6 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:var(--tur);text-underline-offset:.15em}
a:hover{color:var(--ink)}
:focus-visible{outline:2px solid var(--moss);outline-offset:3px}
.band :focus-visible,.ask :focus-visible,.trade-rail :focus-visible{outline-color:var(--paper)}
::selection{background:rgba(126,138,82,.35);color:var(--ink)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
h1,h2,h3{color:var(--ink);font-family:var(--serif);font-weight:600;text-wrap:balance}
h1{font-size:clamp(2.1rem,1.2rem + 3.6vw,3.6rem);line-height:1.06;letter-spacing:-.015em;margin:.5rem 0 1rem}
h2{font-size:clamp(1.5rem,1.1rem + 1.5vw,2.1rem);line-height:1.15;letter-spacing:-.01em;margin:0}
h3{font-size:1.2rem;line-height:1.3;margin:0 0 .35rem}
p{margin:0 0 1rem}
i,.latin{font-family:var(--serif);font-style:italic;font-weight:400}
[lang=ar]{font-family:var(--arabic);letter-spacing:0;font-size:1.08em}
.wrap{max-width:72rem;margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem)}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.5rem 1rem}
.skip:focus{left:1rem}

/* small mono labels */
.eyebrow,.ref,.crumbs,.stamp,.no{font-family:var(--mono);font-weight:500;letter-spacing:.1em;text-transform:uppercase}
.eyebrow{font-size:.74rem;color:var(--muted);margin:0}
.ref{font-size:.72rem;color:var(--muted)}

/* header: centred crest masthead */
.site-head{position:sticky;top:0;z-index:90;background:rgba(247,244,236,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(214,207,189,.85);box-shadow:var(--shadow-xs);transition:box-shadow .25s ease}
.masthead{display:flex;justify-content:center;padding-block:.9rem .85rem}
.crest{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-areas:"navl seal navr" "rule rule rule" "name name name";align-items:center;width:min(100% - 3rem,76rem);--sprig-w:3.9rem}
.seal{grid-area:seal;justify-self:center;position:relative;display:grid;place-items:center;width:var(--seal,5rem);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 35%,var(--moss),var(--moss-deep));box-shadow:0 0 0 1px var(--moss),0 0 0 3px var(--paper),0 0 0 4px var(--leafline),0 14px 26px -16px rgba(29,27,22,.8);overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}
.seal:hover{transform:scale(1.04);box-shadow:0 0 0 1px var(--moss),0 0 0 3px var(--paper),0 0 0 4px var(--leafline),0 18px 30px -14px rgba(29,27,22,.85)}
.seal::before{content:"";position:absolute;inset:0;z-index:2;border-radius:50%;background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.16),transparent 58%);pointer-events:none}
.seal-art{position:relative;z-index:1;display:block;width:72%;height:72%}
.seal-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 6px rgba(0,0,0,.35))}
.seal-art .seal-spin{filter:none}
.seal-still{display:none}
.seal::after{content:"";position:absolute;inset:5px;z-index:3;border:1px solid rgba(247,244,236,.25);border-radius:50%;pointer-events:none}
.navrow{display:contents}
.nav{display:flex;align-items:center;width:auto;max-width:100%;font-size:clamp(.85rem,.95vw,.95rem)}
.nav-left{grid-area:navl;justify-self:end;justify-content:flex-end;gap:clamp(.5rem,1.2vw,1.4rem);padding-right:clamp(1rem,2.2vw,2.5rem)}
.nav-right{grid-area:navr;justify-self:start;justify-content:flex-start;gap:clamp(.5rem,1.2vw,1.4rem);padding-left:clamp(1rem,2.2vw,2.5rem)}
.nav-left,.nav-right{align-self:end}
.nav a,.nav .nav-cta{white-space:nowrap;flex-shrink:0}
.nav a{color:var(--ink);text-decoration:none;padding-block:.4rem;white-space:nowrap;position:relative;font-weight:500;transition:color .2s ease}
.nav a::after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--moss);transition:width .22s ease,left .22s ease;border-radius:1px}
.nav a:hover{color:var(--moss);text-decoration:none}
.nav a:hover::after{width:100%;left:0}
.nav a[aria-current]{color:var(--moss);font-weight:600;text-decoration:none}
.nav a[aria-current]::after{width:100%;left:0}
.nav .nav-cta{border:1.5px solid var(--moss);padding:.42rem 1rem;border-radius:999px;font-weight:600;background:rgba(60,85,55,.05);color:var(--moss);box-shadow:var(--shadow-xs);transition:all .22s ease}
.nav .nav-cta::after{display:none}
.nav .nav-cta:hover,.nav .nav-cta[aria-current]{background:var(--moss);color:var(--paper);border-color:var(--moss);box-shadow:0 4px 14px -2px rgba(60,85,55,.35);transform:translateY(-1px)}
.rule{grid-area:rule;position:relative;height:0;margin:.4rem 0 0;border-top:1px solid #7E8A52}
.sprig{position:absolute;bottom:0;width:var(--sprig-w);height:calc(var(--sprig-w)*.82);background:url(sprig.svg) left bottom/contain no-repeat;pointer-events:none}
.sprig-l{right:100%;transform:scaleX(-1)}
.sprig-r{left:100%}
.nameplate{grid-area:name;justify-self:center;margin:.55rem 0 0;font:600 .72rem/1 var(--mono);letter-spacing:.28em;text-indent:.28em;text-transform:uppercase;color:var(--ink);white-space:nowrap}
@media (prefers-reduced-motion:reduce){.seal-spin{display:none}.seal-still{display:block}}

@media (max-width:1120px){
  .masthead{padding-block:.95rem .8rem}
  .crest{grid-template-columns:1fr;grid-template-areas:"seal" "navs" "rule" "name";row-gap:.55rem;width:100%;--sprig-w:3rem}
  .seal{--seal:4.9rem}
  .navrow{grid-area:navs;display:flex;justify-content:center;align-items:center;gap:1.4rem;width:100%}
  .nav{width:auto;justify-content:flex-start}
  .nav-left{justify-self:auto;padding:0}
  .nav-right{justify-self:auto;padding:0}
  .nav-left,.nav-right{align-self:auto}
  .rule{margin-top:.15rem;margin-inline:var(--sprig-w)}
}
@media (max-width:640px){
  .crest{row-gap:.3rem;--sprig-w:2.7rem}
  .seal{--seal:4.6rem}
  .navrow{align-items:flex-start;gap:1.6rem}
  .nav{flex-direction:column;gap:.05rem;font-size:.86rem}
  .nav-left{flex-direction:column;align-items:flex-end;text-align:right}
  .nav-right{flex-direction:column;align-items:flex-start;text-align:left}
  .nav a{padding-block:.28rem}
  .nav .nav-cta{padding:.38rem .65rem;font-size:.82rem}
  .rule{margin-top:.1rem}
  .nameplate{font-size:.66rem;letter-spacing:.22em;text-indent:.22em;margin-top:.45rem}
}
@media (max-width:380px){
  .navrow{gap:.85rem}
  .nav{font-size:.82rem}
  .nav .nav-cta{padding:.32rem .5rem;font-size:.78rem}
  .crest{--sprig-w:2.2rem}
  .rule{margin-top:.15rem}
}

/* buttons */
.actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:46px;padding:.65rem 1.3rem;border:1.5px solid var(--ink);border-radius:6px;font:600 .95rem/1.2 var(--sans);text-decoration:none;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1)}
.btn:active{transform:translateY(1px)}
.btn-ink{background:var(--ink);color:var(--paper);border-color:var(--ink);box-shadow:0 3px 10px -2px rgba(29,27,22,.25)}
.btn-ink:hover{background:#000;color:var(--paper);border-color:#000;box-shadow:0 6px 18px -3px rgba(29,27,22,.35);transform:translateY(-1.5px)}
.btn-line{background:var(--sheet);color:var(--ink);border-color:#C5BEAD;box-shadow:var(--shadow-xs)}
.btn-line:hover{background:#fff;border-color:var(--moss);color:var(--moss);box-shadow:var(--shadow-sm);transform:translateY(-1.5px)}
a.btn[href*="wa.me"],.btn-wa{background:var(--wa-dark);border-color:var(--wa-dark);color:#fff;box-shadow:0 3px 12px -2px rgba(18,140,126,.35)}
a.btn[href*="wa.me"]:hover,.btn-wa:hover{background:var(--wa-deep);border-color:var(--wa-deep);color:#fff;box-shadow:0 6px 18px -3px rgba(18,140,126,.45);transform:translateY(-1.5px)}
.btn .k{font:500 .7rem/1 var(--mono);letter-spacing:.08em;opacity:.75}

/* stamp */
.stamp{display:inline-block;border:2px dashed var(--red);border-radius:4px;color:var(--red);font:600 .68rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:.45rem .65rem;transform:rotate(-3deg);background:rgba(166,58,34,.04);box-shadow:0 2px 6px rgba(166,58,34,.08)}

/* hero : the herbarium cabinet */
.hero2{position:relative;overflow:hidden;padding-block:clamp(2.8rem,5.2vw,4.9rem) clamp(3rem,5.8vw,5.2rem);background:radial-gradient(58% 80% at 88% 34%,rgba(126,138,82,.14),transparent 68%),var(--paper)}
.hero2::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line)}
.hero2 .wrap{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(2.4rem,4.6vw,4.8rem);align-items:center}
.hero2-copy{position:relative;z-index:2}
.lede{font-size:1.15rem;line-height:1.55;max-width:36em;color:var(--body)}
.hero2 .eyebrow{display:flex;align-items:center;gap:.7rem;font-size:.7rem;letter-spacing:.145em;color:var(--moss)}
.hero2 .eyebrow::before{content:"";width:1.9rem;height:1px;background:var(--leafline);flex:none}
.hero2 h1{font-size:clamp(2.55rem,4vw,4.05rem);line-height:1.035;letter-spacing:-.022em;margin:1rem 0 1.15rem}
.hero2 h1 em{color:var(--moss);font-weight:400}
.hero2 .lede{max-width:35em;margin:0}
.hero2 .actions{margin-top:1.55rem}
.hero2 .stamp{margin-top:1.5rem;font-size:.65rem;padding:.4rem .55rem}
.hero2-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;border-top:1px solid var(--line);margin-top:2rem;padding-top:1.15rem}
.hero2-proof div{display:flex;flex-direction:column;gap:.35rem;min-width:0;padding:.85rem 1rem;background:rgba(251,249,243,.8);border:1px solid rgba(214,207,189,.85);border-radius:8px;box-shadow:var(--shadow-xs);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.hero2-proof div:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);border-color:var(--leafline);background:#fff}
.hero2-proof b{font:600 1.06rem/1.15 var(--serif);color:var(--ink);letter-spacing:-.01em;white-space:nowrap}
.hero2-proof span{font:500 .62rem/1.4 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.hero2-visual{position:relative;z-index:1;display:flex;justify-content:flex-end}
.cabinet{position:relative;width:min(100%,32.5rem);min-height:33.5rem;background:var(--moss-deep);border-radius:2px;padding:1.1rem 1.1rem 1rem;box-shadow:0 36px 64px -46px rgba(29,27,22,.9)}
.cabinet::before{content:"";position:absolute;inset:.58rem;border:1px solid rgba(247,244,236,.14);pointer-events:none}
.cabinet-head{position:relative;z-index:2;display:flex;justify-content:space-between;gap:1rem;padding:.15rem .15rem 0;color:var(--leafline);font:500 .57rem/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.plate{position:absolute;z-index:1;top:2.9rem;right:1.1rem;width:74%;background:var(--sheet);border:1px solid rgba(154,164,125,.85);padding:.5rem;transform:rotate(-1.3deg);box-shadow:0 20px 30px -24px rgba(0,0,0,.85)}
.plate-label{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;padding:.2rem .2rem .3rem;font:500 .54rem/1.2 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.plate-label b{font-weight:500;color:var(--ink)}
.plate-name{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;padding:.12rem .2rem .18rem}
.plate-name b{font:600 1.32rem/1.05 var(--serif);letter-spacing:-.012em;color:var(--ink);white-space:nowrap}
.plate-name span{font:500 .53rem/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.plate-latin{display:flex;align-items:baseline;gap:.42rem;margin:0;padding:.04rem .2rem .5rem;font:500 .49rem/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.plate-latin span{color:var(--moss)}
.plate-latin i{font:italic 400 .9rem/1.1 var(--serif);letter-spacing:0;text-transform:none;color:var(--body);white-space:nowrap}
.plate-window{position:relative;height:21rem;overflow:hidden;border-radius:50% 50% 0 0/46% 46% 0 0;background:#fff}
.plate-window img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 46%;transform:scale(1.35);transform-origin:50% 55%}
.plate-window.is-turn-ready{cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.plate-window.is-turning{cursor:grabbing}
.plate-window img{-webkit-user-drag:none}
.turn-hint{position:absolute;right:.75rem;bottom:.7rem;z-index:2;display:inline-flex;align-items:center;gap:.32rem;padding:.33rem .52rem .3rem;border:1px solid rgba(90,86,75,.28);border-radius:999px;background:rgba(251,249,243,.92);color:var(--muted);font:500 .5rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;pointer-events:none;opacity:0;transform:translateY(3px);transition:opacity .3s ease,transform .3s ease}
.turn-hint svg{display:block;width:11px;height:11px;flex:none;color:var(--tur)}
.plate-window.is-turn-ready .turn-hint{opacity:1;transform:none}
.plate-window.is-turning .turn-hint,.plate-window.has-turned .turn-hint{opacity:0;transform:translateY(3px)}
.turn-reset{position:absolute;right:.7rem;bottom:.65rem;z-index:3;display:none;align-items:center;gap:.34rem;min-height:28px;padding:.3rem .55rem .28rem;border:1px solid rgba(90,86,75,.3);border-radius:999px;background:rgba(251,249,243,.95);color:var(--tur);font:500 .5rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.turn-reset svg{display:block;width:11px;height:11px;flex:none}
.plate-window.has-turned .turn-reset{display:inline-flex}
.plate-window.is-turning .turn-reset{display:none}
.turn-reset:hover{background:#fff;color:var(--ink)}
.slip{position:absolute;z-index:3;left:1rem;bottom:1rem;width:49%;background:var(--kraft);color:var(--navy);border:1.4px dashed var(--navy);outline:5px solid var(--kraft);padding:.8rem .85rem .75rem;transform:rotate(1.5deg);box-shadow:0 18px 28px -20px rgba(0,0,0,.65);font:500 .59rem/1.5 var(--mono);letter-spacing:.05em;text-transform:uppercase}
.slip-brand{font:600 1.1rem/1.05 var(--serif);letter-spacing:0;text-transform:none;margin:0}
.slip-sub{font-size:.5rem;letter-spacing:.14em;opacity:.72;margin:.2rem 0 .55rem}
.slip dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.17rem .5rem;margin:0;padding-top:.5rem;border-top:1.4px solid var(--navy)}
.slip dt{opacity:.7;white-space:nowrap}
.slip dd{margin:0;border-bottom:1px dotted rgba(22,33,58,.55);white-space:nowrap}
.slip-stamp{position:absolute;top:-.9rem;right:-.7rem;width:3.4rem;height:3.4rem;border:2px solid var(--red);border-radius:50%;color:var(--red);background:var(--kraft);display:grid;place-items:center;text-align:center;font:600 .48rem/1.15 var(--mono);letter-spacing:.05em;text-transform:uppercase;transform:rotate(-10deg)}
.vert-label{position:absolute;z-index:2;left:.45rem;top:41%;writing-mode:vertical-rl;color:var(--leafline);font:500 .52rem/1 var(--mono);letter-spacing:.24em;text-transform:uppercase}
@media (max-width:1120px){
  .hero2 .wrap{grid-template-columns:1fr;gap:2.6rem}
  .hero2-copy{max-width:42rem}
  .hero2-visual{justify-content:center}
  .cabinet{width:min(100%,31rem)}
}
@media (max-width:640px){
  .hero2 .wrap{gap:2rem}
  .hero2 h1{font-size:clamp(2.35rem,8.8vw,2.9rem)}
  .hero2 .lede{font-size:1rem}
  .hero2 .actions .btn{flex:1 1 auto}
  .hero2 .actions .btn-line{flex:0 1 auto}
  .hero2-proof{gap:.7rem;margin-top:1.5rem}
  .hero2-proof b{font-size:.95rem;white-space:normal;text-wrap:balance}
  .hero2-proof span{font-size:.55rem;letter-spacing:.07em}
  .hero2 .stamp{margin-top:1.2rem}
  .cabinet{min-height:30rem;padding:.9rem}
  .cabinet-head{font-size:.52rem}
  .plate{top:2.4rem;right:.9rem;width:78%}
  .plate-window{height:18rem}
  .plate-window img{transform:none}
  .turn-hint,.turn-reset{display:none}
  .slip{left:.8rem;bottom:.8rem;width:55%}
  .vert-label{display:none}
}
@media (max-width:400px){
  .hero2 .wrap{gap:1.6rem}
  .hero2 .eyebrow{font-size:.58rem;letter-spacing:.07em}
  .hero2 .eyebrow::before{display:none}
  .hero2 h1{margin:.8rem 0 .9rem}
  .hero2 .actions{gap:.5rem;margin-top:1.2rem}
  .hero2 .actions .btn{padding:.6rem .8rem;font-size:.88rem}
  .hero2-proof b{font-size:.86rem}
  .hero2-proof span{font-size:.5rem;letter-spacing:.04em}
  .cabinet{min-height:27rem}
  .plate{width:82%;top:2.2rem;right:.7rem}
  .plate-window{height:15.5rem}
  .slip{width:61%;left:.7rem;bottom:.7rem}
  .slip-brand{font-size:1rem}
}

/* kraft bag label (code-drawn) */
.label{justify-self:center;width:100%;max-width:22rem;background:var(--kraft);color:var(--navy);border:1.5px dashed var(--navy);outline:7px solid var(--kraft);box-shadow:0 0 0 8px rgba(22,33,58,.08),0 22px 34px -20px rgba(22,33,58,.5);padding:1.2rem 1.25rem 1.1rem;transform:rotate(-1.2deg);font:500 .76rem/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase}
.label .l-brand{font:600 1.45rem/1.1 var(--serif);letter-spacing:0;text-transform:none;margin:0}
.label .l-sub{margin:.2rem 0 0;opacity:.8}
.label dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.45rem .8rem;margin:.9rem 0 0;padding-top:.85rem;border-top:1.5px solid var(--navy)}
.label dt{opacity:.75;white-space:nowrap}
.label dd{margin:0;min-height:1.5em;border-bottom:1px dotted var(--navy);text-transform:none;letter-spacing:.02em}
.label dd .latin{font-size:1.02rem;letter-spacing:0}
.label .l-foot{margin:.9rem 0 0;padding-top:.6rem;border-top:1.5px solid var(--navy);display:flex;justify-content:space-between;gap:1rem}

/* ===== editorial sections ===== */
.sec{padding-block:clamp(2.75rem,4.6vw,4.3rem);border-top:1px solid var(--line);position:relative}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.1rem 2.5rem;margin-bottom:clamp(1.6rem,2.6vw,2.2rem)}
.sec-head-main{max-width:44rem}
.sec-head h2{font-size:clamp(1.7rem,1.15rem + 1.8vw,2.55rem);line-height:1.1;letter-spacing:-.018em;margin-top:.55rem}
.sec-lede{max-width:40rem;margin:.7rem 0 0;color:var(--muted);font-size:1.02rem;line-height:1.6}
.sec-head .ref{padding:.42rem 0 0;border-top:1px solid var(--ink);white-space:nowrap;color:var(--moss)}

/* quiet interaction polish */
.btn{transition:background-color .18s ease,color .18s ease,border-color .18s ease}
.btn:active{transform:translateY(1px)}

.kicker{display:flex;align-items:center;gap:.65rem;margin:0;font:500 .65rem/1.2 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--moss)}
.kicker::after{content:"";height:1px;width:2.4rem;background:var(--leafline);flex:none}
.kicker .n{display:inline-grid;place-items:center;width:1.65rem;height:1.65rem;border:1px solid var(--leafline);border-radius:50%;font-size:.57rem;letter-spacing:.03em;flex:none}
.note{display:flex;gap:.9rem;margin:1.25rem 0 0;padding-top:1rem;border-top:1px dotted var(--line);font-size:.9rem;line-height:1.55;color:var(--muted)}
.note::before{content:"Note";flex:none;font:500 .6rem/1.7 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--moss)}

/* trade facts strip */
.trade-rail{background:linear-gradient(135deg,var(--moss-deep) 0%,var(--moss-rich) 100%);color:var(--paper);border-top:1px solid rgba(154,164,125,.3);border-bottom:1px solid rgba(154,164,125,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.trade-rail ul{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0}
.trade-rail li{padding:1.45rem clamp(1rem,2.4vw,1.8rem);border-left:1px solid rgba(247,244,236,.14);transition:background .2s ease}
.trade-rail li:hover{background:rgba(255,255,255,.03)}
.trade-rail li:first-child{border-left:0;padding-left:0}
.trade-rail .k{display:block;margin-bottom:.45rem;font:600 .62rem/1.2 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--leafline)}
.trade-rail b{display:block;font:600 1.18rem/1.2 var(--serif);letter-spacing:-.01em;color:var(--paper)}
.trade-rail .v{display:block;margin-top:.28rem;font-size:.82rem;line-height:1.45;color:#D8DAC4}

/* product index (home) */
.index{list-style:none;margin:0;padding:0;border-top:0}
.index-head{display:grid;grid-template-columns:3.2rem 5.6rem minmax(0,1.4fr) minmax(0,1fr) 2.4rem;gap:1.2rem;padding:.6rem 1.2rem;border-bottom:1px solid var(--line);font:600 .66rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.index li{border-bottom:0;margin-bottom:.75rem}
.index li:last-child{border-bottom:0}
.row{position:relative;display:grid;grid-template-columns:3.2rem 5.6rem minmax(0,1.4fr) minmax(0,1fr) 2.4rem;grid-template-areas:"no img id sp go";align-items:center;gap:1.2rem;padding:.9rem 1.25rem;color:inherit;text-decoration:none;background:var(--sheet);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-xs);transition:all .22s cubic-bezier(.16,1,.3,1)}
.row::before{content:"";position:absolute;left:0;top:.75rem;bottom:.75rem;width:3px;border-radius:0 3px 3px 0;background:var(--moss);transform:scaleY(0);transform-origin:center;transition:transform .22s ease}
.row:hover{background:#fff;border-color:var(--leafline);box-shadow:var(--shadow-md);transform:translateY(-2px);color:inherit}
.row:hover::before{transform:scaleY(1)}
.row .no{grid-area:no;font-size:.74rem;color:var(--moss);font-weight:600;white-space:nowrap}
.row img{grid-area:img;width:5.6rem;height:5.6rem;object-fit:cover;padding:.2rem;border:1px solid var(--line);border-radius:6px;background:var(--paper);box-shadow:0 2px 6px rgba(0,0,0,.04);transition:all .25s ease}
.row:hover img{border-color:var(--moss);transform:scale(1.05);box-shadow:0 4px 12px rgba(60,85,55,.15)}
.row .id{grid-area:id;min-width:0}
.row .nm{display:block;color:var(--ink);font:600 1.28rem/1.2 var(--serif);letter-spacing:-.01em;transition:color .18s ease}
.row .latin{display:block;color:var(--muted);font-size:.98rem;margin-top:.2rem}
.row:hover .nm{color:var(--moss);text-decoration:none}
.row .sp{grid-area:sp;font-size:.93rem;line-height:1.5;color:var(--muted)}
.row .sp b{display:inline-block;padding:.15rem .55rem;border-radius:4px;background:rgba(126,138,82,.14);color:var(--moss-deep);font-weight:600;font-size:.82rem;margin-right:.4rem}
.row .go{grid-area:go;justify-self:end;display:grid;place-items:center;width:2.4rem;height:2.4rem;border:1.5px solid var(--line);border-radius:50%;background:var(--paper);color:var(--moss);font-family:var(--mono);font-size:1rem;font-weight:600;box-shadow:var(--shadow-xs);transition:all .22s cubic-bezier(.16,1,.3,1)}
.row:hover .go{background:var(--moss);border-color:var(--moss);color:var(--paper);transform:translateX(3px);box-shadow:0 4px 12px rgba(60,85,55,.3)}

/* order */
.order-grid{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(16rem,.78fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:start}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.9rem;border:0}
.steps li{position:relative;padding:1.65rem 1.6rem 1.75rem;border:1px solid var(--line);border-radius:10px;background:var(--sheet);box-shadow:var(--shadow-xs);transition:all .22s ease}
.steps li:hover{background:#fff;border-color:var(--leafline);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.steps .no{display:inline-flex;align-items:center;justify-content:center;width:2.1rem;height:2.1rem;margin-bottom:1rem;border-radius:50%;background:rgba(126,138,82,.14);border:1px solid var(--leafline);font:600 .72rem/1 var(--mono);letter-spacing:.04em;color:var(--moss-deep)}
.steps h3{font-size:1.35rem;margin-bottom:.45rem}
.steps li::after{content:"";position:absolute;top:1.65rem;right:1.5rem;width:.5rem;height:.5rem;border:1px solid var(--leafline);border-radius:50%}
.steps p{margin:0;font-size:.95rem;line-height:1.6;color:var(--muted)}
.order-note{position:relative;overflow:hidden;background:linear-gradient(145deg,var(--moss-deep) 0%,var(--moss-rich) 100%);color:var(--paper);padding:1.85rem 1.75rem;border-radius:12px;box-shadow:var(--shadow-lg)}
.order-note::before{content:"";position:absolute;right:-3rem;top:-3rem;width:15rem;height:15rem;background:radial-gradient(circle,rgba(154,164,125,.3),transparent 68%);pointer-events:none}
.order-note::after{content:"";position:absolute;right:-1rem;bottom:-1.5rem;width:9rem;height:7rem;background:url(sprig.svg) right bottom/contain no-repeat;opacity:.18;pointer-events:none}
.order-note>*{position:relative;z-index:1}
.order-note .kicker{color:var(--leafline);margin-bottom:.65rem}
.order-note .kicker::after{background:rgba(154,164,125,.55)}
.order-note h3{font-size:1.6rem;color:var(--paper);margin-bottom:1.15rem}
.order-note dl{display:grid;gap:1rem;margin:0;padding-top:1.1rem;border-top:1px solid rgba(247,244,236,.18)}
.order-note dt{font:600 .62rem/1.2 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--leafline)}
.order-note dd{margin:.25rem 0 0;font-size:.95rem;line-height:1.55;color:#EAE7DB}
.order-note .btn{width:100%;margin-top:1.4rem;border-color:rgba(247,244,236,.6);background:rgba(247,244,236,.12);color:var(--paper);backdrop-filter:blur(4px)}
.order-note .btn:hover{background:var(--paper);color:var(--moss-deep);border-color:var(--paper);box-shadow:0 6px 18px rgba(0,0,0,.25)}

/* documentation docket */
.docket{position:relative;border:1px solid #C4BDAC;border-radius:12px;background:var(--sheet);overflow:hidden;box-shadow:var(--shadow-md)}
.docket-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.4rem 1.5rem;padding:.85rem 1.6rem;background:var(--panel);border-bottom:1px solid var(--line);font:600 .64rem/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cert{display:grid;grid-template-columns:1fr 1fr;background:var(--sheet)}
.cert>div{padding:1.75rem 1.85rem}
.cert>div+div{border-left:1px solid var(--line)}
.cert-label{margin:0 0 .4rem;font:600 .64rem/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--moss)}
.cert h3{font-size:1.38rem;margin-bottom:1rem}
.cert ul{list-style:none;margin:0;padding:0}
.cert li{position:relative;padding:.65rem 0 .65rem 1.85rem;border-bottom:1px dotted var(--line);font-size:.96rem;line-height:1.5;color:var(--body)}
.cert li:last-child{border-bottom:0}
.cert li::before{content:"✓";position:absolute;left:0;top:.65rem;display:grid;place-items:center;width:1.2rem;height:1.2rem;border-radius:50%;background:rgba(126,138,82,.16);color:var(--moss);font-size:.74rem;font-weight:700}
.cert .done li::before{background:var(--moss);color:var(--paper)}
.docket-foot{display:flex;align-items:center;gap:1.8rem;padding:1.3rem 1.6rem;border-top:1px dashed #C4BDAC;background:var(--paper)}
.docket-foot p{margin:0;max-width:48rem;font-size:.88rem;line-height:1.6;color:var(--muted)}
.cert-stamp{flex:none;display:grid;place-items:center;width:5.6rem;height:5.6rem;border:2.5px dashed var(--red);border-radius:50%;background:var(--sheet);box-shadow:inset 0 0 0 3px var(--sheet),0 4px 14px rgba(166,58,34,.15);color:var(--red);text-align:center;font:700 .55rem/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;transform:rotate(-6deg)}

/* standard */
.pledge{position:relative;background:var(--sheet);border:1px solid #C4BDAC;border-top:3px solid var(--moss);border-radius:12px;overflow:hidden;box-shadow:var(--shadow-md)}
.pledge-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.35rem 1.5rem;padding:.85rem 1.6rem;background:var(--panel);border-bottom:1px solid var(--line);font:600 .64rem/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.rules{counter-reset:r;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0 1.6rem}
.rules li{position:relative;padding:1.85rem 1.85rem 2rem .1rem;border-right:1px solid var(--line)}
.rules li+li{padding-left:1.85rem}
.rules li:last-child{border-right:0;padding-right:.1rem}
.rules .no{display:block;margin-bottom:.9rem;font:400 2.4rem/1 var(--serif);letter-spacing:-.02em;color:var(--moss);opacity:.85}
.rules h3{font-size:1.28rem;margin-bottom:.45rem}
.rules p{margin:0;font-size:.95rem;line-height:1.6;color:var(--muted)}
.pledge-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 1.5rem;padding:.9rem 1.6rem;border-top:1px dashed #C4BDAC;background:var(--paper)}
.pledge-foot p{margin:0;max-width:44rem;font-size:.88rem;line-height:1.55;color:var(--muted)}
.pledge-seal{flex:none;width:3.6rem;height:3.6rem;border:2px dashed var(--red);border-radius:50%;background:var(--sheet);color:var(--red);display:grid;place-items:center;text-align:center;font:700 .48rem/1.2 var(--mono);letter-spacing:.07em;text-transform:uppercase;transform:rotate(-7deg);box-shadow:0 3px 10px rgba(166,58,34,.12)}

/* CTA band */
.band{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--moss-deep) 0%,var(--moss-rich) 100%);color:var(--paper);border-top:1px solid rgba(154,164,125,.3);border-bottom:1px solid rgba(154,164,125,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.band::before{content:"";position:absolute;right:-6rem;top:-8rem;width:30rem;height:30rem;background:radial-gradient(circle,rgba(154,164,125,.22),transparent 66%);pointer-events:none}
.band::after{content:"";position:absolute;right:clamp(1rem,4vw,4rem);bottom:-2.5rem;width:clamp(14rem,26vw,23rem);height:clamp(11rem,20vw,18rem);background:url(sprig.svg) right bottom/contain no-repeat;opacity:.16;transform:rotate(-8deg);pointer-events:none}
.band .wrap{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem 2.5rem;padding-block:clamp(2.75rem,5.2vw,4rem)}
.band .kicker{color:var(--leafline);margin-bottom:.65rem}
.band .kicker::after{background:rgba(154,164,125,.6)}
.band h2{color:var(--paper);font-size:clamp(1.85rem,1.3rem + 1.8vw,2.7rem)}
.band p{margin:.45rem 0 0;max-width:32rem;color:#CFD1BC}
.band .actions{margin:0}
.band .btn-ink{background:var(--paper);border-color:var(--paper);color:var(--moss-deep);box-shadow:0 4px 14px rgba(0,0,0,.25)}
.band .btn-ink:hover{background:#fff;color:var(--moss-deep);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.band .btn-line{color:var(--paper);border-color:rgba(247,244,236,.55);background:rgba(247,244,236,.06);backdrop-filter:blur(4px)}
.band .btn-line:hover{background:rgba(247,244,236,.15);color:var(--paper)}
.band a.btn[href*="wa.me"]{background:var(--wa-dark);border-color:var(--wa-dark);color:#fff}
.band a.btn[href*="wa.me"]:hover{background:var(--wa-deep);border-color:var(--wa-deep);color:#fff}

/* ===== product pages ===== */
.crumbs{font-size:.68rem;color:var(--muted);padding-top:1.4rem;margin:0;letter-spacing:.09em}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--ink);text-decoration:underline}
.crumbs span{margin-inline:.45rem;color:var(--leafline)}
.p-top{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(2rem,5vw,4.5rem);align-items:start;padding-block:1.2rem clamp(2.5rem,5vw,4rem)}
.p-top .eyebrow{display:flex;align-items:center;gap:.7rem;font-size:.68rem;letter-spacing:.14em;color:var(--moss)}
.p-top .eyebrow::before{content:"";width:1.8rem;height:1px;background:var(--leafline);flex:none}
.p-top h1{font-size:clamp(2rem,1.15rem + 2.9vw,3.15rem);line-height:1.07;letter-spacing:-.02em;margin:.7rem 0 1rem}
.p-top .latin-big{font-size:clamp(1.15rem,1rem + .7vw,1.45rem);color:var(--moss);margin:-.35rem 0 1.1rem}
.p-top>div>p:not(.eyebrow):not(.latin-big):not(.names){max-width:36rem;font-size:1.02rem}
.p-top .names{max-width:38rem;margin:1.2rem 0 0;padding-top:.9rem;border-top:1px solid var(--line);font-size:.9rem;line-height:1.65;color:var(--muted)}
.p-top .names b{color:var(--body)}
.p-top .actions{gap:.6rem;margin-top:1.4rem}
.assurance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem;margin-top:1.6rem;padding-top:.95rem;border-top:1px solid var(--line)}
.assurance b{display:block;color:var(--ink);font:600 .98rem/1.15 var(--serif);letter-spacing:-.005em}
.assurance span{display:block;margin-top:.2rem;font:500 .56rem/1.4 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.photo{position:relative;margin:0;padding:.95rem .95rem 0;background:var(--sheet);border:1px solid #C4BDAC;border-radius:10px;box-shadow:var(--shadow-lg)}
.photo::before{content:"";position:absolute;inset:.45rem;border:1px solid rgba(90,86,75,.16);border-radius:6px;pointer-events:none}
.photo img{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--panel);border-radius:4px}
.photo .plate-window{position:relative;width:100%;aspect-ratio:1/1;height:auto;overflow:hidden;border-radius:4px;background:var(--panel)}
.photo .plate-window img{width:100%;height:100%;object-fit:cover;transform:none}
.photo figcaption{display:flex;justify-content:space-between;gap:1rem;padding:.75rem .2rem .85rem;font:600 .62rem/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.photo figcaption::before{content:"Plate " attr(data-sheet);flex:none;color:var(--moss)}
.p-body{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);align-items:start;padding-bottom:clamp(2.5rem,5vw,4rem)}
.p-body>div>h2,.p-body .faq>h2{font-size:1.55rem;margin:0 0 1.1rem;padding-bottom:.7rem;border-bottom:1px solid var(--line)}
.spec{width:100%;border-collapse:collapse;border-top:2px solid var(--moss);border-radius:8px;overflow:hidden;box-shadow:var(--shadow-xs);background:var(--sheet);font-size:.97rem}
.spec th,.spec td{text-align:left;vertical-align:middle;padding:.8rem 1rem;border-bottom:1px solid var(--line)}
.spec tr:nth-child(even){background:rgba(247,244,236,.45)}
.spec tr:hover{background:rgba(126,138,82,.08)}
.spec th{width:32%;padding-top:.8rem;font:600 .68rem/1.5 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.spec td{color:var(--body)}
.aside{display:grid;gap:1.5rem;position:sticky;top:5.5rem}
.ask{position:relative;overflow:hidden;padding:1.85rem 1.65rem;background:linear-gradient(145deg,var(--moss-deep) 0%,var(--moss-rich) 100%);color:#E7E4D7;border-radius:12px;box-shadow:var(--shadow-lg)}
.ask::after{content:"";position:absolute;right:-2.5rem;bottom:-2rem;width:10rem;height:8rem;background:url(sprig.svg) right bottom/contain no-repeat;opacity:.16;pointer-events:none}
.ask>*{position:relative;z-index:1}
.ask h2{font-size:1.45rem;color:var(--paper);margin-bottom:.25rem}
.ask h2::before{content:"Trade desk";display:block;margin-bottom:.55rem;font:600 .62rem/1.2 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--leafline)}
.ask p{font-size:.93rem;line-height:1.55;color:#CFD1BC;margin:.45rem 0 0}
.ask .actions{margin-top:1.25rem;flex-direction:column;gap:.65rem}
.ask .btn{width:100%}
.ask .btn-ink{background:var(--paper);border-color:var(--paper);color:var(--moss-deep);box-shadow:0 3px 10px rgba(0,0,0,.2)}
.ask .btn-ink:hover{background:#fff;color:var(--moss-deep)}
.ask .btn-line{color:var(--paper);border-color:rgba(247,244,236,.55);background:rgba(247,244,236,.08)}
.ask .btn-line:hover{background:rgba(247,244,236,.18);color:var(--paper)}
.ask a.btn[href*="wa.me"]{background:var(--wa-dark);border-color:var(--wa-dark);color:#fff}
.ask a.btn[href*="wa.me"]:hover{background:var(--wa-deep);border-color:var(--wa-deep);color:#fff}
.langs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:2.5rem}
.lang{padding:1.05rem 1.15rem 1.1rem;background:var(--sheet);border:1px solid var(--line);border-top:2px solid var(--moss)}
.lang .eyebrow{margin-bottom:.4rem;color:var(--moss);font-size:.62rem;letter-spacing:.14em}
.lang p{margin:0;font-size:.92rem;line-height:1.6;color:var(--body)}
.lang[dir=rtl]{text-align:right;border-top-color:var(--kraft)}
.faq{counter-reset:q;margin-top:2.5rem}
.faq .qa{position:relative;border-top:1px solid var(--line);padding:1.05rem 0 1.1rem 2.6rem}
.faq .qa:last-child{border-bottom:1px solid var(--line)}
.faq .qa::before{counter-increment:q;content:"Q" counter(q);position:absolute;left:0;top:1.1rem;display:grid;place-items:center;width:1.7rem;height:1.7rem;border:1px solid var(--leafline);border-radius:50%;font:500 .6rem/1 var(--mono);letter-spacing:.02em;color:var(--moss)}
.faq .qa h3{font-size:1.08rem;margin-bottom:.25rem}
.faq .qa p{margin:0;font-size:.95rem;line-height:1.55;color:var(--muted)}
.sheet-nav{display:grid;grid-template-columns:1fr 1fr;gap:1rem 2rem;margin:2.3rem 0 clamp(2.2rem,4vw,3.1rem);padding-top:1.05rem;border-top:1px solid var(--line)}
.sheet-nav a{display:grid;gap:.16rem;text-decoration:none;color:inherit;min-width:0}
.sheet-nav .next{justify-self:end;text-align:right}
.sheet-nav span{font:500 .58rem/1.4 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.sheet-nav span::before{content:"← "}
.sheet-nav .next span::before{content:""}
.sheet-nav .next span::after{content:" →"}
.sheet-nav b{font:600 .98rem/1.25 var(--serif);color:var(--ink);letter-spacing:-.005em}
.sheet-nav a:hover b{text-decoration:underline;text-decoration-color:var(--leafline);text-underline-offset:.18em}
.related{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.related a{display:flex;flex-direction:column;height:100%;background:var(--sheet);border:1px solid var(--line);border-radius:10px;text-decoration:none;color:inherit;overflow:hidden;box-shadow:var(--shadow-xs);transition:all .25s cubic-bezier(.16,1,.3,1)}
.related a:hover{border-color:var(--leafline);box-shadow:var(--shadow-md);transform:translateY(-3px)}
.related img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-bottom:1px solid var(--line);background:var(--panel);transition:transform .35s ease}
.related a:hover img{transform:scale(1.05)}
.related a>span{display:flex;flex-direction:column;gap:.2rem;padding:.9rem 1rem 1rem}
.related .nm{color:var(--ink);font:600 1.12rem/1.2 var(--serif)}
.related .latin{font-size:.92rem;color:var(--muted)}

/* ===== quote desk ===== */
.quote-head{padding-top:1.2rem}
.quote-intro{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(15rem,.55fr);gap:2rem clamp(2rem,5vw,4rem);align-items:end;padding-block:.6rem 2.4rem;border-bottom:1px solid var(--line)}
.quote-intro h1{margin:.55rem 0 .7rem}
.quote-intro .lede{max-width:40rem;font-size:1.04rem;color:var(--muted)}
.quote-note{padding:.2rem 0 .2rem 1.1rem;border-left:2px solid var(--leafline)}
.quote-note-k{margin:0 0 .35rem;font:500 .6rem/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--moss)}
.quote-note p:last-child{margin:0;font-size:.87rem;line-height:1.55;color:var(--muted)}
.quote-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(17rem,.65fr);gap:clamp(1.75rem,4vw,3.5rem);align-items:start;padding-block:2.4rem clamp(3rem,5vw,4rem)}
.form{display:grid;gap:1.5rem;max-width:none;padding:0;counter-reset:step}
fieldset{border:1px solid var(--line);border-radius:10px;background:var(--sheet);padding:1.6rem 1.6rem 1.7rem;margin:0;min-width:0;box-shadow:var(--shadow-xs)}
legend{counter-increment:step;display:flex;align-items:center;gap:.6rem;font:600 .72rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:transparent;padding:0 .55rem}
legend::before{content:counter(step,decimal-leading-zero);display:inline-grid;place-items:center;width:1.75rem;height:1.75rem;border-radius:50%;background:rgba(126,138,82,.15);border:1px solid var(--leafline);font-size:.66rem;font-weight:700;color:var(--moss-deep)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1.1rem}
.grid2>div{min-width:0}
fieldset>div+div{margin-top:1.1rem}
label{display:block;font-size:.88rem;font-weight:600;color:var(--ink);margin-bottom:.4rem}
label .opt{font-weight:400;color:var(--muted)}
input,select,textarea{width:100%;min-height:46px;font:400 1rem/1.4 var(--sans);color:var(--ink);background:#fff;border:1.5px solid #CDC5B2;border-radius:6px;padding:.6rem .8rem;box-shadow:inset 0 1px 2px rgba(0,0,0,.04);transition:all .2s ease}
textarea{min-height:6.5rem;resize:vertical}
input:hover,select:hover,textarea:hover{border-color:var(--leafline)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--moss);box-shadow:0 0 0 3.5px rgba(60,85,55,.18)}
.prow{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1.5fr) minmax(0,.85fr) minmax(0,.7fr) auto;gap:.75rem;align-items:end;padding:1rem 1.1rem;margin-bottom:.85rem;background:var(--paper);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow-xs)}
.prow input,.prow select{font-size:.94rem;padding:.5rem .6rem}
.prow:last-child{margin-bottom:0}
.prow .rm{min-height:46px;padding:0 1rem;background:#fff;border:1.5px solid var(--line);border-radius:6px;color:var(--muted);cursor:pointer;font:600 .74rem/1 var(--mono);transition:all .18s ease}
.prow .rm:hover{border-color:var(--red);background:#FFF5F3;color:var(--red)}
.checks{display:flex;flex-wrap:wrap;gap:.75rem 1.75rem;margin:1.15rem 0 0;padding-top:1rem;border-top:1px dotted var(--line)}
.checks label{display:flex;align-items:center;gap:.5rem;font-weight:400;margin:0;cursor:pointer}
.checks input{width:1.2rem;min-height:0;height:1.2rem;accent-color:var(--moss);cursor:pointer}
.add{margin-top:1.1rem;border-radius:6px;border-style:dashed}
.form .actions{margin-top:0;gap:.75rem}
.form .btn-ink{background:var(--moss-deep);border-color:var(--moss-deep);box-shadow:0 3px 10px rgba(38,58,36,.3)}
.form .btn-ink:hover{background:var(--moss-rich);color:var(--paper);box-shadow:0 6px 18px rgba(38,58,36,.4)}
.form a.btn[href*="wa.me"],.form button[data-via="wa"]{background:var(--wa-dark);border-color:var(--wa-dark);color:#fff;box-shadow:0 3px 12px -2px rgba(18,140,126,.35)}
.form a.btn[href*="wa.me"]:hover,.form button[data-via="wa"]:hover{background:var(--wa-deep);border-color:var(--wa-deep);color:#fff}
.form .btn-line:hover{background:var(--panel)}
.form-note{margin:0;padding-top:1.1rem;border-top:1px dotted var(--line);font-size:.84rem;line-height:1.6;color:var(--muted)}
.quote-side{display:grid;gap:1.2rem;position:sticky;top:5.5rem}
.side-card{padding:1.6rem 1.5rem;background:var(--sheet);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-xs)}
.side-card:first-child{background:linear-gradient(145deg,var(--moss-deep) 0%,var(--moss-rich) 100%);border-color:var(--moss-deep);color:var(--paper);box-shadow:var(--shadow-md)}
.side-card:first-child .kicker{color:var(--leafline);margin-bottom:.7rem}
.side-card:first-child .kicker::after{background:rgba(154,164,125,.55)}
.next-steps{counter-reset:n;list-style:none;display:grid;gap:1rem;margin:0;padding:0}
.next-steps li{counter-increment:n;position:relative;padding-left:2.45rem;font-size:.9rem;line-height:1.5;color:#E2DFD1}
.next-steps li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:-.02rem;z-index:1;display:grid;place-items:center;width:1.5rem;height:1.5rem;border:1px solid rgba(154,164,125,.6);border-radius:50%;background:var(--moss-deep);font:500 .56rem/1 var(--mono);letter-spacing:.02em;color:var(--leafline)}
.next-steps li:not(:last-child)::after{content:"";position:absolute;left:.74rem;top:1.55rem;bottom:-1.15rem;width:1px;background:rgba(154,164,125,.24)}
.next-steps b{display:block;font-weight:600;color:var(--paper)}
.side-contact .kicker{margin-bottom:.8rem}
.side-contact>a[href^="mailto"]{display:inline-block;margin-bottom:.7rem;border-bottom:1px solid var(--leafline);font:600 1.18rem/1.2 var(--serif);color:var(--ink);text-decoration:none}
.side-contact>a[href^="mailto"]:hover{color:var(--moss)}
.side-contact p{margin:0 0 .5rem;font-size:.88rem;line-height:1.5;color:var(--muted)}
.side-contact .btn{width:100%;margin-top:.8rem}
.side-note{margin:0;padding-left:.9rem;border-left:2px solid var(--leafline);font-size:.81rem;line-height:1.55;color:var(--muted)}
.side-note b{color:var(--ink);font-weight:600}

/* ===== legal ===== */
.legal-head{padding-block:1.2rem 2.4rem;border-bottom:1px solid var(--line)}
.legal-head h1{margin:.55rem 0 .6rem}
.legal-head .lede{max-width:40rem;font-size:1.04rem;color:var(--muted);margin:0}
.legal-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(16rem,.72fr);gap:clamp(2rem,4vw,4rem);align-items:start;padding-block:2.4rem clamp(3rem,5vw,4rem)}
.prose{max-width:none;padding:0}
.prose>h2{font-size:1.6rem;margin:0 0 1rem;padding-bottom:.65rem;border-bottom:1px solid var(--line)}
.prose h3{font-size:1.05rem;margin:1.7rem 0 .35rem}
.prose p{font-size:.97rem;line-height:1.65;color:var(--body);margin:0 0 .9rem}
.legal-note{margin:0 0 1.2rem;padding:.7rem .9rem;border-left:2px solid var(--leafline);background:var(--panel);font-size:.9rem;line-height:1.6;color:var(--muted)}
html[dir="rtl"] .legal-note{border-left:0;border-right:2px solid var(--leafline)}
.imprint{position:sticky;top:1.5rem;padding:1.35rem 1.3rem 1.4rem;background:var(--sheet);border:1px solid var(--line);border-top:2px solid var(--moss)}
.imprint .kicker{margin-bottom:.4rem}
.imprint h2{font-size:1.45rem;margin:.2rem 0 1rem}
.imprint dl{display:grid;gap:.7rem;margin:0}
.imprint dt{font:500 .6rem/1.3 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.imprint dd{margin:.18rem 0 0;padding-bottom:.65rem;border-bottom:1px dotted var(--line);font-size:.93rem;line-height:1.45;color:var(--body);overflow-wrap:anywhere}
.imprint dd:last-of-type{border-bottom:0;padding-bottom:0}
.imprint .btn{width:100%;margin-top:1rem}

/* ===== 404 ===== */
.notfound{display:grid;grid-template-columns:minmax(0,1fr) minmax(17rem,.62fr);gap:clamp(2rem,5vw,4rem);align-items:center;min-height:clamp(25rem,56vh,36rem);padding-block:clamp(3rem,6vw,5rem);border-top:1px solid var(--line)}
.nf-copy h1{margin:.6rem 0 .8rem}
.nf-copy .lede{max-width:33rem;font-size:1.05rem;color:var(--muted)}
.nf-art{position:relative;padding:1rem 0;text-align:right}
.nf-art::before{content:"";position:absolute;right:-1rem;bottom:-1rem;width:11rem;height:9rem;background:url(sprig.svg) right bottom/contain no-repeat;opacity:.55;pointer-events:none}
.nf-art span{position:relative;display:block;font:600 clamp(7rem,14vw,12rem)/.8 var(--serif);letter-spacing:-.06em;color:var(--panel);-webkit-text-stroke:1px var(--leafline)}
.nf-art i{position:relative;display:block;margin-top:1.2rem;font:500 .61rem/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-style:normal}

/* buyer questions */
.faq-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.faq-intro{position:sticky;top:1.5rem}
.faq-intro .sec-lede{max-width:24rem}
.faq-cta{margin:1.5rem 0 0;padding-top:1rem;border-top:1px solid var(--line);font-size:.9rem;line-height:1.6;color:var(--muted)}
.faq-cta a{color:var(--ink);font-weight:600;text-decoration:none;border-bottom:1px solid var(--leafline);padding-bottom:.08rem}
.faq-cta a:hover{color:var(--moss);border-bottom-color:var(--moss)}
.buyer-faq{border-top:0}
.buyer-faq details{margin-bottom:.85rem;background:var(--sheet);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow-xs);transition:all .22s ease;overflow:hidden}
.buyer-faq details:hover{border-color:var(--leafline);box-shadow:var(--shadow-sm)}
.buyer-faq details[open]{border-color:var(--moss);background:#fff;box-shadow:var(--shadow-md)}
.buyer-faq summary{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.15rem 1.35rem;cursor:pointer;list-style:none;font:600 1.15rem/1.35 var(--serif);color:var(--ink);transition:color .2s ease}
.buyer-faq summary::-webkit-details-marker{display:none}
.buyer-faq summary::after{content:"";flex:none;width:1.8rem;height:1.8rem;border:1.5px solid var(--line);border-radius:50%;background:linear-gradient(var(--moss),var(--moss)) center/10px 2px no-repeat,linear-gradient(var(--moss),var(--moss)) center/2px 10px no-repeat;transition:all .25s cubic-bezier(.16,1,.3,1)}
.buyer-faq details:hover summary::after{border-color:var(--moss);background-color:rgba(126,138,82,.1)}
.buyer-faq details[open] summary{color:var(--moss)}
.buyer-faq details[open] summary::after{transform:rotate(45deg);border-color:var(--moss);background:var(--moss);background-image:linear-gradient(var(--paper),var(--paper)),linear-gradient(var(--paper),var(--paper));background-position:center;background-size:10px 2px,2px 10px;background-repeat:no-repeat}
.faq-a{padding:0 1.35rem 1.35rem 1.35rem}
.faq-a p{margin:0;max-width:44rem;font-size:.98rem;line-height:1.65;color:var(--body)}

/* ===== footer ===== */
.site-foot{border-top:1px solid var(--line);background:var(--sheet);font-size:.92rem}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(8.5rem,.52fr) minmax(0,1.3fr);gap:2.2rem clamp(2rem,4vw,3.5rem);padding-block:clamp(2.6rem,4.5vw,3.5rem) clamp(1.9rem,3.4vw,2.6rem)}
.site-foot h2{font:500 .64rem/1.4 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--moss);margin:0 0 .9rem}
.foot-brand h2{font:600 1.7rem/1 var(--serif);letter-spacing:-.015em;text-transform:none;color:var(--ink);margin-bottom:.55rem}
.foot-brand>p{max-width:24rem;margin:0;font-size:.91rem;line-height:1.6;color:var(--muted)}
.foot-contact{list-style:none;margin:1.1rem 0 0;padding:0;border-top:1px solid var(--line)}
.foot-contact li{display:grid;grid-template-columns:4.5rem minmax(0,1fr);align-items:baseline;gap:.7rem;padding:.5rem 0;border-bottom:1px dotted var(--line)}
.foot-contact .k{font:500 .58rem/1.45 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--moss)}
.foot-contact a{color:var(--ink);text-decoration:none;overflow-wrap:anywhere}
.foot-contact a:hover{color:var(--moss);text-decoration:underline;text-underline-offset:.15em}
.foot-cta{margin-top:1.1rem}
.foot-nav ul,.foot-products ul{list-style:none;margin:0;padding:0}
.foot-nav a{display:inline-block;padding:.3rem 0;color:var(--body);text-decoration:none}
.foot-nav a:hover{color:var(--moss);text-decoration:underline;text-underline-offset:.15em}
.foot-products .cols{columns:2;column-gap:1.75rem;margin-top:.2rem}
.foot-products .cols li{break-inside:avoid;padding:.22rem 0}
.foot-products a{color:var(--body);text-decoration:none}
.foot-products a:hover{color:var(--moss);text-decoration:underline;text-underline-offset:.15em}
.foot-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.4rem 1.5rem;padding-block:1rem 1.15rem;border-top:1px solid var(--line);font-size:.76rem;line-height:1.5;color:var(--muted)}
.foot-foot p{margin:0}
.to-top{color:var(--moss);text-decoration:none;font:500 .68rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.to-top:hover{color:var(--ink);text-decoration:underline;text-underline-offset:.2em}
.foot-lang{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.25rem;padding-block:1.25rem;border-top:1px solid var(--line)}
.foot-lang .k{font:600 .62rem/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--moss)}
.foot-lang ul{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .6rem;list-style:none;margin:0;padding:0}
.foot-lang a{display:inline-flex;align-items:center;padding:.28rem .75rem;border-radius:999px;border:1px solid rgba(214,207,189,.8);background:var(--paper);color:var(--body);text-decoration:none;font-size:.82rem;line-height:1.4;transition:all .18s ease}
.foot-lang a:hover{background:#fff;border-color:var(--moss);color:var(--moss);transform:translateY(-1px);box-shadow:var(--shadow-xs);text-decoration:none}
.foot-lang a[aria-current="page"]{background:var(--moss);border-color:var(--moss);color:var(--paper);font-weight:600;box-shadow:0 2px 6px rgba(60,85,55,.25);border-bottom:1px solid var(--moss)}
.foot-lang+.foot-foot{border-top:0}

/* phone bar on product pages */
.phonebar{display:none}

/* ===== responsive ===== */
@media (max-width:1120px){
  .order-grid{grid-template-columns:1fr}
  .order-note{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0 2rem;align-items:start}
  .order-note .kicker,.order-note h3{grid-column:1}
  .order-note dl{grid-column:2;grid-row:1/span 3;padding-top:0;border-top:0}
  .order-note .btn{grid-column:1;margin-top:.4rem}
}
@media (max-width:900px){
  .trade-rail ul{grid-template-columns:1fr 1fr}
  .trade-rail li{padding:1.15rem 1.1rem;border-left:1px solid rgba(247,244,236,.16);border-top:1px solid rgba(247,244,236,.16)}
  .trade-rail li:nth-child(odd){border-left:0;padding-left:0}
  .trade-rail li:nth-child(-n+2){border-top:0}
  .rules{grid-template-columns:1fr;padding-inline:1.2rem}
  .rules li{padding:1.4rem 0;border-right:0;border-bottom:1px solid var(--line)}
  .rules li+li{padding-left:0}
  .rules li:last-child{border-bottom:0;padding-right:0}
  .pledge-top,.pledge-foot{padding-inline:1.2rem}
  .quote-grid{grid-template-columns:1fr}
  .quote-side{position:static;grid-template-columns:1fr 1fr;align-items:start}
  .side-note{grid-column:1/-1}
  .faq-split{grid-template-columns:1fr;gap:1.75rem}
  .faq-intro{position:static}
  .faq-intro .sec-lede,.faq-cta{max-width:38rem}
  .legal-grid{grid-template-columns:1fr}
  .imprint{position:static;max-width:34rem}
  .notfound{grid-template-columns:1fr;min-height:0}
  .nf-art{text-align:left;padding-top:0}
  .nf-art::before{right:0;left:auto;width:8rem;height:6rem;opacity:.4}
}
@media (max-width:860px){
  .p-body{grid-template-columns:1fr}
  .aside{position:static;grid-template-columns:1fr 1fr;align-items:start}
  .label{max-width:20rem}
  .foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:2rem 2.5rem}
  .foot-brand{grid-column:1/-1}
  .foot-brand>p{max-width:34rem}
  .foot-nav a,.foot-products a{display:flex;align-items:center;min-height:2.75rem}
  .foot-products .cols li{padding:0}
  .quote-intro{grid-template-columns:1fr;align-items:start}
  .quote-note{max-width:30rem}
}
@media (max-width:760px){
  .sec{padding-block:clamp(2.4rem,6vw,3.2rem)}
  .p-top{grid-template-columns:1fr}
  .p-top .photo{max-width:30rem}
  .index-head{display:none}
  .row{grid-template-columns:4.5rem minmax(0,1fr) 1.9rem;grid-template-areas:"img id go" "img sp go";gap:.2rem .9rem;padding:.8rem .1rem}
  .row img{width:4.5rem;height:4.5rem;padding:.2rem}
  .row .no{display:none}
  .row .nm{font-size:1.16rem}
  .row .sp{font-size:.85rem}
  .row .go{width:1.9rem;height:1.9rem;font-size:.9rem}
  .cert{grid-template-columns:1fr}
  .cert>div+div{border-left:0;border-top:1px solid var(--line)}
  .docket-foot{flex-wrap:wrap;gap:1rem}
  .docket-foot p{flex:1 1 14rem}
  .quote-side{grid-template-columns:1fr}
  .side-note{grid-column:auto}
  .prow{grid-template-columns:1fr 1fr}
  .prow .p-prod{grid-column:1/-1}
  .prow>div:nth-child(2){grid-column:1/-1}
  .prow .rm{grid-column:1/-1;justify-self:start}
  .has-phonebar{padding-bottom:calc(4.8rem + env(safe-area-inset-bottom,0px))}
  .phonebar{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;position:fixed;left:0;right:0;bottom:0;z-index:5;background:var(--paper);border-top:1.5px solid var(--ink);padding:.6rem 1rem calc(.6rem + env(safe-area-inset-bottom,0px));box-shadow:0 -14px 30px -26px rgba(29,27,22,.8)}
  .phonebar .btn{width:100%}
}
@media (max-width:640px){
  .sec-head{margin-bottom:1.5rem}
  .steps{grid-template-columns:1fr}
  .order-note{display:block;padding:1.4rem 1.3rem}
  .order-note dl{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(247,244,236,.18)}
  .order-note .btn{margin-top:1.1rem}
  .langs{grid-template-columns:1fr}
  .related{grid-template-columns:1fr 1fr}
  .aside{grid-template-columns:1fr}
  .p-top .actions{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
  .p-top .actions .btn{width:100%;padding-inline:.55rem;font-size:.88rem}
  .p-top .actions .btn:last-child{grid-column:1/-1}
  .assurance{gap:.55rem;margin-top:1.25rem;padding-top:.8rem}
  .assurance b{font-size:.9rem}
  .assurance span{font-size:.52rem;letter-spacing:.05em}
  .label{justify-self:start}
  .trade-rail b{font-size:1rem}
  .trade-rail .v{font-size:.74rem}
  .quote-grid{padding-top:1.8rem}
  .side-card{padding:1.2rem 1.15rem}
  .legal-grid{padding-top:1.8rem}
  .nf-art span{font-size:clamp(6rem,22vw,9rem)}
  .foot-grid{grid-template-columns:1fr;gap:1.8rem}
  .foot-nav ul{display:grid;grid-template-columns:1fr 1fr;column-gap:1.5rem}
  .foot-brand>p{max-width:32rem}
}
@media (max-width:520px){
  .trade-rail .v{display:none}
  .trade-rail b{font-size:.95rem}
  .trade-rail li{padding-block:1rem}
  .band .actions{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:.6rem}
  .band .actions .btn{width:100%}
  .band .actions .btn-ink{grid-column:1/-1}
  .sec-lede{font-size:.96rem}
  .docket-top,.cert>div{padding-inline:1.1rem}
  .docket-foot{padding:1rem 1.1rem}
  .cert-stamp{width:4.7rem;height:4.7rem;font-size:.48rem}
  .foot-products .cols{columns:1}
  .quote-intro{padding-bottom:1.8rem}
  .form .actions .btn{width:100%}
  .related{grid-template-columns:1fr}
}
@media (max-width:400px){
  .row{grid-template-columns:3.9rem minmax(0,1fr) 1.8rem;gap:.2rem .75rem}
  .row img{width:3.9rem;height:3.9rem}
  .row .nm{font-size:1.08rem}
  .row .latin{font-size:.94rem}
  .trade-rail li{padding-inline:.8rem}
  .order-note{padding:1.25rem 1.1rem}
  .steps li{padding:1.3rem 1.2rem 1.4rem}
  .nf-copy .actions .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .row img,.row::before,.row .go,.related img,.buyer-faq summary::after{transition:none}
  .row:hover img{transform:none}
  .row:hover .go{transform:none}
  .related a{transition:none}
  .related a:hover img{transform:none}
}

/* ===== right-to-left (Arabic) ===== */
html[dir="rtl"] .latin,html[dir="rtl"] .latin-big,html[dir="rtl"] .foot-contact a,html[dir="rtl"] .side-contact a,html[dir="rtl"] a[href^="mailto:"]{unicode-bidi:isolate}
html[dir="rtl"] .spec th,html[dir="rtl"] .spec td{unicode-bidi:plaintext}
html[dir="rtl"] input,html[dir="rtl"] textarea{text-align:right}
html[dir="rtl"] .foot-lang ul{justify-content:flex-start}
html[dir="rtl"] .nav-left{grid-area:navr;justify-self:start;padding-right:0;padding-left:clamp(.5rem,1.6vw,1.4rem)}
html[dir="rtl"] .nav-right{grid-area:navl;justify-self:end;padding-left:0;padding-right:clamp(.5rem,1.6vw,1.4rem)}
html[dir="rtl"] .sprig-l{right:auto;left:100%;transform:none}
html[dir="rtl"] .sprig-r{left:auto;right:100%;transform:scaleX(-1)}
html[dir="rtl"] .skip{left:auto;right:-999px}
html[dir="rtl"] .skip:focus{left:auto;right:1rem}
html[dir="rtl"] .hero2{background:radial-gradient(58% 80% at 12% 34%,rgba(126,138,82,.14),transparent 68%),var(--paper)}
html[dir="rtl"] .hero2 h1{letter-spacing:0}
html[dir="rtl"] .plate{right:auto;left:1.1rem;transform:rotate(1.3deg)}
html[dir="rtl"] .slip{left:auto;right:1rem;transform:rotate(-1.5deg)}
html[dir="rtl"] .slip-stamp{right:auto;left:-.7rem;transform:rotate(10deg)}
html[dir="rtl"] .vert-label{display:none}
html[dir="rtl"] .turn-hint,html[dir="rtl"] .turn-reset{right:auto;left:.75rem}
html[dir="rtl"] .stamp{transform:rotate(3deg)}
html[dir="rtl"] .label{transform:rotate(1.2deg)}
html[dir="rtl"] .cert-stamp,html[dir="rtl"] .pledge-seal{transform:rotate(7deg)}
html[dir="rtl"] .trade-rail li{border-left:0;border-right:1px solid rgba(247,244,236,.16);padding-right:clamp(.9rem,2.2vw,1.6rem);padding-left:clamp(.9rem,2.2vw,1.6rem)}
html[dir="rtl"] .trade-rail li:first-child{border-right:0;padding-right:0}
html[dir="rtl"] .row::before{left:auto;right:0;border-radius:3px 0 0 3px}
html[dir="rtl"] .row:hover .go{transform:translateX(-3px)}
html[dir="rtl"] .cert li::before{left:auto;right:0}
html[dir="rtl"] .cert li{padding-left:0;padding-right:1.85rem}
html[dir="rtl"] .steps{border-left:0;border-right:1px solid var(--line)}
html[dir="rtl"] .steps li{border-right:0;border-left:1px solid var(--line)}
html[dir="rtl"] .steps li::after{right:auto;left:1.4rem}
html[dir="rtl"] .order-note::before,html[dir="rtl"] .order-note::after{right:auto;left:-3rem}
html[dir="rtl"] .order-note::after{left:-1rem}
html[dir="rtl"] .cert>div+div{border-left:0;border-right:1px solid var(--line)}
html[dir="rtl"] .cert li{padding-left:0;padding-right:1.65rem}
html[dir="rtl"] .cert li::before{left:auto;right:0;padding-right:0}
html[dir="rtl"] .rules li{border-right:0;border-left:1px solid var(--line);padding:1.6rem .1rem 1.75rem 1.6rem}
html[dir="rtl"] .rules li+li{padding-left:1.6rem;padding-right:.1rem}
html[dir="rtl"] .rules li:last-child{border-left:0;padding-left:.1rem}
html[dir="rtl"] .faq .qa{padding-left:0;padding-right:2.6rem}
html[dir="rtl"] .faq .qa::before{left:auto;right:0}
html[dir="rtl"] .spec th,html[dir="rtl"] .spec td{text-align:right}
html[dir="rtl"] .sheet-nav .next{justify-self:end;text-align:left}
html[dir="rtl"] .sheet-nav span::before{content:""}
html[dir="rtl"] .sheet-nav a:not(.next) span::before{content:"→ "}
html[dir="rtl"] .sheet-nav .next span::after{content:" ←"}
html[dir="rtl"] .quote-note{padding-left:0;padding-right:1.1rem;border-left:0;border-right:2px solid var(--leafline)}
html[dir="rtl"] .side-note{padding-left:0;padding-right:.9rem;border-left:0;border-right:2px solid var(--leafline)}
html[dir="rtl"] .next-steps li{padding-left:0;padding-right:2.45rem}
html[dir="rtl"] .next-steps li::before{left:auto;right:0}
html[dir="rtl"] .next-steps li:not(:last-child)::after{left:auto;right:.74rem}
html[dir="rtl"] .ask::after{right:auto;left:-2.5rem;transform:scaleX(-1)}
html[dir="rtl"] .band::before{right:auto;left:-6rem}
html[dir="rtl"] .band::after{right:auto;left:clamp(1rem,4vw,4rem);transform:scaleX(-1) rotate(-8deg)}
html[dir="rtl"] .nf-art::before{right:auto;left:-1rem;transform:scaleX(-1)}
html[dir="rtl"] .foot-products .cols{column-gap:1.75rem}
@media (max-width:1120px){
  html[dir="rtl"] .plate{left:.9rem;right:auto}
  html[dir="rtl"] .slip{right:.8rem;left:auto}
}
@media (max-width:900px){
  html[dir="rtl"] .rules li{padding:1.4rem 0;border-left:0}
  html[dir="rtl"] .trade-rail li{border-right:1px solid rgba(247,244,236,.16);border-left:1px solid rgba(247,244,236,.16)}
  html[dir="rtl"] .trade-rail li:nth-child(odd){border-right:0;padding-right:0;border-left:1px solid rgba(247,244,236,.16);padding-left:1.1rem}
  html[dir="rtl"] .trade-rail li:nth-child(even){border-left:0}
  html[dir="rtl"] .trade-rail li:nth-child(-n+2){border-top:0}
}
@media (max-width:640px){
  html[dir="rtl"] .plate{left:.7rem;right:auto}
  html[dir="rtl"] .slip{right:.7rem;left:auto}
  html[dir="rtl"] .navrow{direction:rtl}
}
@media print{
  .foot-lang{display:none}
}
@media print{
  .site-head nav,.phonebar,.band,.ask .actions,.quote-side,.sheet-nav{display:none}
  .label,.photo,.docket{box-shadow:none}
  .label{transform:none}
  .ask{background:none;color:var(--ink);border:1px solid var(--ink);box-shadow:none}
  .ask h2,.ask h2::before{color:var(--ink)}
  .ask p{color:var(--body)}
  .photo figcaption::before{color:var(--muted)}
}


/* ===== Vector Icons & Micro-Interactions ===== */
a.btn[href*="wa.me"]::before, button[data-via="wa"]::before {
  content: "";
  display: inline-block;
  width: 1.15rem;
  height: 1.15rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12.04 2c-5.46 0-9.91 4.45-9.91 9.91 0 1.75.46 3.45 1.32 4.95L2.05 22l5.25-1.38c1.45.79 3.08 1.21 4.74 1.21 5.46 0 9.91-4.45 9.91-9.91 0-2.65-1.03-5.14-2.9-7.01A9.82 9.82 0 0 0 12.04 2zm.01 1.67c2.2 0 4.26.86 5.82 2.41a8.17 8.17 0 0 1 2.41 5.83c0 4.54-3.7 8.24-8.24 8.24-1.48 0-2.93-.4-4.2-1.15l-.3-.18-3.12.82.83-3.04-.2-.31a8.19 8.19 0 0 1-1.26-4.38c0-4.54 3.7-8.24 8.24-8.24zm4.52 11.64c-.25-.12-1.47-.72-1.7-.8-.23-.09-.39-.12-.56.12-.17.25-.65.8-.8 1-.15.15-.3.17-.55.05-.25-.12-1.05-.39-2-1.23-.74-.66-1.24-1.47-1.39-1.72-.15-.25-.02-.38.11-.5.11-.11.25-.29.37-.43.12-.15.17-.25.25-.42.08-.17.04-.32-.02-.45-.06-.12-.56-1.35-.77-1.85-.2-.49-.41-.42-.56-.43h-.48c-.17 0-.45.06-.68.32-.23.25-.89.87-.89 2.12s.91 2.46 1.04 2.63c.12.17 1.79 2.73 4.33 3.83.6.26 1.08.42 1.45.53.61.19 1.16.17 1.6.1.49-.07 1.47-.6 1.68-1.18.21-.58.21-1.07.15-1.18-.06-.11-.22-.17-.47-.3z'/%3E%3C/svg%3E") no-repeat center/contain;
  flex: none;
}
a.btn[href^="mailto:"]::before, button[data-via="email"]::before {
  content: "";
  display: inline-block;
  width: 1.1rem;
  height: 1.1rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D1B16' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E") no-repeat center/contain;
  flex: none;
}
.band a.btn[href^="mailto:"]::before, .ask a.btn[href^="mailto:"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F7F4EC' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
}
a.btn-ink[href*="quote"]::after {
  content: "→";
  font-family: var(--mono);
  font-weight: 600;
  display: inline-block;
  margin-left: 0.2rem;
  transition: transform 0.2s ease;
}
a.btn-ink[href*="quote"]:hover::after {
  transform: translateX(3px);
}
html[dir="rtl"] a.btn-ink[href*="quote"]::after {
  content: "←";
  margin-left: 0;
  margin-right: 0.2rem;
}
html[dir="rtl"] a.btn-ink[href*="quote"]:hover::after {
  transform: translateX(-3px);
}

/* Polished Sticky Header Scroll Effect */
.site-head {
  transition: background-color .25s ease, box-shadow .25s ease, padding .25s ease;
}

/* Enhanced Focus State */
:focus-visible {
  outline: 2.5px solid var(--moss);
  outline-offset: 2px;
}

/* Polished Card Hover Elevate */
.side-card {
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.side-card:hover {
  border-color: var(--leafline);
  box-shadow: var(--shadow-sm);
}

/* Mobile Phonebar refinement */
@media (max-width:760px) {
  .phonebar {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .65rem;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 95;
    background: rgba(247,244,236,.96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid var(--line);
    padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom,0px));
    box-shadow: 0 -8px 25px -8px rgba(29,27,22,.18);
  }
}


/* ==========================================================================
   MASTER UI POLISH & LUXURY BOTANICAL UPGRADE
   ========================================================================== */

/* Refined Global Shadows & Transitions */
:root {
  --shadow-xs: 0 1px 3px rgba(29,27,22,.04);
  --shadow-sm: 0 3px 10px -2px rgba(29,27,22,.06), 0 1px 3px rgba(29,27,22,.03);
  --shadow-md: 0 12px 28px -6px rgba(38,58,36,.10), 0 3px 8px -2px rgba(29,27,22,.04);
  --shadow-lg: 0 22px 48px -12px rgba(38,58,36,.16), 0 6px 16px -3px rgba(29,27,22,.05);
}

/* Glassmorphism Sticky Masthead */
.site-head {
  background: rgba(247, 244, 236, 0.94) !important;
  backdrop-filter: blur(18px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
  border-bottom: 1px solid rgba(214, 207, 189, 0.8) !important;
  box-shadow: 0 4px 20px -6px rgba(29, 27, 22, 0.06) !important;
}

.site-head nav a {
  position: relative;
  font-weight: 500;
  padding: 0.45rem 0.75rem;
  border-radius: 6px;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

.site-head nav a:hover {
  color: var(--moss-deep) !important;
  background: rgba(60, 85, 55, 0.05);
}

.site-head nav a::after {
  content: "";
  position: absolute;
  bottom: 0.15rem;
  left: 0.75rem;
  right: 0.75rem;
  height: 2px;
  background: var(--moss);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  border-radius: 2px;
}

.site-head nav a:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* Modern Logo Seal Presentation */
.mast-crest {
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), filter 0.35s ease;
}
.mast-crest:hover {
  transform: scale(1.05);
  filter: drop-shadow(0 6px 14px rgba(38, 58, 36, 0.18));
}

/* Luxury 360 Turntable Plate Card */
.photo {
  position: relative !important;
  padding: 1.15rem 1.15rem 0 !important;
  background: var(--sheet) !important;
  border: 1px solid rgba(196, 189, 172, 0.95) !important;
  border-radius: 14px !important;
  box-shadow: 0 20px 46px -12px rgba(38, 58, 36, 0.14), 0 6px 16px -3px rgba(29, 27, 22, 0.05) !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.photo:hover {
  box-shadow: 0 26px 56px -12px rgba(38, 58, 36, 0.18), 0 8px 20px -3px rgba(29, 27, 22, 0.06) !important;
}

.photo::before {
  border: 1px solid rgba(90, 86, 75, 0.14) !important;
  border-radius: 10px !important;
}

.photo .plate-window {
  border-radius: 10px !important;
  background: radial-gradient(circle at 50% 48%, #FAF8F2 0%, #EBE6D6 100%) !important;
  border: 1px solid rgba(214, 207, 189, 0.7) !important;
  cursor: grab !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

.photo .plate-window:active,
.photo .plate-window.is-turning {
  cursor: grabbing !important;
}

/* Polished Turntable Hints & Reset Buttons */
.turn-hint {
  font-family: var(--sans) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  padding: 0.42rem 0.78rem !important;
  background: rgba(251, 249, 243, 0.96) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(60, 85, 55, 0.32) !important;
  border-radius: 999px !important;
  color: var(--moss-deep) !important;
  box-shadow: 0 4px 14px rgba(29, 27, 22, 0.08) !important;
}

.turn-reset {
  font-family: var(--sans) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  padding: 0.42rem 0.82rem !important;
  background: rgba(251, 249, 243, 0.96) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(124, 74, 0, 0.4) !important;
  border-radius: 999px !important;
  color: var(--tur) !important;
  box-shadow: 0 4px 14px rgba(124, 74, 0, 0.12) !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.turn-reset:hover {
  background: #fff !important;
  border-color: var(--tur) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(124, 74, 0, 0.22) !important;
}

.photo figcaption {
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  padding: 0.85rem 0.4rem 0.95rem !important;
  border-top: 1px solid rgba(214, 207, 189, 0.6) !important;
  margin-top: 0.75rem !important;
}

.photo figcaption::before {
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  color: var(--moss-deep) !important;
}

/* Premium Buttons & Call to Actions */
.btn {
  border-radius: 8px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
  transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn:active {
  transform: scale(0.98) translateY(0) !important;
}

a.btn[href*="wa.me"], button[data-via="wa"] {
  background: linear-gradient(135deg, #25D366 0%, #128C7E 100%) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 16px -2px rgba(18, 140, 126, 0.38) !important;
}

a.btn[href*="wa.me"]:hover, button[data-via="wa"]:hover {
  background: linear-gradient(135deg, #2ae36e 0%, #0e7368 100%) !important;
  box-shadow: 0 8px 24px -4px rgba(18, 140, 126, 0.52) !important;
  transform: translateY(-2px) !important;
}

a.btn[href^="mailto:"], button[data-via="email"] {
  background: var(--sheet) !important;
  border: 1.5px solid rgba(90, 86, 75, 0.4) !important;
  color: var(--ink) !important;
  box-shadow: 0 2px 8px rgba(29, 27, 22, 0.04) !important;
}

a.btn[href^="mailto:"]:hover, button[data-via="email"]:hover {
  background: #fff !important;
  border-color: var(--moss) !important;
  color: var(--moss-deep) !important;
  box-shadow: 0 6px 18px -3px rgba(38, 58, 36, 0.16) !important;
  transform: translateY(-2px) !important;
}

.actions a[href*="quote"], .btn-ink {
  background: linear-gradient(135deg, var(--moss-deep) 0%, #192718 100%) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 16px -2px rgba(38, 58, 36, 0.32) !important;
}

.actions a[href*="quote"]:hover, .btn-ink:hover {
  background: linear-gradient(135deg, #324e30 0%, var(--moss-deep) 100%) !important;
  box-shadow: 0 8px 24px -4px rgba(38, 58, 36, 0.48) !important;
  transform: translateY(-2px) !important;
}

/* Polished Product Index Cards (Catalog) */
.row {
  border-radius: 12px !important;
  border: 1px solid rgba(214, 207, 189, 0.8) !important;
  padding: 1.05rem 1.4rem !important;
  background: var(--sheet) !important;
  box-shadow: 0 3px 10px -2px rgba(29, 27, 22, 0.04) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.row:hover {
  background: #ffffff !important;
  border-color: var(--leafline) !important;
  box-shadow: 0 14px 32px -8px rgba(38, 58, 36, 0.14), 0 3px 8px -2px rgba(29, 27, 22, 0.04) !important;
  transform: translateY(-3px) !important;
}

.row img {
  border-radius: 8px !important;
  border: 1px solid rgba(214, 207, 189, 0.7) !important;
  box-shadow: 0 2px 6px rgba(29, 27, 22, 0.05) !important;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.row:hover img {
  transform: scale(1.06) !important;
}

.row .go {
  width: 2.3rem !important;
  height: 2.3rem !important;
  border-radius: 50% !important;
  background: rgba(126, 138, 82, 0.12) !important;
  color: var(--moss-deep) !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.row:hover .go {
  background: var(--moss) !important;
  color: #ffffff !important;
  transform: translateX(4px) !important;
}

html[dir="rtl"] .row:hover .go {
  transform: translateX(-4px) !important;
}

/* Specification Sheet Table Polish */
.spec {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  border: 1px solid var(--line) !important;
  background: var(--sheet) !important;
  box-shadow: 0 3px 10px rgba(29, 27, 22, 0.03) !important;
}

.spec th, .spec td {
  padding: 0.9rem 1.15rem !important;
  border-bottom: 1px solid var(--line-subtle) !important;
  transition: background-color 0.2s ease !important;
}

.spec tr:last-child th, .spec tr:last-child td {
  border-bottom: none !important;
}

.spec tr:nth-child(even) th, .spec tr:nth-child(even) td {
  background: rgba(237, 232, 218, 0.3) !important;
}

.spec tr:hover th, .spec tr:hover td {
  background: rgba(126, 138, 82, 0.09) !important;
}

.spec th {
  font-weight: 600 !important;
  color: var(--muted) !important;
}

.spec td {
  color: var(--ink) !important;
}

.spec .latin {
  font-family: var(--serif) !important;
  font-style: italic !important;
  font-size: 1.05rem !important;
  color: var(--moss-deep) !important;
}

/* FAQ Questions Cards Polish */
.faq .qa {
  position: relative !important;
  padding: 1.35rem 1.5rem !important;
  margin-bottom: 1.1rem !important;
  background: var(--sheet) !important;
  border: 1px solid var(--line) !important;
  border-left: 4px solid var(--moss) !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 8px rgba(29, 27, 22, 0.03) !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

html[dir="rtl"] .faq .qa {
  border-left: 1px solid var(--line) !important;
  border-right: 4px solid var(--moss) !important;
}

.faq .qa:hover {
  transform: translateX(4px) !important;
  border-left-color: var(--leaf) !important;
  box-shadow: 0 8px 22px -4px rgba(38, 58, 36, 0.10) !important;
  background: #ffffff !important;
}

html[dir="rtl"] .faq .qa:hover {
  transform: translateX(-4px) !important;
  border-right-color: var(--leaf) !important;
}

.faq .qa h3 {
  margin: 0 0 0.55rem !important;
  font-size: 1.12rem !important;
  font-weight: 600 !important;
  color: var(--ink) !important;
}

.faq .qa p {
  margin: 0 !important;
  line-height: 1.65 !important;
  color: var(--body) !important;
}

/* Trade Rail Facts Ribbon */
.trade-rail {
  background: linear-gradient(135deg, #1b2c1a 0%, #253923 50%, #1e311c 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 24px -6px rgba(27, 44, 26, 0.28) !important;
}

.trade-rail li b {
  color: #fff !important;
  font-weight: 600 !important;
}

/* Steps (Order Flow) Cards */
.steps li {
  background: var(--sheet) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  padding: 1.6rem 1.45rem !important;
  box-shadow: 0 3px 10px rgba(29, 27, 22, 0.03) !important;
  transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.steps li:hover {
  transform: translateY(-3px) !important;
  border-color: var(--leafline) !important;
  box-shadow: 0 12px 28px -6px rgba(38, 58, 36, 0.12) !important;
  background: #ffffff !important;
}

/* Language Switcher Footer Badges */
.foot-lang ul {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
}

.foot-lang a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.38rem 0.82rem !important;
  border-radius: 999px !important;
  border: 1px solid var(--line) !important;
  background: var(--sheet) !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  color: var(--muted) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.foot-lang a:hover {
  border-color: var(--moss) !important;
  color: var(--moss-deep) !important;
  background: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 3px 8px rgba(38, 58, 36, 0.12) !important;
}

.foot-lang a[aria-current="page"] {
  background: var(--moss) !important;
  color: #ffffff !important;
  border-color: var(--moss) !important;
  font-weight: 600 !important;
  box-shadow: 0 3px 10px rgba(60, 85, 55, 0.32) !important;
}

/* CTA Band Finish */
.band {
  background: linear-gradient(135deg, #1b2c1a 0%, #283e25 100%) !important;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.18), 0 12px 32px -6px rgba(27, 44, 26, 0.3) !important;
}


/* ==========================================================================
   PURE CSS UI/UX ENHANCEMENTS (ZERO JAVASCRIPT)
   ========================================================================== */

/* 1. Buttery Smooth Anchor Scrolling & Header Offsets */
html {
  scroll-behavior: smooth !important;
}

:target, section[id], div[id] {
  scroll-margin-top: 5.5rem !important;
}

/* 2. Custom Bespoke Botanical Scrollbar */
::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}
::-webkit-scrollbar-track {
  background: var(--paper);
}
::-webkit-scrollbar-thumb {
  background: rgba(90, 86, 75, 0.25);
  border-radius: 999px;
  border: 2px solid var(--paper);
  transition: background-color 0.22s ease;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--moss);
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(90, 86, 75, 0.28) var(--paper);
}

/* 3. Pure CSS Brand Selection Highlight */
::selection {
  background: rgba(60, 85, 55, 0.22) !important;
  color: var(--ink) !important;
}
::-moz-selection {
  background: rgba(60, 85, 55, 0.22) !important;
  color: var(--ink) !important;
}

/* 4. Luxury Button Shimmer & Sheen (Pure CSS Keyframe Animation) */
a.btn[href*="wa.me"], 
button[data-via="wa"], 
.actions a[href*="quote"], 
.btn-ink {
  position: relative !important;
  overflow: hidden !important;
}

a.btn[href*="wa.me"]::after, 
button[data-via="wa"]::after, 
.actions a[href*="quote"]::after, 
.btn-ink::after {
  content: "" !important;
  position: absolute !important;
  top: -50% !important;
  left: -60% !important;
  width: 220% !important;
  height: 200% !important;
  background: linear-gradient(60deg, transparent 40%, rgba(255, 255, 255, 0.26) 50%, transparent 60%) !important;
  transform: rotate(25deg) translateY(-100%) !important;
  transition: transform 0.75s cubic-bezier(0.16, 1, 0.3, 1) !important;
  pointer-events: none !important;
}

a.btn[href*="wa.me"]:hover::after, 
button[data-via="wa"]:hover::after, 
.actions a[href*="quote"]:hover::after, 
.btn-ink:hover::after {
  transform: rotate(25deg) translateY(100%) !important;
}

/* 5. Pure CSS Turntable "Hint Pulse" Breathing Animation */
@keyframes hint-pulse {
  0%, 100% {
    box-shadow: 0 4px 14px rgba(29, 27, 22, 0.08), 0 0 0 0 rgba(60, 85, 55, 0.45);
  }
  50% {
    box-shadow: 0 4px 14px rgba(29, 27, 22, 0.08), 0 0 0 7px rgba(60, 85, 55, 0);
  }
}

.turn-hint {
  animation: hint-pulse 2.8s cubic-bezier(0.16, 1, 0.3, 1) infinite !important;
}

/* 6. Live "Active Availability" Indicator (Pure CSS) */
.meta > div:first-child b::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #25D366;
  margin-right: 0.4rem;
  box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
  animation: live-pulse 2s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  vertical-align: 1px;
}

html[dir="rtl"] .meta > div:first-child b::before {
  margin-right: 0;
  margin-left: 0.4rem;
}

@keyframes live-pulse {
  0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }
  70% { box-shadow: 0 0 0 6px rgba(37, 211, 102, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

/* 7. Pure CSS Form UX for Quote Desk & Inquiries */
input[type="text"], 
input[type="email"], 
input[type="tel"], 
textarea, 
select {
  border-radius: 8px !important;
  border: 1.5px solid var(--line) !important;
  background: var(--sheet) !important;
  padding: 0.75rem 0.95rem !important;
  font-family: var(--sans) !important;
  font-size: 0.95rem !important;
  color: var(--ink) !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

input[type="text"]:focus, 
input[type="email"]:focus, 
input[type="tel"]:focus, 
textarea:focus, 
select:focus {
  border-color: var(--moss) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 4px rgba(60, 85, 55, 0.12) !important;
  outline: none !important;
}

input:hover, textarea:hover, select:hover {
  border-color: rgba(90, 86, 75, 0.5) !important;
}

/* 8. Pure CSS Interactive Spec Table Enhancements */
.spec tr {
  cursor: default !important;
}

.spec tr:hover td {
  color: var(--moss-deep) !important;
  font-weight: 500 !important;
}

/* 9. Pure CSS Tooltip Support on Hover */
[data-tooltip] {
  position: relative;
  cursor: help;
}

[data-tooltip]::before {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 125%;
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  padding: 0.35rem 0.65rem;
  border-radius: 6px;
  background: var(--ink);
  color: var(--sheet);
  font: 500 0.75rem/1.3 var(--sans);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  box-shadow: var(--shadow-sm);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 100;
}

[data-tooltip]:hover::before {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* 10. Pure CSS Card Click Depth */
.row:active, 
.card:active, 
.qa:active {
  transform: scale(0.99) translateY(0) !important;
}


/* ==========================================================================
   PHASE 2 PURE CSS UI/UX UPGRADES (100% PURE CSS - ZERO JAVASCRIPT)
   ========================================================================== */

/* 1. Scroll-Driven Reading Progress Bar (Pure CSS Native) */
@supports (animation-timeline: scroll()) {
  body::before {
    content: "" !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3.5px !important;
    background: linear-gradient(90deg, var(--moss) 0%, #25D366 50%, var(--gold) 100%) !important;
    transform-origin: 0% 50% !important;
    animation: scroll-reading-progress auto linear !important;
    animation-timeline: scroll() !important;
    z-index: 9999 !important;
    pointer-events: none !important;
    box-shadow: 0 1px 6px rgba(37, 211, 102, 0.45) !important;
  }
  @keyframes scroll-reading-progress {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
  }
}

/* 2. Elevated Back-To-Top Pill Button */
.to-top {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  padding: 0.45rem 1rem !important;
  border-radius: 999px !important;
  border: 1px solid var(--line) !important;
  background: var(--sheet) !important;
  color: var(--moss-deep) !important;
  font-family: var(--sans) !important;
  font-size: 0.74rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(29, 27, 22, 0.05) !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.to-top:hover {
  background: #ffffff !important;
  border-color: var(--moss) !important;
  color: var(--moss) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px -2px rgba(60, 85, 55, 0.18) !important;
  text-decoration: none !important;
}

.to-top:active {
  transform: translateY(0) scale(0.97) !important;
}

/* 3. Pure CSS Archival Eyebrow Badge on Product Spec Sheets */
.p-head .eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  padding: 0.3rem 0.75rem !important;
  background: rgba(60, 85, 55, 0.07) !important;
  border: 1px solid rgba(60, 85, 55, 0.22) !important;
  border-radius: 6px !important;
  color: var(--moss-deep) !important;
  font-family: var(--mono) !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  width: fit-content !important;
  margin-bottom: 0.65rem !important;
  box-shadow: 0 1px 3px rgba(29, 27, 22, 0.03) !important;
}

/* 4. Quality Guarantee Stamps & Seals Physics (Pure CSS) */
.stamp, .cert-stamp, .pledge-seal {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, filter 0.3s ease !important;
}

.stamp:hover, .cert-stamp:hover, .pledge-seal:hover {
  transform: rotate(0deg) scale(1.05) !important;
  filter: drop-shadow(0 8px 18px rgba(124, 74, 0, 0.22)) !important;
}

/* 5. Pure CSS Hero Botanical Plate Gentle Float Keyframe */
@keyframes hero-botanical-float {
  0%, 100% {
    transform: translateY(0) rotate(-1.5deg);
  }
  50% {
    transform: translateY(-5px) rotate(-1deg);
  }
}

@media (min-width: 900px) {
  .hero2 .plate {
    animation: hero-botanical-float 7s ease-in-out infinite !important;
  }
}

/* 6. Pure CSS Optical Clarity Boost on Product Image Inspection */
.plate-window img {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), filter 0.4s ease !important;
}

.photo:hover .plate-window img {
  filter: contrast(1.03) brightness(1.02) !important;
}

/* 7. Pure CSS FAQ Question Hover Expansion */
.faq .qa::before {
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), color 0.25s ease !important;
}

.faq .qa:hover::before {
  transform: scale(1.2) !important;
  color: var(--moss) !important;
}

/* 8. Pure CSS Tap Target & Mobile Ergonomics */
@media (max-width: 768px) {
  a, button, input, select, textarea {
    min-height: 44px;
  }
  .foot-lang a {
    min-height: 38px;
    padding: 0.45rem 0.9rem !important;
  }
}

/* 9. Pure CSS Official Archival Print Styling (Ctrl + P) */
@media print {
  body {
    background: #ffffff !important;
    color: #111111 !important;
  }
  body::before, .scroll-progress {
    display: none !important;
  }
  .site-head, .site-foot, .phonebar, .actions, .turn-hint, .turn-reset, .to-top {
    display: none !important;
  }
  .photo {
    box-shadow: none !important;
    border: 1px solid #777777 !important;
    break-inside: avoid;
  }
  .spec {
    box-shadow: none !important;
    border: 1px solid #777777 !important;
    break-inside: avoid;
  }
  .spec th, .spec td {
    padding: 0.6rem 0.8rem !important;
    border-bottom: 1px solid #dddddd !important;
  }
}


/* ==========================================================================
   PERMANENT MULTI-LANGUAGE HEADER SHIELD (ZERO OVERLAP)
   ========================================================================== */
.crest {
  width: min(100% - 3rem, 76rem) !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
}

.nav {
  width: auto !important;
  max-width: 100% !important;
  font-size: clamp(0.85rem, 0.95vw, 0.95rem) !important;
}

.nav-left {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: clamp(0.5rem, 1.2vw, 1.4rem) !important;
  padding-right: clamp(1.2rem, 2.4vw, 2.8rem) !important;
  padding-left: 0 !important;
}

.nav-right {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: clamp(0.5rem, 1.2vw, 1.4rem) !important;
  padding-left: clamp(1.2rem, 2.4vw, 2.8rem) !important;
  padding-right: 0 !important;
}

.nav a, .nav .nav-cta {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

html[dir="rtl"] .nav-left {
  justify-content: flex-start !important;
  padding-left: clamp(1.2rem, 2.4vw, 2.8rem) !important;
  padding-right: 0 !important;
}

html[dir="rtl"] .nav-right {
  justify-content: flex-end !important;
  padding-right: clamp(1.2rem, 2.4vw, 2.8rem) !important;
  padding-left: 0 !important;
}

@media (max-width: 1120px) {
  .crest {
    grid-template-columns: 1fr !important;
    grid-template-areas: "seal" "navs" "rule" "name" !important;
    row-gap: .55rem !important;
    width: 100% !important;
  }
  .navrow {
    grid-area: navs !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 1.4rem !important;
    width: 100% !important;
  }
  .nav {
    width: auto !important;
    justify-content: flex-start !important;
  }
  .nav-left, .nav-right {
    justify-self: auto !important;
    padding: 0 !important;
    align-self: auto !important;
  }
}


/* ==========================================================================
   ULTRA-POLISHED PURE CSS MOBILE EXPERIENCE (<860px and <640px)
   ========================================================================== */

/* 1. Unobstructed Mobile Masthead: Free up viewport when scrolling on mobile */
@media (max-width: 860px) {
  .site-head {
    position: relative !important;
    top: auto !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .crest {
    row-gap: 0.65rem !important;
  }

  .rule {
    margin-top: 0.85rem !important;
    margin-bottom: 0.35rem !important;
  }

  /* Tap targets for mobile navigation */
  .nav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 0.35rem 0.65rem !important;
    font-size: 0.88rem !important;
    border-radius: 6px !important;
  }

  .nav .nav-cta {
    min-height: 42px !important;
    padding: 0.45rem 0.85rem !important;
    font-size: 0.84rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .nav a:active, .nav .nav-cta:active {
    transform: scale(0.97) !important;
  }
}

/* 2. Narrow Mobile Viewports (<640px) */
@media (max-width: 640px) {
  /* Prevent horizontal overflow on entire document */
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }

  /* Hero Section Typography & Spacing */
  .hero2 {
    padding-block: 2.2rem 2.4rem !important;
  }

  .hero2 h1 {
    font-size: clamp(2rem, 7.8vw, 2.6rem) !important;
    line-height: 1.1 !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }

  .hero2 .lede {
    font-size: 0.98rem !important;
    line-height: 1.55 !important;
  }

  .hero2 .actions {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 0.65rem !important;
  }

  .hero2 .actions .btn {
    width: 100% !important;
    min-height: 48px !important;
    font-size: 0.96rem !important;
    justify-content: center !important;
  }

  /* Catalog Product Rows (<640px) */
  .row {
    padding: 0.85rem 0.95rem !important;
    gap: 0.25rem 0.85rem !important;
    border-radius: 10px !important;
    margin-bottom: 0.75rem !important;
  }

  .row img {
    width: 4.2rem !important;
    height: 4.2rem !important;
    border-radius: 8px !important;
  }

  .row .nm {
    font-size: clamp(1.05rem, 4.2vw, 1.2rem) !important;
    line-height: 1.25 !important;
  }

  .row .latin {
    font-size: 0.92rem !important;
  }

  .row .pill {
    font-size: 0.64rem !important;
    padding: 0.22rem 0.55rem !important;
  }

  .row .go {
    width: 2.2rem !important;
    height: 2.2rem !important;
    font-size: 0.95rem !important;
  }

  /* Product Page Photo & Stage */
  .photo {
    padding: 0.85rem 0.85rem 0 !important;
    border-radius: 12px !important;
    max-width: 100% !important;
  }

  .photo figcaption {
    padding: 0.75rem 0.4rem !important;
    font-size: 0.68rem !important;
  }

  /* Specifications Table Mobile Precision */
  table.spec {
    width: 100% !important;
    font-size: 0.86rem !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: var(--shadow-sm) !important;
  }

  table.spec th {
    width: 32% !important;
    padding: 0.68rem 0.65rem !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.08em !important;
    vertical-align: top !important;
  }

  table.spec td {
    padding: 0.68rem 0.75rem !important;
    font-size: 0.86rem !important;
    line-height: 1.45 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }

  /* Forms & Mobile Input Usability */
  input, select, textarea {
    font-size: 16px !important; /* Critical: stops iOS Safari auto-zoom */
    padding: 0.75rem 0.9rem !important;
    border-radius: 8px !important;
  }

  /* Order Steps & Rule Cards */
  .steps li {
    padding: 1.3rem 1.15rem 1.4rem !important;
  }

  .rules {
    padding-inline: 0 !important;
  }

  .rules li {
    padding: 1.25rem 0.85rem !important;
  }

  /* Language Switcher Grid */
  .foot-lang ul {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 0.45rem !important;
  }

  .foot-lang a {
    min-height: 42px !important;
    padding: 0.5rem 0.85rem !important;
    font-size: 0.84rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Bottom Phonebar Refinement */
  .phonebar {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.65rem !important;
    padding: 0.65rem 0.95rem calc(0.65rem + env(safe-area-inset-bottom, 10px)) !important;
    background: rgba(247, 244, 236, 0.95) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
    border-top: 1px solid rgba(196, 189, 172, 0.7) !important;
    box-shadow: 0 -8px 25px -4px rgba(29, 27, 22, 0.12) !important;
  }

  .phonebar .btn {
    min-height: 46px !important;
    font-size: 0.92rem !important;
    border-radius: 8px !important;
  }

  /* Mobile Floating Back To Top Pill */
  .to-top {
    bottom: calc(5.2rem + env(safe-area-inset-bottom, 0px)) !important;
    right: 1rem !important;
    min-height: 44px !important;
    padding: 0.55rem 1.1rem !important;
    font-size: 0.76rem !important;
    box-shadow: 0 4px 16px rgba(29, 27, 22, 0.2) !important;
  }
}

/* 3. Extra Narrow Phones (<380px, e.g. iPhone SE, Galaxy A-series) */
@media (max-width: 380px) {
  .crest {
    --sprig-w: 2rem !important;
    row-gap: 0.5rem !important;
  }

  .navrow {
    gap: 0.75rem !important;
  }

  .nav {
    font-size: 0.82rem !important;
  }

  .nav a {
    min-height: 38px !important;
    padding: 0.28rem 0.45rem !important;
    font-size: 0.82rem !important;
  }

  .nav .nav-cta {
    min-height: 38px !important;
    padding: 0.35rem 0.55rem !important;
    font-size: 0.78rem !important;
  }

  .row {
    grid-template-columns: 3.8rem minmax(0, 1fr) 1.8rem !important;
    gap: 0.2rem 0.65rem !important;
    padding: 0.75rem 0.75rem !important;
  }

  .row img {
    width: 3.8rem !important;
    height: 3.8rem !important;
  }

  .row .nm {
    font-size: 1.02rem !important;
  }

  .row .latin {
    font-size: 0.88rem !important;
  }

  table.spec th {
    width: 35% !important;
    padding: 0.6rem 0.5rem !important;
    font-size: 0.68rem !important;
  }

  table.spec td {
    padding: 0.6rem 0.6rem !important;
    font-size: 0.82rem !important;
  }
}

/* 4. Touch Device Interactions (No Hover Cursor Scrub) */
@media (hover: none) {
  .turn-hint, .turn-reset {
    display: none !important;
  }

  .row:hover {
    transform: none !important;
    border-color: #C4BDAC !important;
    box-shadow: var(--shadow-sm) !important;
  }

  .row:active {
    transform: scale(0.99) !important;
    background: rgba(235, 230, 214, 0.5) !important;
  }

  .btn:active, .foot-lang a:active {
    transform: scale(0.97) !important;
  }
}

/* ==========================================================================
   Go-live polish (12 Nov 2026): the CTA band's main button stands out
   ========================================================================== */
.band .actions a.btn-ink,
.band .actions a.btn-ink[href*="quote"] {
  background: var(--paper) !important;
  border-color: var(--paper) !important;
  color: #1b2c1a !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28) !important;
}
.band .actions a.btn-ink:hover,
.band .actions a.btn-ink[href*="quote"]:hover {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #1b2c1a !important;
}
.band .actions a.btn[href^="mailto:"] {
  background: transparent !important;
  border: 1px solid rgba(247, 244, 236, 0.55) !important;
  color: var(--paper) !important;
}
.band .actions a.btn[href^="mailto:"]:hover {
  background: rgba(247, 244, 236, 0.12) !important;
}
