/* ONWAY SPORTS — VI layer for block-editor inner pages.
   Loaded on inner singular pages (front end) AND into the block-editor canvas by
   onway_site_v2.php, so the editor looks like the live page. Lifted verbatim from
   homepage-preview.html except: the homepage-structural bare-element rules
   (header/footer/body/html/img and the global heading/link/paragraph reset) are dropped so this
   sheet cannot restyle the shared GeneratePress header/footer; `section{}` became
   `.osec{}`; the reset is scoped under `.onway-v2-page .entry-content`.
   Do not hand-edit lightly — keep in sync with homepage-preview.html. */

:root{
  --ink:#28292d;          /* 炭黑 */
  --olive:#463a26;        /* 橄榄棕 */
  --olive-deep:#3a3020;
  --gold:#af8128;         /* 琥珀金 */
  --gold-bright:#c8973a;
  --paper:#f5f2e9;        /* 米白 */
  --sage:#d5dabc;         /* 鼠尾草绿 */
  --muted:#64665f;        /* 灰绿 */
  --line:rgba(40,41,45,.14);
  --line-light:rgba(245,242,233,.18);
  --disp:"Montserrat",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --body:"Inter",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
}

/* Scoped reset: neutralise GeneratePress + legacy CSS inside the page content only,
   never the shared header/footer. Mirrors the homepage reset. */
.onway-v2-page .entry-content{font-family:var(--body);color:var(--ink);line-height:1.6}
/* Let the full-bleed bands' inner content use more width. GeneratePress breaks an .alignfull
   band out to the viewport width but then re-wraps its content in .wp-block-group__inner-container
   capped at the 1200px site width and re-centred — that (plus double padding) is what leaves the
   big empty side gutters. Release that inner container; the .wrap class then governs width (1340). */
.onway-v2-page .entry-content .alignfull > .wp-block-group__inner-container{max-width:100%;padding-left:0;padding-right:0}
/* the theme also pads EVERY group inner-container 40px top+bottom — nested groups stack to 80px
   of dead space per band. Section rhythm is owned by .osec, so zero it inside v2 content. */
.onway-v2-page .entry-content .wp-block-group__inner-container{padding-top:0;padding-bottom:0}
.onway-v2-page .entry-content :where(h1,h2,h3,h4,h5,h6){color:inherit;text-transform:none;letter-spacing:normal}
.onway-v2-page .entry-content :where(p){color:inherit}
.onway-v2-page .entry-content img{max-width:100%}

/* utilities */
.wrap{max-width:1340px;margin:0 auto;padding:0 40px}
.disp{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;line-height:1.05}
.eyebrow{font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--disp);font-weight:700;font-size:14px;letter-spacing:.02em;padding:15px 28px;border-radius:2px;transition:.2s;cursor:pointer;border:1.5px solid transparent;text-decoration:none}
.btn-gold{background:var(--gold);color:var(--paper)}
.btn-gold:hover{background:var(--gold-bright)}
.btn-ghost{border-color:var(--line-light);color:var(--paper)}
.btn-ghost:hover{background:rgba(245,242,233,.08);border-color:var(--paper)}
.btn-dark{border-color:var(--ink);color:var(--ink)}
.btn-dark:hover{background:var(--ink);color:var(--paper)}

/* Core/GenerateBlocks paint .wp-block-button__link with their own (grey) background at equal
   specificity, loaded after this sheet. Two-class selectors let the VI button styles win when
   .btn* is added to a block button. */
a.wp-block-button__link.btn{border-radius:2px;padding:15px 28px}
a.wp-block-button__link.btn-gold{background:var(--gold);color:var(--paper);border-color:transparent}
a.wp-block-button__link.btn-gold:hover{background:var(--gold-bright)}
a.wp-block-button__link.btn-ghost{background:transparent;border-color:var(--line-light);color:var(--paper)}
a.wp-block-button__link.btn-ghost:hover{background:rgba(245,242,233,.08);border-color:var(--paper)}
a.wp-block-button__link.btn-dark{background:transparent;border-color:var(--ink);color:var(--ink)}
a.wp-block-button__link.btn-dark:hover{background:var(--ink);color:var(--paper)}

