/* QC-only composition. Existing internal Hero, stage, FAQ and RFQ remain owners. */
.quick-coupler-product { --qc-paper:#f2f1ee; --qc-navy:#061a29; }
.quick-coupler-product [hidden] { display:none!important; }
.quick-coupler-product h2 { line-height:1.15; }
.qc-band-copy h3,.qc-hydraulics h3 { font-size:clamp(1.6rem,2.5vw,2.4rem); line-height:1.22; letter-spacing:-.03em; }
.quick-coupler-product p { line-height:1.7; }
.quick-coupler-product figure { margin:0; }
.quick-coupler-product figcaption { font-size:.9rem; line-height:1.6; padding:1rem 0; }
.qc-hero { --internal-hero-min-height:clamp(44rem,calc(100svh - 4.5rem),64rem); --internal-hero-position:center center; }
.qc-hero::after { background:linear-gradient(90deg,rgb(2 14 23 / 97%) 0%,rgb(2 14 23 / 86%) 24%,rgb(2 14 23 / 52%) 43%,rgb(2 14 23 / 7%) 70%),linear-gradient(0deg,rgb(2 14 23 / 22%),transparent 50%); }
.qc-hero .internal-hero__content { padding-block:0; }
.qc-hero-copy { width:min(100%,31rem); justify-content:flex-start; padding-block:4rem 5rem; }
.qc-hero-copy h1 { margin:0; font-size:clamp(3rem,4.8vw,4.6rem); line-height:1.1; letter-spacing:-.05em; white-space:nowrap; }
.qc-hero-copy .qc-english { margin:1rem 0 0; color:#fff; font-size:1.35rem; font-weight:650; }
.qc-hero-copy .lead { margin-top:1.5rem; font-size:1.16rem; }
.qc-hero-copy .actions { margin-top:2rem; padding-top:0; flex-wrap:wrap; gap:1.4rem; }
.qc-overview { padding-bottom:0!important; }
.qc-overview .grass-overview__intro { padding-bottom:4rem; }
.qc-overview .grass-overview__definition p+p { margin-top:1.5rem; font-size:1.05rem; }
.qc-overview-band { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; background:var(--qc-paper); }
.qc-stage { height:auto; aspect-ratio:1; }
.qc-stage .grass-product-stage__view img { padding:0; transform:none; object-fit:contain; }
.qc-stage .grass-product-stage__dots { gap:0; padding:0; border:0; background:none; box-shadow:none; backdrop-filter:none; }
.qc-stage .grass-product-dot { width:2.75rem; height:2.75rem; border-radius:0; position:relative; border:none; background:transparent; }
.qc-stage .grass-product-dot::before { content:""; position:absolute; inset:1rem; border:1px solid #24343d; background:#fff; border-radius:50%; }
.qc-stage .grass-product-dot.is-active::before { background:var(--gold); border-color:var(--gold); }
.qc-stage .grass-product-dot:focus-visible { outline:2px solid var(--navy); outline-offset:0; }
.qc-band-copy { padding:3rem max(2rem,calc((100vw - 80rem)/2)) 3rem clamp(2rem,5vw,5rem); }
.qc-band-copy h3 { color:var(--navy); margin:0 0 1.5rem; }
.qc-band-copy p { max-width:32rem; color:#42525d; }
.qc-design { color:#fff; background:var(--qc-navy); padding-bottom:5rem!important; }
.qc-heading { display:grid; grid-template-columns:1.05fr .85fr; gap:clamp(2rem,7vw,7rem); align-items:end; margin-bottom:3.4rem; }
.qc-heading h2 { font-size:clamp(2.3rem,3.8vw,3.8rem); margin:0; color:inherit; }
.qc-heading p { margin:0; color:#d2dbe0; }
.qc-detail-band { display:grid; grid-template-columns:1.35fr 1fr; gap:0; align-items:start; }
.qc-detail-band figure img { display:block; width:100%; height:auto; }
.qc-detail-band figcaption { padding-inline:2rem; color:#d2dbe0; }
.qc-hydraulics { display:grid; grid-template-columns:1.2fr .65fr; gap:clamp(3rem,9vw,9rem); align-items:center; margin-top:4rem; }
.qc-hydraulics h3 { color:#fff; margin:0 0 1.5rem; }
.qc-hydraulics p { color:#d2dbe0; max-width:38rem; }
.qc-hydraulics figure { max-width:24rem; justify-self:end; }
.qc-hydraulics img { width:100%; height:auto; display:block; }
.qc-small { font-size:.87rem; line-height:1.6; color:#52616b; }
.qc-match { background:var(--qc-paper); }
.qc-match-layout { display:grid; grid-template-columns:1fr .8fr; gap:clamp(3rem,7vw,7rem); align-items:center; }
.qc-match h2 { font-size:clamp(2.3rem,3.4vw,3.4rem); margin:0 0 1.5rem; }
.qc-match p { max-width:38rem; color:#42525d; }
.qc-match .qc-lead { font-size:1.2rem; color:var(--navy); }
.qc-match img { display:block; width:100%; height:auto; }
.qc-match .button { margin-top:1.5rem; }
.qc-specs { padding-bottom:2rem!important; }
.qc-spec-layout { display:grid; grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr); gap:2rem; align-items:center; }
.qc-spec-data { min-width:0; }
.qc-spec-table { min-width:43rem; table-layout:fixed; width:max(100%,43rem); font-size:.83rem; }
.qc-spec-table th,.qc-spec-table td { height:auto; min-width:0; padding:.8rem .5rem; }
.quick-coupler-product .qc-spec-table thead th:first-child,.quick-coupler-product .qc-spec-table tbody th:first-child { width:5.2rem; min-width:0; }
.qc-spec-table thead th { white-space:nowrap; line-height:1.5; }
.quick-coupler-product .grass-spec-table-wrap:focus-visible { outline:2px solid var(--gold); }
.qc-rfq .rfq-title { font-size:clamp(3rem,5vw,5rem); line-height:1.15; }
.qc-rfq-independent { display:inline-block; margin-top:1.5rem; color:var(--gold); }
.qc-rfq .qc-rfq__helper { font-size:.85rem; color:#d2dde2; margin:0; }
@media(max-width:64.03rem) {
 .qc-hero-copy { width:26rem; }
 .qc-hero-copy h1 { font-size:3.5rem; }
 .qc-spec-layout { grid-template-columns:1fr; }
 .qc-spec-layout>.qc-stage,.qc-spec-layout>div:first-child { width:min(100%,28rem); margin-inline:auto; }
 .qc-heading { gap:2.5rem; }
}
@media(max-width:48.03rem) {
 .qc-hero { --internal-hero-min-height:calc(100svh - 4rem); --internal-hero-position:center 48%; }
 .qc-hero::after { background:linear-gradient(180deg,rgb(2 14 23 / 70%) 0%,rgb(2 14 23 / 35%) 34%,rgb(2 14 23 / 5%) 61%,rgb(2 14 23 / 85%) 100%); }
 .qc-hero .internal-hero__media img { object-fit:contain; mask-image:linear-gradient(180deg,transparent calc(50% - 50vw),#000 calc(50% - 45vw),#000 calc(50% + 40vw),transparent calc(50% + 50vw)); }
 .qc-hero-copy { width:100%; min-height:var(--internal-hero-min-height); padding-block:2.8rem 2.2rem; justify-content:flex-start; }
 .qc-hero-copy h1 { font-size:clamp(2.45rem,8.5vw,3.6rem); }
 .qc-hero-copy .qc-english { font-size:1.15rem; margin-top:.75rem; }
 .qc-hero-copy .lead { font-size:1rem; margin-top:1.1rem; max-width:22rem; }
 .qc-hero-copy .actions { margin-top:auto; gap:.9rem; }
 .qc-hero-copy .button--text { padding:.8rem 0; }
 .qc-overview-band,.qc-heading,.qc-hydraulics,.qc-match-layout { grid-template-columns:1fr; }
 .qc-band-copy { padding:2rem var(--content-gutter) 3rem; }
 .qc-detail-band { grid-template-columns:1fr; }
 .qc-detail-band figure+figure { width:78%; margin:2rem var(--content-gutter) 0 auto; }
 .qc-heading { gap:1.5rem; }
 .qc-hydraulics { gap:2.5rem; margin-top:3rem; }
 .qc-hydraulics figure { justify-self:start; width:68%; }
 .qc-match-layout { gap:2rem; }
 .qc-match figure { width:85%; justify-self:end; }
 .qc-spec-table { font-size:.85rem; }
 .qc-spec-table th,.qc-spec-table td { padding:.85rem .6rem; }
 .quick-coupler-product .grass-overview__intro h2 { font-size:2.5rem; line-height:1.2; }
}

/* Local visual candidate 2026-10-14: continuous Hero and separated photo rhythm. */
.qc-hero { --internal-hero-min-height:clamp(32rem,41.67vw,50rem); --internal-hero-position:center; }
.qc-hero::after { background:linear-gradient(90deg,rgb(6 26 41 / 83%) 0%,rgb(6 26 41 / 67%) 28%,rgb(6 26 41 / 24%) 49%,transparent 67%); }
.qc-hero .internal-hero__media img { object-fit:contain; object-position:center; mask-image:none; }
.qc-hero-copy { justify-content:center; padding-block:3rem; width:min(100%,31rem); }
.qc-overview { padding-bottom:6rem!important; }
.qc-overview-band { display:flex; flex-direction:column-reverse; gap:2.5rem; background:transparent; }
.qc-band-copy { padding:0; max-width:46rem; align-self:flex-start; }
.qc-band-copy h3 { margin-bottom:1rem; }
.qc-band-copy p { max-width:46rem; }
.qc-overview-band .qc-stage { width:100%; height:clamp(26rem,36vw,34rem); aspect-ratio:auto; background:var(--qc-paper); }
.qc-overview-band .grass-product-stage__view { background:var(--qc-paper); }
.qc-overview-band .grass-product-stage__view img { object-fit:contain; }
.qc-detail-band { grid-template-columns:1fr 1fr; gap:2.5rem; align-items:start; }
.qc-detail-band figure img { height:clamp(20rem,28vw,29rem); object-fit:contain; background:#fff; }
.qc-detail-band figcaption { padding:1rem 0 0; }
.qc-hydraulics { grid-template-columns:minmax(0,1fr) minmax(0,.7fr); gap:3.5rem; margin-top:4.5rem; }
.qc-hydraulics figure { justify-self:center; width:100%; max-width:23rem; }
.qc-hydraulics img { max-height:28rem; object-fit:contain; }
@media(max-width:48.03rem) {
 .qc-hero .internal-hero__content { padding-block:0; }
 .qc-overview { padding-bottom:3.5rem!important; }
 .qc-overview .grass-overview__intro { padding-bottom:2.5rem; }
 .qc-overview-band { gap:2rem; }
 .qc-overview-band .qc-stage { height:auto; aspect-ratio:1; }
 .qc-detail-band,.qc-hydraulics { grid-template-columns:1fr; gap:2.5rem; }
 .qc-detail-band figure+figure { width:100%; margin:0; }
 .qc-detail-band figure img { height:auto; max-height:none; }
 .qc-hydraulics { margin-top:3rem; }
 .qc-hydraulics figure { width:100%; max-width:22rem; justify-self:center; }
}

/* Owner 2026-10-14: one continuous photo with left overlay at every width. */
.qc-hero { --internal-hero-min-height:0; min-height:0; display:grid; aspect-ratio:1942 / 809; }
.qc-hero .internal-hero__media,
.qc-hero .internal-hero__media picture,
.qc-hero .internal-hero__media img { position:absolute; inset:0; width:100%; height:100%; padding:0; }
.qc-hero .internal-hero__media img { max-width:none; max-height:none; transform:none; object-fit:cover; object-position:center; mask-image:none; }
.qc-hero::after { display:block; background:linear-gradient(90deg,rgb(6 26 41 / 83%) 0%,rgb(6 26 41 / 67%) 28%,rgb(6 26 41 / 24%) 49%,transparent 67%); }
.qc-hero .internal-hero__content { position:relative; height:100%; min-height:0; padding-block:0; }
.qc-hero-copy { min-height:0; width:min(31rem,38vw); padding-block:2.5rem; justify-content:center; }
.qc-hero-copy h1 { white-space:normal; max-width:100%; text-wrap:pretty; }
.qc-hero-copy .lead { max-width:26ch; text-wrap:pretty; hyphens:none; overflow-wrap:normal; }
.qc-hero-copy .actions { max-width:100%; flex-wrap:wrap; gap:1rem; margin-top:2rem; }
@media(max-width:64.03rem) and (min-width:48.04rem) {
 .qc-hero-copy { width:38vw; padding-block:1.5rem; }
 .qc-hero-copy h1 { font-size:clamp(2rem,4.4vw,3rem); }
 .qc-hero-copy .lead { font-size:1rem; margin-top:1rem; line-height:1.5; }
 .qc-hero-copy .actions { margin-top:1.25rem; gap:.75rem; }
 .qc-hero-copy .actions a { padding:.65rem .8rem; font-size:.8rem; }
}
@media(max-width:48.03rem) {
 .qc-hero { aspect-ratio:auto; height:max(11.25rem,41.67vw); }
 .qc-hero .internal-hero__media img { object-position:70% center; }
 .qc-hero .internal-hero__content { width:calc(100% - 2rem); }
 .qc-hero-copy { width:46%; padding-block:.5rem; }
 .qc-hero-copy h1 { position:static; width:auto; font-size:clamp(1.25rem,3.6vw,2.2rem); line-height:1.1; letter-spacing:-.03em; }
 .qc-hero-copy .lead { position:static; width:auto; font-size:clamp(.75rem,2.05vw,1rem); line-height:1.35; margin-top:.4rem; max-width:100%; }
 .qc-hero-copy .actions { margin-top:.5rem; gap:.25rem; flex-direction:column; align-items:flex-start; }
 .qc-hero-copy .actions a { font-size:clamp(.7rem,1.7vw,.8rem); min-height:clamp(1.75rem,4.2vw,2.25rem); padding:.3rem .55rem; line-height:1.2; }
 .qc-hero-copy .actions .button--text { padding:.3rem 0; }
}

.qc-hero-copy .hero-phrase { display:inline-block; max-width:100%; vertical-align:top; }
@media(max-width:23.75rem) {
 .qc-hero .internal-hero__media img { object-position:90% center; }
}
