/* Glynett: product-led editorial presentation, scoped to this page. */
.brand-page[data-brand="glynett"] {
  --brand-accent:#d1d8c1;
  --brand-deep:#314237;
  --brand-soft:#f3eee5;
  --gly-ink:#28322c;
  --gly-muted:#58625b;
  --gly-brass:#8a6b40;
}
.gly-shell { width:min(100%,1440px); margin-inline:auto; }
.gly-section { padding:clamp(72px,7vw,112px) max(24px,6vw); }
.gly-eyebrow { font-size:.7rem; font-weight:650; line-height:1.6; letter-spacing:.16em; text-transform:uppercase; }
.gly-title { font-size:clamp(2.75rem,4.5vw,5rem); line-height:1.06; letter-spacing:-.045em; text-wrap:balance; }
.gly-link { display:inline-flex; align-items:center; gap:22px; padding:9px 0; border-bottom:1px solid currentColor; font-size:.8rem; line-height:1.5; font-weight:600; }
.gly-link span { font-size:1.1rem; }
.gly-light :focus-visible { outline-color:#314237; }
.gly-light em { color:#42583d; }
.gly-dark-button { background:var(--brand-deep); border-color:var(--brand-deep); color:#f5f1e8; }
.gly-dark-button:hover { background:#415344; }

.gly-hero { position:relative; isolation:isolate; background:#0a1523; }
.gly-hero-picture { display:block; }
.gly-hero-picture img { display:block; width:100%; height:clamp(620px,50vw,1000px); object-fit:cover; object-position:right top; }
.gly-hero::after { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(90deg,rgba(5,14,24,.58),rgba(5,14,24,.13) 34%,transparent 44%); }
.gly-hero-copy { position:absolute; z-index:1; left:max(24px,6vw); top:50%; transform:translateY(-43%); width:34%; max-width:530px; }
.gly-breadcrumb { display:flex; flex-wrap:wrap; gap:9px; color:#d4d8d7; font-size:.67rem; margin-bottom:32px; }
.gly-breadcrumb strong { color:#f5f1e8; font-weight:500; }
.gly-breadcrumb a:hover { text-decoration:underline; text-underline-offset:4px; }
.gly-hero .gly-eyebrow { color:#d6c49f; }
.gly-hero h1 { font-size:clamp(3.25rem,4.9vw,6.2rem); line-height:1.04; letter-spacing:-.055em; margin:18px 0 20px; }
.gly-hero h1 em { color:#d3d9c3; }
.gly-hero-intro { color:#e4e4da; font-size:1rem; line-height:1.65; max-width:335px; }
.gly-hero .brand-actions { margin-top:26px; gap:16px 24px; align-items:center; }
.gly-hero .brand-button { background:#e5e8d8; border-color:#e5e8d8; color:#203027; }
.gly-hero .gly-link { color:#f5f1e8; }
.gly-hero-signature { position:absolute; z-index:1; left:max(24px,6vw); bottom:30px; display:flex; align-items:center; gap:18px; color:#d6c49f; font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; }
.gly-hero-signature::before { content:""; height:1px; width:35px; background:currentColor; }
.gly-chapters { display:flex; justify-content:space-between; align-items:center; gap:25px; padding:22px max(24px,6vw); background:#eae4d9; color:var(--gly-ink); }
.gly-chapters>p { font-family:Georgia,serif; font-size:1.3rem; }
.gly-chapters nav { display:flex; flex-wrap:wrap; gap:28px; }
.gly-chapters a { font-size:.76rem; padding-block:8px; border-bottom:1px solid transparent; }
.gly-chapters a:hover { border-color:currentColor; }

.gly-essence { background:var(--brand-soft); color:var(--gly-ink); }
.gly-essence-grid { display:grid; grid-template-columns:1.25fr 1fr; gap:90px; align-items:end; }
.gly-essence .gly-eyebrow { color:var(--gly-brass); }
.gly-essence h2 { margin-top:18px; }
.gly-essence-story { max-width:425px; }
.gly-essence-story>p { color:var(--gly-muted); font-size:1.02rem; line-height:1.75; }
.gly-essence-footnote { display:flex; flex-wrap:wrap; align-items:center; gap:18px 25px; border-top:1px solid #c8cabe; margin-top:26px; padding-top:20px; }
.gly-essence-footnote strong { font-family:Georgia,serif; font-weight:400; font-size:1.4rem; }
.gly-essence-footnote span { color:var(--gly-muted); font-size:.73rem; }

.gly-steps { background:#e5ebdf; color:var(--gly-ink); }
.gly-section-heading { display:flex; justify-content:space-between; align-items:end; gap:32px; }
.gly-section-heading .gly-eyebrow { color:#4d634e; }
.gly-section-heading h2 { margin-top:17px; }
.gly-section-heading>p { color:var(--gly-muted); font-size:.9rem; line-height:1.65; max-width:285px; }
.gly-steps-stage { display:grid; grid-template-columns:1.15fr 1fr; margin-top:42px; background:#f6f8f1; border:1px solid #cbd4c1; }
.gly-step-photo { position:relative; align-self:start; background:#fff; aspect-ratio:760/640; min-width:0; }
.gly-step-photo>img { display:block; width:100%; height:100%; object-fit:contain; }
.gly-step-outline { position:absolute; top:15%; bottom:24%; width:12.6667%; left:calc(12% + var(--step-index,0) * 12.6667%); border:1px solid rgba(56,83,55,.65); border-radius:30px; background:rgba(183,201,163,.08); pointer-events:none; transition:left .4s ease; }
.gly-step-outline[hidden],.gly-step-tabs[hidden],.gly-step-instruction[hidden] { display:none; }
.gly-step-tabs { position:absolute; left:12%; right:12%; bottom:6%; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0; }
.gly-step-tab { justify-self:center; display:grid; place-items:center; padding:0; width:44px; height:44px; border:1px solid #a6b799; border-radius:50%; color:#344d37; background:#f6f8f1; font-family:inherit; font-size:.83rem; line-height:1; font-weight:600; cursor:pointer; transition:background .2s,color .2s; }
.gly-step-tab:hover { background:#e1e8d8; }
.gly-step-tab[aria-selected="true"] { color:#fff; background:#314237; border-color:#314237; }
.gly-step-tab:focus-visible { outline-color:#314237; outline-offset:3px; }
.gly-step-panels { padding:clamp(28px,4.5vw,72px); align-self:center; min-width:0; }
.gly-step-panel { padding:24px 0; border-bottom:1px solid #cbd4c1; }
.gly-step-panel:last-child { border-bottom:0; }
.gly-steps-stage.is-enhanced .gly-step-panel { border:0; padding:0; }
.gly-step-panel[hidden] { display:none; }
.gly-step-count { color:#5c7053; font-size:.65rem; font-weight:650; letter-spacing:.14em; text-transform:uppercase; }
.gly-step-panel h3 { font-size:clamp(2.5rem,3.5vw,4.2rem); letter-spacing:-.04em; line-height:1.06; margin:20px 0 16px; overflow-wrap:anywhere; }
.gly-step-purpose { font-family:Georgia,serif; font-size:1.4rem; line-height:1.4; }
.gly-step-description { color:var(--gly-muted); font-size:.94rem; line-height:1.7; max-width:330px; margin-top:14px!important; }
.gly-step-footer { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:25px; padding:22px 30px; border-top:1px solid #cbd4c1; }
.gly-step-footer>p { color:var(--gly-muted); font-size:.76rem; line-height:1.6; max-width:480px; }
.gly-step-footer .brand-button { flex:none; min-height:48px; padding:12px 19px; font-size:.75rem; }

.gly-lines { background:#faf8f3; color:var(--gly-ink); }
.gly-lines .gly-eyebrow { color:var(--gly-brass); }
.gly-line-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px 24px; margin-top:45px; }
.gly-line { min-width:0; }
.gly-line figure { display:grid; place-items:center; aspect-ratio:1.15; background:#fff; overflow:hidden; }
.gly-line figure img { display:block; width:100%; height:100%; object-fit:contain; padding:24px; transition:transform .6s ease; }
.gly-line:hover figure img { transform:scale(1.03); }
.gly-line-copy { padding-top:24px; }
.gly-line-copy>span { color:#67705f; font-size:.62rem; font-weight:600; line-height:1.5; letter-spacing:.12em; text-transform:uppercase; }
.gly-line-copy h3 { font-size:clamp(2rem,2.7vw,3rem); line-height:1.1; letter-spacing:-.035em; margin:12px 0 14px; }
.gly-line-copy p { color:var(--gly-muted); font-size:.88rem; line-height:1.7; max-width:355px; }
.gly-line-copy .gly-link { font-size:.75rem; margin-top:16px; color:#354b3a; }
.gly-line-feature { grid-column:span 2; display:grid; grid-template-columns:1.15fr 1fr; background:#ece7df; }
.gly-line-feature figure { aspect-ratio:auto; height:100%; background:#e4ddd3; }
.gly-line-feature .gly-line-copy { align-self:center; padding:clamp(25px,3vw,48px); }
.gly-line-feature h3 { font-size:clamp(2.5rem,3.5vw,4.2rem); }
.gly-lines-note { border-top:1px solid #d5d5c9; padding-top:23px; margin-top:42px!important; color:var(--gly-muted); font-size:.77rem; line-height:1.6; }

.gly-support { background:#14252a; }
.gly-support-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:90px; align-items:center; }
.gly-support .gly-eyebrow { color:#d6c49f; }
.gly-support h2 { margin-top:18px; }
.gly-support-copy>p { max-width:405px; font-size:1rem; line-height:1.75; color:#d1d9d2; }
.gly-support-copy .brand-button { margin-top:27px; }
.gly-support-details { display:flex; flex-wrap:wrap; gap:12px 25px; color:#c2ccbF; font-size:.72rem; margin-top:22px; }
.brand-page[data-brand="glynett"] .brand-faq { background:#0d1d23; }
.brand-page[data-brand="glynett"] .brand-next { background:#0d1d23; }

@media(min-width:901px) and (max-width:1150px) {
  .gly-hero { display:flex; flex-direction:column; padding-top:125px; }
  .gly-hero-picture { order:2; }
  .gly-hero-picture img { height:auto; aspect-ratio:1774/887; object-fit:contain; }
  .gly-hero::after { display:none; }
  .gly-hero-copy { position:relative; top:auto; left:auto; transform:none; width:auto; max-width:700px; margin:0 6vw; padding-bottom:38px; }
  .gly-hero h1 { font-size:4rem; }
  .gly-breadcrumb { margin-bottom:22px; }
  .gly-hero-intro { font-size:.9rem; }
  .gly-hero .brand-actions { gap:10px; margin-top:22px; }
  .gly-hero .brand-button { font-size:.75rem; min-height:48px; padding:12px 16px; }
  .gly-hero .gly-link { font-size:.75rem; }
  .gly-hero-signature { left:6vw; bottom:24px; color:#172a22; }
  .gly-essence-grid,.gly-support-grid { gap:45px; }
  .gly-line-feature { grid-template-columns:1fr 1fr; }
  .gly-line-feature .gly-line-copy { padding:25px; }
}
@media(max-width:900px) {
  .gly-hero-picture img { width:100%; height:auto; aspect-ratio:941/1672; object-fit:contain; }
  .gly-hero::after { background:linear-gradient(rgba(5,14,24,.2),transparent 38%); }
  .gly-hero-copy { top:128px; left:6vw; width:80%; max-width:none; transform:none; }
  .gly-breadcrumb { margin-bottom:25px; }
  .gly-hero h1 { font-size:clamp(3.75rem,8vw,5.75rem); margin-top:16px; }
  .gly-hero-intro { max-width:390px; font-size:1rem; }
  .gly-hero .brand-actions { margin-top:26px; }
  .gly-hero-signature { bottom:25px; color:#172a22; font-weight:650; }
  .gly-chapters { align-items:start; flex-direction:column; gap:10px; }
  .gly-chapters nav { gap:22px; }
  .gly-essence-grid,.gly-support-grid { grid-template-columns:1fr; gap:30px; }
  .gly-essence-story { max-width:580px; }
  .gly-section-heading { align-items:start; flex-direction:column; gap:22px; }
  .gly-section-heading>p { max-width:510px; }
  .gly-step-panels { padding:28px; }
  .gly-line-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gly-line-feature { grid-column:1/-1; min-height:370px; }
  .gly-line-copy h3 { font-size:2.3rem; }
}
@media(max-width:600px) {
  .gly-section { padding:65px 22px; }
  .gly-title { font-size:clamp(2.6rem,10vw,3.5rem); }
  .gly-hero-copy { top:112px; left:22px; width:calc(100% - 44px); }
  .gly-breadcrumb { font-size:.61rem; gap:7px; margin-bottom:17px; }
  .gly-hero .gly-eyebrow { font-size:.62rem; letter-spacing:.15em; }
  .gly-hero h1 { font-size:clamp(2.7rem,9.7vw,3.6rem); margin:13px 0 12px; line-height:1.03; }
  .gly-hero-intro { font-size:.88rem; max-width:310px; line-height:1.6; }
  .gly-hero .brand-actions { position:absolute; top:calc(100vw * 1672 / 941 - 252px); left:0; margin:0; gap:7px 16px; width:100%; }
  .gly-hero .brand-button { min-height:48px; padding:12px 17px; font-size:.75rem; background:#233a2c; border-color:#233a2c; color:#f5f1e8; }
  .gly-hero .gly-link { color:#172a22; font-size:.74rem; border-bottom-color:#385242; }
  .gly-hero-signature { left:22px; bottom:20px; font-size:.54rem; letter-spacing:.1em; gap:12px; }
  .gly-chapters { padding:20px 22px; }
  .gly-chapters>p { font-size:1.15rem; }
  .gly-chapters nav { column-gap:20px; row-gap:5px; }
  .gly-chapters a { font-size:.72rem; }
  .gly-essence-story>p { font-size:.95rem; }
  .gly-essence-footnote strong { font-size:1.3rem; }
  .gly-steps-stage { grid-template-columns:1fr; margin-top:30px; }
  .gly-step-tabs { left:8%; right:8%; bottom:5%; }
  .gly-step-outline { left:calc(12% + var(--step-index,0) * 12.6667%); }
  .gly-step-tab { width:44px; height:44px; }
  .gly-step-panels { padding:28px 24px; min-height:270px; }
  .gly-step-panel h3 { font-size:2.65rem; margin:15px 0 12px; }
  .gly-step-description { font-size:.9rem; }
  .gly-step-footer { align-items:start; flex-direction:column; padding:22px 24px 28px; gap:18px; }
  .gly-line-grid { grid-template-columns:1fr; gap:38px; margin-top:30px; }
  .gly-line-feature { display:block; min-height:0; }
  .gly-line-feature figure { aspect-ratio:1.15; height:auto; }
  .gly-line-feature .gly-line-copy { padding:28px 24px; }
  .gly-line figure img { padding:18px; }
  .gly-line-copy { padding-top:22px; }
  .gly-line-copy h3 { font-size:2.35rem; }
  .gly-support-copy>p { font-size:.95rem; }
}
@media(max-width:420px) {
  .gly-hero-intro { display:none; }
  .gly-hero-copy { top:104px; }
  .gly-hero h1 { font-size:clamp(2.45rem,10.5vw,2.75rem); }
  .gly-hero .brand-actions { top:calc(100vw * 1672 / 941 - 244px); }
  .gly-hero-signature { font-size:.5rem; }
}
@media(max-width:350px) {
  .gly-hero .gly-link { display:none; }
  .gly-hero .brand-actions { top:calc(100vw * 1672 / 941 - 226px); }
  .gly-step-tabs { left:4%; right:4%; }
  .gly-step-tab { width:40px; height:44px; }
}
@media(prefers-reduced-motion:reduce) {
  .gly-step-outline,.gly-step-tab,.gly-line figure img { transition:none; }
  .gly-line:hover figure img { transform:none; }
}