/* section rhythm (was bare `section` on the homepage) */
.osec{padding:88px 0}
.sec-head{max-width:640px;margin-bottom:48px}
.sec-head h2{font-family:var(--disp);font-weight:800;font-size:clamp(28px,3.6vw,44px);letter-spacing:-.02em;line-height:1.1;margin:14px 0 16px}
.sec-head p{color:var(--muted);font-size:16.5px}

/* section colour helpers for full-bleed bands */
.bg-paper{background:var(--paper);color:var(--ink)}
.bg-ink{background:var(--ink);color:var(--paper)}
.bg-olive{background:var(--olive);color:var(--paper)}
.bg-white{background:#fff;color:var(--ink)}
.bg-ink .sec-head h2,.bg-olive .sec-head h2{color:var(--paper)}
.bg-ink .sec-head p,.bg-olive .sec-head p{color:rgba(245,242,233,.6)}

/* hero band */
.hero{position:relative;background:linear-gradient(155deg,var(--ink) 0%,var(--olive) 100%);color:var(--paper);overflow:hidden}
.hero .wrap{position:relative;z-index:2;padding:72px 40px 56px;max-width:1340px}
.hero h1{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;line-height:1.04;font-size:clamp(38px,5.4vw,66px);max-width:16ch;margin-bottom:22px;color:var(--paper)}
.hero h1 em{font-style:normal;color:var(--gold-bright)}
.hero p.lede{font-size:clamp(16px,1.7vw,20px);max-width:60ch;color:rgba(245,242,233,.82);margin-bottom:38px}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap}
/* stats folded into the bottom of the hero (both visible on first screen) */
.hero-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;border-top:1px solid var(--line-light);margin-top:40px;padding-top:28px;max-width:1000px}
.hero-stats .n{font-family:var(--disp);font-weight:800;font-size:clamp(21px,2.3vw,31px);color:var(--gold-bright);line-height:1;white-space:nowrap}
.hero-stats .l{font-size:12px;color:rgba(245,242,233,.6);margin-top:7px;letter-spacing:.02em;line-height:1.3}
@media(max-width:720px){.hero-stats{grid-template-columns:repeat(3,1fr);gap:22px 16px}}
@media(max-width:420px){.hero-stats{grid-template-columns:repeat(2,1fr)}}

/* why / cards */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:6px;padding:30px 26px;transition:.2s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(40,41,45,.35)}
.card .ic{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--olive);margin-bottom:20px}
.card .ic svg{width:22px;height:22px;stroke:var(--gold-bright)}
.card h3{font-family:var(--disp);font-weight:700;font-size:18px;margin-bottom:10px}
.card p{font-size:14.5px;color:var(--muted)}

/* filter / statement band */
.filter-band{background:var(--olive);color:var(--paper);text-align:center;padding:70px 0}
.filter-band .disp{font-size:clamp(24px,3.4vw,40px);max-width:20ch;margin:0 auto 14px}
.filter-band .disp em{font-style:normal;color:var(--gold-bright)}
.filter-band p{color:rgba(245,242,233,.7);max-width:60ch;margin:0 auto;font-size:16px}

/* faq (core Details blocks carry .faq-item) */
.faq-list{max-width:880px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:16px;padding:22px 0;font-family:var(--disp);font-weight:700;font-size:17.5px;color:var(--ink);transition:color .15s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--gold)}
.faq-item summary::before{content:"+";flex:0 0 auto;font-size:20px;line-height:1;color:var(--gold);transform:translateY(2px);transition:transform .2s}
.faq-item[open] summary::before{content:"−"}
.faq-a{padding:0 0 24px 32px;font-size:15.5px;color:var(--muted);max-width:70ch;line-height:1.7}

