/* Sawawada — site stylesheet (written from scratch; layered on Bootstrap 5.3, MIT) */

/* ---------- fonts: IBM Plex (SIL OFL 1.1), self-hosted ---------- */
@font-face{font-family:"Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/plex-sans-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/plex-sans-latin-600.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/plex-sans-cyrillic-400.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/plex-sans-cyrillic-600.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Plex Sans";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/plex-sans-cyrillic-700.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Plex Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/plex-sans-condensed-latin-600.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Plex Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/plex-sans-condensed-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- tokens ---------- */
:root{
  --ink:#1B2A5E;          /* brand navy, from the logo */
  --ink-deep:#121D45;
  --steel:#56616D;        /* secondary text */
  --shell:#ECEEF0;        /* ceramic-shell grey */
  --shell-2:#E1E5E9;
  --line:#D5DAE0;
  --paper:#FFFFFF;
  --text:#1E2329;
  --pour:#E2581B;         /* molten orange — CTA + pour line only */
  --pour-dark:#B9430F;
  --font-body:"Plex Sans","PingFang TC","Noto Sans TC","Microsoft JhengHei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-head:"Plex Condensed","Plex Sans","PingFang TC","Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;
  --step--1:.875rem; --step-0:1rem; --step-1:1.25rem; --step-2:1.5625rem; --step-3:1.953rem; --step-4:2.441rem; --step-5:3.052rem;
  --radius:4px;
  --bs-body-font-family:var(--font-body);
  --bs-body-color:var(--text);
  --bs-body-bg:var(--paper);
  --bs-link-color-rgb:27,42,94;
  --bs-link-hover-color-rgb:226,88,27;
  --bs-border-color:var(--line);
  --bs-border-radius:var(--radius);
}
html{scroll-behavior:smooth;scroll-padding-top:120px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
body{font-size:var(--step-0);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.lang-zh-tw body,body.lang-zh-tw{line-height:1.8;letter-spacing:.02em}
h1,h2,h3,h4{font-family:var(--font-head);color:var(--ink);font-weight:700;letter-spacing:-.005em;line-height:1.15}
.lang-zh-tw h1,.lang-zh-tw h2,.lang-zh-tw h3{letter-spacing:.03em;line-height:1.3}
a{text-underline-offset:.18em;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--pour);outline-offset:2px}
img{max-width:100%;height:auto}
.skip-link{position:absolute;left:1rem;top:-3rem;z-index:2000;background:var(--ink);color:#fff;padding:.5rem 1rem;border-radius:var(--radius)}
.skip-link:focus{top:1rem;color:#fff}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}

/* ---------- buttons ---------- */
.btn{--bs-btn-font-weight:600;--bs-btn-border-radius:var(--radius);--bs-btn-padding-x:1.25rem;--bs-btn-padding-y:.6rem}
.btn-lg{--bs-btn-padding-x:1.6rem;--bs-btn-padding-y:.8rem;--bs-btn-font-size:1.0625rem}
.btn-pour{--bs-btn-bg:var(--pour);--bs-btn-border-color:var(--pour);--bs-btn-color:#fff;--bs-btn-hover-bg:var(--pour-dark);--bs-btn-hover-border-color:var(--pour-dark);--bs-btn-hover-color:#fff;--bs-btn-active-bg:var(--pour-dark);--bs-btn-active-color:#fff;--bs-btn-disabled-bg:var(--pour);--bs-btn-disabled-color:#fff}
.btn-line{--bs-btn-color:var(--ink);--bs-btn-border-color:var(--ink);--bs-btn-hover-bg:var(--ink);--bs-btn-hover-color:#fff;--bs-btn-hover-border-color:var(--ink);--bs-btn-active-bg:var(--ink-deep);--bs-btn-active-color:#fff}
.btn-ink{--bs-btn-bg:var(--ink);--bs-btn-color:#fff;--bs-btn-border-color:var(--ink);--bs-btn-hover-bg:var(--ink-deep);--bs-btn-hover-color:#fff}
.link-arrow{font-weight:600;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--pour);padding-bottom:2px}
.link-arrow:hover{color:var(--pour-dark)}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:1030;background:var(--paper);border-bottom:1px solid var(--line)}
.topline{background:var(--ink);color:#cfd6ea;font-size:var(--step--1)}
.topline__inner{display:flex;justify-content:space-between;align-items:center;min-height:36px;gap:1rem}
.topline__contact{display:flex;gap:1.5rem;flex-wrap:wrap}
.topline a{color:#fff;text-decoration:none}
.topline a:hover{text-decoration:underline}
.lang-switch__btn{display:inline-flex;align-items:center;gap:.4rem;background:none;border:0;color:#fff;padding:.25rem 0;font-size:var(--step--1)}
.lang-switch .dropdown-menu{--bs-dropdown-min-width:11rem;border-color:var(--line);box-shadow:0 12px 32px rgba(18,29,69,.14);padding:.4rem;font-size:var(--step-0)}
.topline .lang-switch .dropdown-item{color:var(--text);border-radius:3px;padding:.45rem .75rem}
.topline .lang-switch .dropdown-item:hover,.topline .lang-switch .dropdown-item:focus{background:var(--shell);color:var(--ink);text-decoration:none}
.topline .lang-switch .dropdown-item.active,.topline .lang-switch .dropdown-item:active{background:var(--ink);color:#fff}
.mainbar{--bs-navbar-padding-y:.65rem}
.navbar-brand img{width:auto;height:60px;display:block}
@media (max-width:991.98px){.navbar-brand img{height:48px}}
.mainbar .nav-link{font-weight:600;color:var(--ink);padding:.5rem .9rem!important;position:relative}
.mainbar .nav-link:hover{color:var(--pour-dark)}
.mainbar .nav-link.is-current::after{content:"";position:absolute;left:.9rem;right:.9rem;bottom:-.66rem;height:3px;background:var(--pour)}
.nav-item.dropdown{display:flex;align-items:center;flex-wrap:wrap}
.nav-caret{background:none;border:0;color:var(--steel);padding:.5rem .25rem .5rem 0;margin-left:-.6rem;line-height:1}
.nav-caret:hover{color:var(--ink)}
.mainbar .dropdown-menu{border-radius:var(--radius);border-color:var(--line);box-shadow:0 12px 32px rgba(18,29,69,.12);padding:.5rem}
.mainbar .dropdown-item{border-radius:3px;padding:.45rem .75rem;color:var(--text)}
.mainbar .dropdown-item:hover,.mainbar .dropdown-item[aria-current]{background:var(--shell);color:var(--ink)}
.mega{padding:1.25rem 1.5rem!important}
.mega.show{display:grid;grid-template-columns:repeat(2,minmax(200px,1fr));gap:2rem}
.mega__title{font-family:var(--font-head);font-weight:700;font-size:var(--step-1);color:var(--ink);text-decoration:none;display:block;padding-bottom:.4rem;margin-bottom:.5rem;border-bottom:1px solid var(--line)}
.mega ul{list-style:none;margin:0;padding:0}
.mega li a{display:block;padding:.3rem 0;color:var(--text);text-decoration:none}
.mega li a:hover,.mega li a[aria-current]{color:var(--pour-dark)}
.nav-cta{margin-left:.75rem}
.burger,.burger::before,.burger::after{display:block;width:22px;height:2px;background:var(--ink);position:relative;content:""}
.burger::before{position:absolute;top:-7px}.burger::after{position:absolute;top:7px}
.navbar-toggler{border:0;padding:.75rem .5rem}
.navbar-toggler:focus{box-shadow:none}
@media (min-width:992px){
  .mainbar .offcanvas{background:transparent}
  .nav-item.dropdown:hover>.dropdown-menu,.nav-item.dropdown:focus-within>.dropdown-menu{display:block;top:100%;left:0;margin-top:0}
  .nav-item.dropdown:hover>.dropdown-menu.mega,.nav-item.dropdown:focus-within>.dropdown-menu.mega{display:grid;grid-template-columns:repeat(2,minmax(200px,1fr));gap:2rem}
  .nav-item.dropdown{position:relative}
}
@media (max-width:991.98px){
  .offcanvas-title{font-family:var(--font-head);font-weight:700;color:var(--ink);font-size:var(--step-1)}
  .navbar-nav .nav-item{border-bottom:1px solid var(--line)}
  .mainbar .nav-link{padding:.85rem 0!important;flex:1}
  .mainbar .nav-link.is-current::after{left:0;right:auto;width:3px;height:auto;top:.7rem;bottom:.7rem;margin-left:-1rem}
  .nav-caret{padding:.85rem .5rem;margin:0}
  .mainbar .dropdown-menu{position:static;width:100%;box-shadow:none;border:0;padding:0 0 .75rem 1rem}
  .mega.show{grid-template-columns:1fr;gap:1rem}
  .mega{padding:0 0 1rem 1rem!important}
  .nav-cta{margin:1.25rem 0 0;border:0!important}
  .nav-cta .btn{width:100%}
  .topline__contact .topline__item:first-child{display:none}
}

/* ---------- banners (client's original artwork) ---------- */
.banner{background:var(--ink-deep);position:relative}
.banner img{display:block;width:100%;height:auto}
.banner--page img{aspect-ratio:1920/450;object-fit:cover}
.banner__btn{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(255,255,255,.18);color:#fff;transition:background .2s}
.banner__btn:hover{background:rgba(255,255,255,.35)}
.banner__prev{left:1rem}.banner__next{right:1rem}
.banner__dots{margin-bottom:.9rem;gap:.4rem}
.banner__dots [data-bs-target]{width:28px;height:3px;border:0;margin:0;background:#fff;opacity:.45}
.banner__dots .active{opacity:1;background:var(--pour)}
@media (max-width:768px){.banner__btn{display:none}}
.banner--page+.page-head{padding-top:1.75rem}

/* ---------- hero (home) ---------- */
.hero{background:var(--shell);padding:clamp(2.5rem,5vw,4.5rem) 0;position:relative;overflow:hidden}
.hero__text{position:relative}
.hero__title{margin:0 0 1.5rem}
.hero__brand{display:block;font-size:var(--step-1);font-weight:600;color:var(--steel);letter-spacing:.01em;margin-bottom:.6rem}
.hero__line{display:block;text-wrap:balance;font-size:clamp(2.1rem,4.6vw,var(--step-5));line-height:1.05;max-width:16ch}
.lang-zh-tw .hero__line{line-height:1.25;max-width:14em}
.lang-ru .hero__line,.lang-de .hero__line{font-size:clamp(1.9rem,3.8vw,2.7rem);max-width:20ch}
.hero__lead{font-size:var(--step-1);color:#38414b;max-width:36em;line-height:1.55;margin-bottom:2rem}
.lang-zh-tw .hero__lead{font-size:1.125rem;line-height:1.85}
.hero__actions{display:flex;flex-wrap:wrap;gap:.75rem}
.showcase{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius)}
.showcase .carousel-item img{display:block;width:100%;aspect-ratio:4/3;object-fit:contain}
.showcase__controls{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:.35rem .5rem}
.showcase__btn{background:none;border:0;color:var(--ink);padding:.5rem;border-radius:var(--radius)}
.showcase__btn:hover{background:var(--shell)}
.showcase__dots{position:static;margin:0;gap:.4rem}
.showcase__dots [data-bs-target]{width:22px;height:3px;background:var(--ink);opacity:.25;border:0;margin:0}
.showcase__dots .active{opacity:1;background:var(--pour)}

/* ---------- block entrance motion (JS adds .js on <html>; no JS = no hiding) ---------- */
.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.js .reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}

/* ---------- bands ---------- */
.band{padding:clamp(3.5rem,7vw,5.5rem) 0}
.band--products{background:var(--paper);border-top:1px solid var(--line)}
.band__title{font-size:var(--step-4);margin-bottom:1.75rem}
.band__title a{color:inherit;text-decoration:none}
.band__title a:hover{color:var(--pour-dark)}
.video{position:relative;border-radius:var(--radius);overflow:hidden;background:#000;aspect-ratio:16/9}
.video__play{all:unset;cursor:pointer;display:block;width:100%;height:100%;position:relative}
.video__play img{width:100%;height:100%;object-fit:cover;opacity:.85;transition:opacity .2s}
.video__play:hover img{opacity:1}
.video__play:focus-visible{outline:3px solid var(--pour);outline-offset:-3px}
.video__icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:72px;height:72px;border-radius:50%;background:var(--pour);color:#fff;display:grid;place-items:center}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* category blocks + part tiles */
.cat-block{margin-top:2.5rem}
.cat-block:first-of-type{margin-top:0}
.cat-block__title{display:flex;align-items:baseline;gap:.75rem;font-size:var(--step-2);padding-bottom:.6rem;border-bottom:2px solid var(--ink);margin-bottom:1.25rem}
.cat-block__title a{color:inherit;text-decoration:none}
.cat-block__title a:hover{color:var(--pour-dark)}
.cat-block__count{font-family:var(--font-body);font-size:var(--step--1);font-weight:600;color:var(--steel)}
.part-grid,.product-grid,.gallery{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.part-grid>li,.product-grid>li,.gallery>.gallery-item{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.part-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.part{display:flex;flex-direction:column;height:100%;background:var(--paper);text-decoration:none;color:var(--ink);padding:1rem}
.part__img{display:block;aspect-ratio:1;background:var(--paper)}
.part__img img{width:100%;height:100%;object-fit:contain}
.part__name{display:block;font-weight:600;margin-top:.75rem;line-height:1.3}
.part:hover .part__name,.product-card:hover .product-card__name{color:var(--pour-dark)}
.part:hover,.product-card:hover{background:#fbfbfc}

/* CTA */
.cta{background:var(--ink);color:#d9def0;padding:3rem 0}
.cta__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem}
.cta__title{color:#fff;font-size:var(--step-3);margin:0 0 .5rem}
.cta__lines{margin:0;display:flex;flex-wrap:wrap;gap:.25rem 2rem}
.cta__lines span{white-space:nowrap}
.cta a:not(.btn){color:#fff}
.cta--form{padding:clamp(3.5rem,7vw,5.5rem) 0}
.cta--form .cta__title{font-size:var(--step-4);margin-bottom:1rem}
.cta__intro{color:#d9def0;max-width:34em;margin-bottom:2rem}
.cta__intro p{margin:0}
.cta__list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.18)}
.cta__list li{padding:.8rem 0;border-bottom:1px solid rgba(255,255,255,.18);color:#fff}
.cta--form .cta__intro{margin-bottom:1.5rem}
.cta__hint{color:#fff;font-weight:600;margin:0 0 .75rem}
.cta__checklist{list-style:none;margin:0;padding:0}
.cta__checklist li{position:relative;padding:.7rem 0 .7rem 1.6rem;border-top:1px solid rgba(255,255,255,.16);color:#e3e7f4}
.cta__checklist li:last-child{border-bottom:1px solid rgba(255,255,255,.16)}
.cta__checklist li::before{content:"";position:absolute;left:0;top:calc(.7rem + .8em);width:10px;height:2px;background:var(--pour)}
.cta__label{display:block;font-size:var(--step--1);color:#aab4d6;margin-bottom:.1rem}
.inquiry-panel.inquiry-panel--light{background:var(--paper);margin-top:0;box-shadow:0 20px 48px rgba(6,12,36,.35)}

/* ---------- inner pages ---------- */
.page-head{background:var(--shell);border-bottom:1px solid var(--line);padding:2.25rem 0 2rem}
.crumbs{list-style:none;padding:0;margin:0 0 .75rem;display:flex;flex-wrap:wrap;font-size:var(--step--1);color:var(--steel)}
.crumbs li+li::before{content:"/";padding:0 .5rem;color:#9aa3ad}
.crumbs a{color:var(--steel);text-decoration:none}
.crumbs a:hover{color:var(--ink);text-decoration:underline}
.page-kicker{margin:0 0 .35rem;font-weight:600}
.page-kicker a{color:var(--pour-dark);text-decoration:none}
.page-title{font-size:clamp(1.9rem,3.6vw,var(--step-4));margin:0}
.page-body{padding-top:2.75rem;padding-bottom:4.5rem}
.side-nav{border-top:3px solid var(--ink);padding-top:1rem;margin-top:2.5rem}
@media (min-width:992px){.side-nav{position:sticky;top:120px;margin-top:0}}
.side-nav__title{font-family:var(--font-head);font-weight:700;font-size:var(--step-1);margin-bottom:.75rem}
.side-nav__title a{color:var(--ink);text-decoration:none}
.side-nav ul{list-style:none;margin:0;padding:0}
.side-nav li a{display:block;padding:.45rem .75rem;color:var(--text);text-decoration:none;border-left:2px solid transparent}
.side-nav li a:hover{color:var(--ink);background:var(--shell)}
.side-nav li a[aria-current]{border-left-color:var(--pour);color:var(--ink);font-weight:600;background:var(--shell)}
.side-nav li>ul{margin:.15rem 0 .5rem .75rem}
.side-nav li>ul a{font-size:var(--step--1);padding:.3rem .75rem}
.section-title{font-size:var(--step-2);margin:0 0 1rem}
.article-section+.article-section{margin-top:3rem}

/* rich text */
.prose{max-width:72ch}
.lang-zh-tw .prose{max-width:42em}
.prose p,.prose ul,.prose ol{margin:0 0 1.1em}
.prose h2{font-size:var(--step-2);margin:2.25rem 0 .75rem}
.prose h3{font-size:var(--step-1);margin:2rem 0 .6rem}
.prose h4{font-size:1.0625rem;margin:1.5rem 0 .5rem}
.prose .lead{font-size:var(--step-1);line-height:1.5;color:var(--ink)}
.prose .lead strong{font-weight:600}
.prose ul.bullets{list-style:none;padding:0}
.prose ul.bullets li{position:relative;padding-left:1.25rem;margin-bottom:.35rem}
.prose ul.bullets li::before{content:"";position:absolute;left:0;top:.7em;width:7px;height:2px;background:var(--pour)}
.prose ol{padding-left:1.4rem}
.prose table{width:100%;border-collapse:collapse;margin:1rem 0 1.5rem;font-size:var(--step--1)}
.prose th,.prose td{border:1px solid var(--line);padding:.5rem .75rem;vertical-align:top}
.prose th{background:var(--shell)}
.prose img.icon-inline{width:18px;height:18px;margin-right:.5rem;vertical-align:-3px}
.prose--doc h2{font-size:var(--step-1);margin-top:2rem}
.list-intro{margin-bottom:2.5rem}
.list-intro .lead{font-size:var(--step-0);color:var(--text);line-height:1.7}
.hint{color:var(--steel);font-size:var(--step--1)}

/* process steps (a real sequence → numbered) */
.prose .steps{list-style:none;padding:0;margin:1.5rem 0;counter-reset:step;max-width:none}
.prose .step{display:grid;grid-template-columns:120px 1fr;gap:1.25rem;align-items:start;padding:1.25rem 0;border-top:1px solid var(--line)}
.prose .step:last-child{border-bottom:1px solid var(--line)}
.step-img{margin:0;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:.5rem}
.step-img img{display:block;width:100%;height:auto}
.step-body strong:first-child{display:block;font-family:var(--font-head);font-size:var(--step-1);color:var(--ink);margin-bottom:.25rem}
.step-body br:first-of-type{display:none}
@media (max-width:575.98px){.prose .step{grid-template-columns:84px 1fr;gap:1rem}}

/* certificate + gallery grids */
.cert-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.5rem;margin:1rem 0}
.cert{margin:0}
.cert a{display:block;border:1px solid var(--line);border-radius:var(--radius);padding:.5rem;background:var(--paper)}
.cert a:hover{border-color:var(--ink)}
.cert img{display:block;width:100%;aspect-ratio:3/4;object-fit:contain}
.cert figcaption{margin-top:.5rem;font-weight:600;color:var(--ink);font-size:var(--step--1)}
.gallery{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));margin:1rem 0;max-width:none}
.prose:has(.gallery){max-width:none}
.gallery-item{display:block;background:var(--paper);padding:.75rem;cursor:zoom-in}
.gallery-item img{display:block;width:100%;aspect-ratio:1;object-fit:contain}
.gallery-item:hover{background:#fbfbfc}

/* product list cards */
.product-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.product-card{display:flex;flex-direction:column;height:100%;background:var(--paper);text-decoration:none;color:var(--text);padding:1.25rem}
.product-card__img{display:block;aspect-ratio:1;margin-bottom:1rem}
.product-card__img img{width:100%;height:100%;object-fit:contain}
.product-card__name{display:block;font-family:var(--font-head);font-weight:700;font-size:var(--step-1);color:var(--ink);line-height:1.2}
.product-card__des{display:block;margin-top:.4rem;font-size:var(--step--1);color:var(--steel);line-height:1.5}

/* product detail */
.product-intro.no-img{grid-template-columns:1fr}
.product-intro{display:grid;grid-template-columns:minmax(0,280px) 1fr;gap:2rem;align-items:start;margin-bottom:3rem}
.product-intro__img{margin:0;border:1px solid var(--line);border-radius:var(--radius);padding:1rem;background:var(--paper)}
.product-intro__img img{display:block;width:100%;aspect-ratio:1;object-fit:contain}
.product-intro .prose{margin-bottom:1.5rem}
@media (max-width:767.98px){.product-intro{grid-template-columns:1fr}.product-intro__img{max-width:280px}}

/* forms */
.inquiry-panel{background:var(--shell);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2rem);margin-top:3rem}
.contact-intro+.inquiry-panel{margin-top:1.5rem}
.inquiry .form-label{font-weight:600;color:var(--ink);margin-bottom:.35rem}
.inquiry .req{color:var(--pour-dark)}
.inquiry .form-control,.inquiry .form-select{border-color:#c3cad2;background-color:var(--paper);padding:.6rem .8rem}
.inquiry .form-control:focus,.inquiry .form-select:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(27,42,94,.15)}
.inquiry .form-control[readonly]{background:var(--shell-2);color:var(--ink);font-weight:600}
.inquiry.was-validated .form-control:invalid,.inquiry.was-validated .form-select:invalid{border-color:#b42318}
.inquiry__actions{padding-top:.5rem}
.inquiry-form-message:empty{display:none}
.inquiry-form-message{padding:.85rem 1rem;border-radius:var(--radius);font-weight:600}
.inquiry-form-message.is-ok{background:#e6f4ea;color:#14532d}
.inquiry-form-message.is-err{background:#fdecea;color:#8a1c12}

/* contact list */
.contact-list{margin:0}
.contact-list__row{padding:.75rem 0;border-bottom:1px solid var(--line)}
.contact-list dt{font-size:var(--step--1);color:var(--steel);font-weight:400}
.contact-list dd{margin:0;font-weight:600;color:var(--ink)}
.contact-list--page{border-top:3px solid var(--ink)}
.contact-list--page .contact-list__row{padding:1rem 0}
.empty-note{background:var(--shell);border-radius:var(--radius);padding:1.5rem}
.empty-note__links{margin:.5rem 0 0;padding-left:1.2rem}

/* ---------- footer ---------- */
.site-footer{background:var(--shell);border-top:1px solid var(--line);padding:3.5rem 0 1.5rem;font-size:var(--step--1)}
.site-footer__logo img{height:40px;width:auto;margin-bottom:1rem}
.site-footer .contact-list__row{padding:.5rem 0;border-color:var(--shell-2)}
.site-footer .contact-list dd{font-weight:400;color:var(--text)}
.site-footer__head{font-family:var(--font-head);font-weight:700;font-size:var(--step-0);margin-bottom:.6rem}
.site-footer__head a{color:var(--ink);text-decoration:none}
.site-footer__links{list-style:none;margin:0;padding:0}
.site-footer__links li{margin-bottom:.35rem}
.site-footer__links a{color:var(--text);text-decoration:none}
.site-footer__links a:hover,.site-footer__head a:hover{color:var(--pour-dark);text-decoration:underline}
.site-footer__contact{list-style:none;margin:2.5rem 0 0;padding:1.1rem 0 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:.4rem 2rem;color:var(--text)}
.site-footer__contact li{white-space:nowrap}
.site-footer__contact-label{color:var(--steel);margin-right:.4rem}
.site-footer__contact-label::after{content:":"}
.lang-zh-tw .site-footer__contact-label::after{content:"："}
.lang-zh-tw .site-footer__contact-label{margin-right:0}
.site-footer__contact a{color:var(--ink)}
@media (max-width:991.98px){.site-footer__contact li{white-space:normal}}
.site-footer__base{margin-top:1.25rem!important;border-top:0!important;padding-top:0!important;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--line);color:var(--steel)}
.site-footer__base a{color:var(--steel)}

/* ---------- cookie note + lightbox ---------- */
.cookie-note{position:fixed;z-index:1040;left:1rem;right:1rem;bottom:1rem;max-width:560px;margin-left:auto;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--ink);border-radius:var(--radius);box-shadow:0 16px 40px rgba(18,29,69,.18);padding:1rem 1.25rem;display:flex;gap:1rem;align-items:flex-end;font-size:var(--step--1)}
.cookie-note[hidden]{display:none}
@media (max-width:575.98px){.cookie-note{left:.5rem;right:.5rem;bottom:.5rem;flex-direction:column;align-items:stretch;gap:.6rem;padding:.85rem 1rem;font-size:.8125rem;line-height:1.5}.cookie-note .btn{width:100%}}
.cookie-note p{margin:0}
.cookie-note__title{font-weight:600;color:var(--ink);margin-bottom:.25rem!important}
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;margin:0}
.lightbox::backdrop{background:rgba(10,15,35,.88)}
.lightbox[open]{display:grid;place-items:center}
.lightbox img{max-width:min(92vw,1100px);max-height:86vh;background:#fff;border-radius:var(--radius)}
.lightbox__close,.lightbox__nav{position:fixed;background:rgba(255,255,255,.12);color:#fff;border:0;border-radius:50%;width:48px;height:48px;display:grid;place-items:center}
.lightbox__close:hover,.lightbox__nav:hover{background:rgba(255,255,255,.25)}
.lightbox__close{top:1rem;right:1rem}
.lightbox__prev{left:1rem;top:50%;transform:translateY(-50%)}
.lightbox__next{right:1rem;top:50%;transform:translateY(-50%)}
.lightbox.single .lightbox__nav{display:none}

/* ---------- form sent dialog ---------- */
.sent-dialog{border:0;border-top:4px solid var(--pour);border-radius:var(--radius);padding:2rem 2rem 1.75rem;width:min(92vw,440px);text-align:center;box-shadow:0 24px 60px rgba(6,12,36,.35);color:var(--text)}
.sent-dialog::backdrop{background:rgba(10,15,35,.55)}
.sent-dialog[open]{animation:sent-in .25s cubic-bezier(.2,.7,.2,1)}
@keyframes sent-in{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.sent-dialog__icon{width:56px;height:56px;border-radius:50%;margin:0 auto 1rem;display:grid;place-items:center;background:#e6f4ea;color:#1e7a3c}
.sent-dialog__title{font-family:var(--font-head);font-weight:700;font-size:var(--step-2);color:var(--ink);margin:0 0 .5rem}
.sent-dialog__msg{margin:0 0 1.5rem;line-height:1.6}
.sent-dialog .btn{min-width:8rem}