/* process steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 24px}
.step .img{aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:var(--sage);margin-bottom:16px;border:1px solid var(--line)}
.step .img img{width:100%;height:100%;object-fit:cover;object-position:center}
.step .num{font-family:var(--disp);font-weight:800;font-size:14px;color:var(--gold);letter-spacing:.1em}
.step h4{font-family:var(--disp);font-weight:700;font-size:18px;margin:5px 0 7px}
.step p{font-size:14px;color:var(--muted);line-height:1.55}

/* cert row */
.cert-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:980px;margin:0 auto}
.cert-row .c{background:#fff;border-radius:6px;padding:14px 14px 12px;display:flex;flex-direction:column;gap:10px;transition:.2s;border:1px solid var(--line)}
.cert-row .c:hover{transform:translateY(-3px)}
.cert-row .c img{width:100%;height:300px;object-fit:contain}
.cert-row .c span{font-family:var(--disp);font-size:11.5px;font-weight:700;color:var(--ink);text-align:center;letter-spacing:.01em}

/* awards */
.aw-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:38px}
.aw-tile{background:rgba(245,242,233,.04);border:1px solid var(--line-light);border-radius:8px;padding:32px 26px;text-align:center}
.aw-tile .big{font-family:var(--disp);font-weight:800;font-size:clamp(30px,4.2vw,48px);color:var(--gold-bright);line-height:1.05}
.aw-tile .t{font-family:var(--disp);font-weight:700;font-size:15px;margin:13px 0 7px;color:var(--paper)}
.aw-tile p{font-size:13.5px;color:rgba(245,242,233,.6)}

/* CTA band (mirrors the inquiry band colours, without the form) */
.cta-band{background:var(--ink);color:var(--paper);text-align:center}
.cta-band .wrap{padding:80px 32px}
.cta-band .disp{font-size:clamp(28px,3.8vw,46px);max-width:20ch;margin:16px auto 16px}
.cta-band p.sub{color:rgba(245,242,233,.72);max-width:56ch;margin:0 auto 30px;font-size:17px}

/* inquiry form (rendered by [onway_inquiry_form]; sits on a dark .bg-ink band) */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:900px;margin:38px auto 0;text-align:left}
.form-grid .field{display:flex;flex-direction:column;gap:7px}
.form-grid .field.full{grid-column:1 / -1}
.form-grid .field label{font-family:var(--disp);font-weight:600;font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:rgba(245,242,233,.58)}
.form-grid .field input,.form-grid .field select,.form-grid .field textarea{background:rgba(245,242,233,.06);border:1px solid rgba(245,242,233,.18);border-radius:3px;padding:13px 14px;color:var(--paper);font-family:var(--body);font-size:15px;transition:.15s;width:100%}
.form-grid .field input::placeholder,.form-grid .field textarea::placeholder{color:rgba(245,242,233,.34)}
.form-grid .field input:focus,.form-grid .field select:focus,.form-grid .field textarea:focus{outline:none;border-color:var(--gold);background:rgba(245,242,233,.1)}
.form-grid .field select{appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23c8973a' stroke-width='1.6'/></svg>");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
.form-grid .field select option{color:#28292d}
.form-grid .field textarea{resize:vertical;min-height:96px}
.form-actions{grid-column:1 / -1;display:flex;align-items:center;justify-content:center;gap:22px;margin-top:10px;flex-wrap:wrap}
.form-actions button.btn-gold{background:var(--gold);color:var(--paper);border-color:transparent}
.form-actions button.btn-gold:hover{background:var(--gold-bright)}
.form-note{font-size:13px;color:rgba(245,242,233,.5)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-banner{max-width:900px;margin:0 auto 4px;padding:16px 20px;border-radius:6px;font-size:15px;text-align:left;display:none}
.form-banner.show{display:block}
.form-banner.ok{background:rgba(175,129,40,.14);border:1px solid var(--gold);color:var(--paper)}
.form-banner.err{background:rgba(200,60,60,.14);border:1px solid #c85050;color:var(--paper)}
.form-banner b{color:var(--gold-bright)}
@media(max-width:640px){.form-grid{grid-template-columns:1fr}}

/* contact info list */
.contact-list{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;max-width:900px}
.contact-list .card h3{color:var(--gold);font-size:12px;letter-spacing:.11em;text-transform:uppercase;margin-bottom:9px}
.contact-list .card a{color:inherit;border-bottom:1px solid var(--line);transition:.15s}
.contact-list .card a:hover{color:var(--gold)}
@media(max-width:560px){.contact-list{grid-template-columns:1fr}}

/* stats / numbers band (put inside a .bg-olive or .bg-ink band) */
.statgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:24px;max-width:1120px;margin:0 auto;text-align:center}
.statgrid .n{font-family:var(--disp);font-weight:800;font-size:clamp(26px,3vw,40px);line-height:1;color:var(--gold-bright)}
.statgrid .l{font-size:12.5px;margin-top:9px;letter-spacing:.03em;opacity:.72;line-height:1.35}

/* vertical timeline (mobile-friendly — no horizontal scroll) */
.vtl{max-width:760px;margin:0 auto;position:relative}
.vtl::before{content:"";position:absolute;left:74px;top:8px;bottom:14px;width:2px;background:var(--line)}
.vtl .row{display:flex;gap:0;padding:0 0 28px;position:relative}
.vtl .yr{flex:0 0 60px;text-align:right;font-family:var(--disp);font-weight:800;font-size:18px;color:var(--gold);line-height:1.1}
.vtl .dot{position:absolute;left:70px;top:5px;width:11px;height:11px;border-radius:50%;background:var(--gold);border:2px solid var(--paper);box-shadow:0 0 0 1px var(--line)}
.vtl .txt{flex:1;font-size:15px;color:var(--muted);line-height:1.6;padding-left:30px}
.vtl .txt b{color:var(--ink);font-weight:700}

/* award / design-story list */
.aw-list{max-width:900px;margin:0 auto}
.aw-list .row{display:flex;gap:24px;padding:22px 2px;border-bottom:1px solid var(--line);align-items:baseline}
.aw-list .yr{font-family:var(--disp);font-weight:800;font-size:15px;color:var(--gold);flex:0 0 60px}
.aw-list .txt{font-size:15.5px;color:var(--muted);line-height:1.62}
.aw-list .txt b{color:var(--ink);font-weight:700;font-family:var(--disp)}

/* product-system cards (image + label) */
.prodgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.prodcard{display:block;background:#fff;border:1px solid var(--line);border-radius:8px;padding:20px 18px;text-align:center;transition:.2s;text-decoration:none;color:var(--ink)}
.prodcard:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(40,41,45,.35)}
.prodcard .im{height:180px;display:flex;align-items:center;justify-content:center;background:radial-gradient(120% 90% at 50% 35%,#f4f5ee,#e4e7d7);border-radius:6px;margin-bottom:14px}
.prodcard img{max-width:88%;max-height:88%;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(40,41,45,.18))}
.prodcard h3{font-family:var(--disp);font-weight:700;font-size:16px;color:var(--ink);text-transform:none;border:none}
.prodcard:hover h3{color:var(--gold)}
.prodcard p{font-size:12.5px;color:var(--muted);margin-top:5px;border:none}

/* factory photo grid */
.photogrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.photogrid figure{margin:0;border-radius:8px;overflow:hidden;position:relative;background:var(--olive-deep)}
.photogrid img{width:100%;height:210px;object-fit:cover;display:block}
.photogrid figcaption{position:absolute;left:0;bottom:0;width:100%;padding:20px 14px 11px;background:linear-gradient(to top,rgba(40,41,45,.92),transparent);color:var(--paper);font-family:var(--disp);font-weight:700;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase}

/* 12-step production process grid (photo + step number + label) */
.procgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.procstep{position:relative;border-radius:8px;overflow:hidden;background:var(--olive-deep)}
.procstep img{width:100%;height:172px;object-fit:cover;display:block}
.procstep .cap{position:absolute;left:0;bottom:0;width:100%;padding:26px 13px 11px;background:linear-gradient(to top,rgba(40,41,45,.95),rgba(40,41,45,.15) 70%,transparent)}
.procstep .num{font-family:var(--disp);font-weight:800;font-size:11.5px;color:var(--gold-bright);letter-spacing:.06em}
.procstep .nm{font-family:var(--disp);font-weight:700;font-size:13.5px;color:var(--paper);margin-top:1px}

/* patent marquee (seamless infinite scroll — 31 patents) */
.patent-marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.patent-track{display:flex;width:max-content;animation:patent-scroll 90s linear infinite}
.patent-marquee:hover .patent-track{animation-play-state:paused}
.patent-track img{height:196px;width:auto;flex:0 0 auto;margin-right:14px;border-radius:4px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 22px -12px rgba(0,0,0,.4)}
@keyframes patent-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.patent-track{animation:none}}

/* certificate row (real cert scans as proof) */
.certrow2{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.certrow2 figure{margin:0;text-align:center}
.certrow2 img{height:300px;width:auto;background:#fff;border-radius:6px;padding:10px;box-shadow:0 18px 44px -26px rgba(0,0,0,.5)}
.certrow2 figcaption{font-family:var(--disp);font-weight:700;font-size:12px;color:var(--ink);margin-top:12px;letter-spacing:.02em}

/* small inline spec-number strip */
.specline{display:flex;gap:34px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.specline .s{text-align:center}
.specline .s b{font-family:var(--disp);font-weight:800;font-size:22px;color:var(--gold);display:block;line-height:1}
.specline .s span{font-size:12px;color:var(--muted);margin-top:5px;display:block}

/* ---- blog hero (injected on the archive via generate_after_header) ---- */
.onway-blog-hero{width:100vw;margin-left:calc(50% - 50vw);background:linear-gradient(155deg,var(--ink) 0%,var(--olive) 100%);color:var(--paper);padding:60px 0 54px;margin-bottom:44px}
.onway-blog-hero .wrap{max-width:1340px;margin:0 auto;padding:0 40px}
.onway-blog-hero .eyebrow{color:var(--gold)}
.onway-blog-hero h1{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;font-size:clamp(32px,4.6vw,54px);color:var(--paper);margin:10px 0 14px}
.onway-blog-hero .lede{color:rgba(245,242,233,.82);max-width:60ch;font-size:17px}

/* ---- blog archive → VI post cards ---- */
body.blog .site-main,body.archive .site-main{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:start}
body.blog .site-main>*:not(article),body.archive .site-main>*:not(article){grid-column:1 / -1}
body.blog article.post,body.archive article.post{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;transition:.2s}
body.blog article.post:hover,body.archive article.post:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(40,41,45,.35)}
body.blog article.post .inside-article,body.archive article.post .inside-article{display:flex;flex-direction:column;height:100%}
body.blog .post-image,body.archive .post-image{order:-1;margin:0}
body.blog .post-image img,body.archive .post-image img{width:100%;height:200px;object-fit:cover;display:block}
/* legacy onway_site_v1 hides .entry-header globally (to drop duplicate page titles);
   re-show it for blog cards + single posts, which need their titles. */
body.blog .entry-header,body.archive .entry-header{display:block;padding:20px 22px 0}
body.blog .entry-title,body.archive .entry-title{font-family:var(--disp);font-weight:800;font-size:19px;line-height:1.25;margin:0 0 8px;letter-spacing:-.01em;text-transform:none}
body.blog .entry-title a,body.archive .entry-title a{color:var(--ink)}
body.blog .entry-title a:hover,body.archive .entry-title a:hover{color:var(--gold)}
body.blog .entry-header .entry-meta,body.archive .entry-header .entry-meta{font-size:12px;color:var(--muted)}
body.blog .entry-header .entry-meta a,body.archive .entry-header .entry-meta a{color:var(--muted)}
body.blog .entry-summary,body.archive .entry-summary{padding:12px 22px 0;color:var(--muted);font-size:14.5px;line-height:1.6;flex:1}
body.blog footer.entry-meta,body.archive footer.entry-meta{padding:16px 22px 20px;font-size:11.5px}
body.blog .cat-links,body.archive .cat-links,body.blog .cat-links a,body.archive .cat-links a{font-family:var(--disp);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:11px;color:var(--gold)}
/* trim GeneratePress byline + comment links for a cleaner B2B insights feed */
body.blog .byline,body.archive .byline,.single-post .byline,body.blog .comments-link,body.archive .comments-link{display:none}

/* ---- single post header + body typography ---- */
.single-post .entry-header{display:block;max-width:760px;margin-bottom:8px}
.single-post .entry-header .entry-title{font-family:var(--disp);font-weight:800;font-size:clamp(28px,3.4vw,42px);line-height:1.14;letter-spacing:-.02em;text-transform:none;color:var(--ink);margin:0 0 12px}
.single-post .entry-header .entry-meta{color:var(--muted);font-size:13px}
.single-post .entry-header .entry-meta a{color:var(--muted)}
.single-post .entry-content{max-width:760px}
.single-post .entry-content h2{font-family:var(--disp);font-weight:800;font-size:26px;letter-spacing:-.01em;margin:36px 0 12px;color:var(--ink)}
.single-post .entry-content h3{font-family:var(--disp);font-weight:700;font-size:20px;margin:28px 0 10px;color:var(--ink)}
.single-post .entry-content p,.single-post .entry-content li{font-size:17px;line-height:1.72;color:var(--ink)}
.single-post .entry-content ul{padding-left:1.2em;margin:14px 0}
.single-post .entry-content li{margin-bottom:8px}
.single-post .entry-content a{color:var(--gold);border-bottom:1px solid rgba(175,129,40,.4)}
.single-post .entry-content a:hover{border-bottom-color:var(--gold)}

/* ---- single product page ---- */
/* the product content provides its own hero cover, so hide the theme's featured-image header */
.single-ow_product .page-header-image-single,.single-ow_product .featured-image{display:none}
.single-ow_product .entry-header{display:none}

/* Hero band fills the first screen on ANY resolution: height = viewport minus the fixed header,
   content vertically centred, so top/bottom whitespace is always balanced automatically. */
.prod-hero-band{display:flex;align-items:center;min-height:calc(100vh - 85px);min-height:calc(100svh - var(--header-height,85px));padding:40px 0}
.prod-hero-band>.wp-block-group__inner-container{width:100%}

.prod-hero{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
/* cap the square image tray so the hero always fits the first screen, even on short/wide displays */
.prod-hero .im{max-width:min(100%,calc(100svh - var(--header-height,85px) - 150px));margin:0 auto}
.prod-hero .im{background:radial-gradient(120% 90% at 50% 40%,#f4f5ee,#e4e7d7);border-radius:14px;padding:30px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:zoom-in}
.prod-hero .im img{max-width:94%;max-height:94%;width:auto;object-fit:contain;filter:drop-shadow(0 16px 22px rgba(40,41,45,.16));transition:transform .18s ease;will-change:transform}
.prod-hero .eyebrow a{color:var(--gold);text-decoration:none;border-bottom:none}
.prod-hero .eyebrow a:hover{color:var(--gold-bright)}
.prod-hero .model{font-family:var(--disp);font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--gold)}
.prod-hero h1{font-family:var(--disp);font-weight:800;font-size:clamp(28px,3.6vw,42px);letter-spacing:-.02em;line-height:1.1;margin:8px 0 14px;color:var(--ink);text-transform:none}
.prod-hero .lede{color:var(--muted);font-size:16.5px;line-height:1.6;margin-bottom:22px}
/* spec table — centered card style */
.spec-block{max-width:880px;margin:0 auto;text-align:center}
.spec-block .lede{color:var(--muted);font-size:17px;line-height:1.65;max-width:64ch;margin:0 auto 30px}
.spec-table{width:100%;border-collapse:separate;border-spacing:0;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 16px 40px -30px rgba(40,41,45,.35)}
.spec-table th,.spec-table td{padding:15px 20px;text-align:center;vertical-align:middle;font-size:15px;border-bottom:1px solid var(--line)}
.spec-table tr:last-child th,.spec-table tr:last-child td{border-bottom:none}
.spec-table th{width:38%;background:var(--paper);color:var(--muted);font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.spec-table td{color:var(--ink)}

/* production flow — 12 steps with arrows (dark band) */
.flow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 10px;max-width:1280px;margin:0 auto}
.fstep{width:160px;background:rgba(245,242,233,.05);border:1px solid var(--line-light);border-radius:8px;overflow:hidden;text-align:center;padding-bottom:12px;transition:.2s}
.fstep:hover{border-color:rgba(200,151,58,.55)}
.fstep img{width:100%;height:106px;object-fit:cover;display:block;margin-bottom:10px}
.fstep .n{font-family:var(--disp);font-weight:800;font-size:11px;color:var(--gold-bright);letter-spacing:.08em}
.fstep .t{font-family:var(--disp);font-weight:700;font-size:13.5px;color:var(--paper);margin-top:2px}
.farrow{color:var(--gold);font-size:22px;font-family:var(--disp);font-weight:800;flex:0 0 auto;line-height:1}
@media(max-width:560px){.fstep{width:136px}.fstep img{height:92px}}
.prod-feats{margin:0 0 26px;padding-left:0;list-style:none}
.prod-feats li{position:relative;padding-left:24px;margin-bottom:9px;font-size:15px;color:var(--ink);line-height:1.5}
.prod-feats li::before{content:"";position:absolute;left:0;top:8px;width:9px;height:9px;border-radius:50%;background:var(--gold)}
.prod-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.prod-gallery img{width:100%;height:210px;object-fit:cover;border-radius:8px;border:1px solid var(--line);background:#fff;display:block}
.prod-back a{font-family:var(--disp);font-weight:700;font-size:13px;color:var(--muted)}
.prod-back a:hover{color:var(--gold)}
@media(max-width:820px){.prod-hero{grid-template-columns:1fr;gap:26px}.prod-gallery{grid-template-columns:repeat(2,1fr)}}

/* responsive — same breakpoints as the homepage */
@media(max-width:900px){body.blog .site-main,body.archive .site-main{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){body.blog .site-main,body.archive .site-main{grid-template-columns:1fr}}
@media(max-width:900px){.prodgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.statgrid{grid-template-columns:repeat(3,1fr);gap:28px}.photogrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.photogrid{grid-template-columns:1fr}.prodgrid{grid-template-columns:repeat(2,1fr)}.certrow2 img{height:200px}}
@media(max-width:520px){.statgrid{grid-template-columns:repeat(2,1fr)}.vtl::before{left:52px}.vtl .yr{flex-basis:44px;font-size:15px}.vtl .dot{left:48px}.vtl .txt{padding-left:24px}.aw-list .row{flex-direction:column;gap:4px}}
@media(max-width:900px){.cards{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.cert-row{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.aw-tiles{grid-template-columns:1fr;gap:14px}}
@media(max-width:640px){.hero .wrap{padding:72px 24px 64px}}
@media(max-width:560px){.cards{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.faq-a{padding-left:0}}
@media(max-width:520px){.cert-row{grid-template-columns:repeat(2,1fr)}}
