/* ---------- Sub-page additions (shared across inner pages) ---------- */
.nav-links a[aria-current="page"]{opacity:1}
.nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.menu a[aria-current="page"]{color:var(--copper)}
.sub-hero{min-height:max(620px,82svh)}

/* Image placeholders: hatched panels labelled with what to supply */
.ph{position:relative;overflow:hidden;width:100%;height:100%}
.ph-fill{position:absolute;inset:-8% 0;height:116%;will-change:transform}
.ph-dark{background:
  repeating-linear-gradient(135deg,rgba(242,243,244,.045) 0 1px,transparent 1px 14px),
  radial-gradient(120% 90% at 70% 30%,#1d2328 0%,#101417 55%,#0A0C0E 100%)}
.ph-light{background:
  repeating-linear-gradient(135deg,rgba(13,16,19,.06) 0 1px,transparent 1px 14px),
  linear-gradient(160deg,#E9EBED 0%,#DCDFE2 100%)}
.ph-tag{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:calc(100% - 40px);text-align:center;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;line-height:1.6;padding:10px 16px;border:1px dashed currentColor;white-space:normal}
.ph-dark .ph-tag{color:rgba(242,243,244,.55)}
.ph-light .ph-tag{color:rgba(13,16,19,.5)}
.hero .ph-tag,.closing .ph-tag{top:auto;bottom:auto;top:38%}

/* Access tiers: two large columns */
.tier-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px clamp(24px,3vw,48px)}
.tier{display:flex;flex-direction:column;gap:18px}
.tier-img{aspect-ratio:4/3;margin-bottom:10px}
.tier-label{font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--steel);padding-top:16px;border-top:1px solid var(--ink)}
.tier h3{font-size:clamp(26px,2.6vw,40px);font-weight:300;letter-spacing:-.03em;line-height:1.08;text-wrap:balance}
.tier p:last-child{font-size:18px;color:var(--steel);max-width:52ch}
@media (max-width:860px){.tier-grid{grid-template-columns:1fr}}

/* The Store: four ruled columns with a copper rule that fills on hover */
.store-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-dark)}
.store{position:relative;display:flex;flex-direction:column;gap:22px;padding:34px clamp(18px,2.2vw,32px) 40px;transition:background .5s var(--ease)}
.store:first-child{padding-left:0}
.store+.store{border-left:1px solid var(--line-dark)}
.store::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--copper);transform:scaleX(0);transform-origin:0 50%;transition:transform .6s var(--ease)}
.store:hover::before{transform:scaleX(1)}
.store h3{font-size:clamp(34px,3.4vw,52px);font-weight:300;letter-spacing:-.035em;line-height:1}
.store p{font-size:16px;color:var(--mist);line-height:1.5;max-width:30ch}
@media (max-width:960px){.store-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.store:nth-child(3){padding-left:0;border-left:0}.store:nth-child(n+3){border-top:1px solid var(--line-dark)}}
@media (max-width:560px){.store-grid{grid-template-columns:1fr}.store{padding-left:0!important;padding-right:0}.store+.store{border-left:0;border-top:1px solid var(--line-dark)}}

/* Packaging: ruled rows that highlight on hover */
.pack-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.pack{position:relative;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:16px clamp(24px,4vw,64px);align-items:baseline;padding:34px 0;border-bottom:1px solid var(--line);transition:background .45s var(--ease)}
.pack::before{content:"";position:absolute;left:0;top:34px;bottom:34px;width:2px;background:var(--copper);transform:scaleY(0);transform-origin:50% 0;transition:transform .5s var(--ease)}
.pack h3{font-size:clamp(28px,2.8vw,44px);font-weight:300;letter-spacing:-.03em;line-height:1.05;transition:transform .5s var(--ease)}
.pack p{font-size:clamp(18px,1.5vw,21px);color:var(--steel);line-height:1.45;max-width:58ch;transition:color .45s var(--ease)}
.pack:hover{background:rgba(13,16,19,.035)}
.pack:hover::before{transform:scaleY(1)}
.pack:hover h3{transform:translateX(18px)}
.pack:hover p{color:var(--ink)}
@media (max-width:760px){.pack{grid-template-columns:1fr}.pack:hover h3{transform:none}}
.billing{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:16px clamp(24px,4vw,64px);margin-top:clamp(40px,5vw,64px);align-items:baseline}
.billing-lead{font-size:15px;font-weight:500;color:var(--ink)}
.units{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}
.units li{padding:16px 16px 0 0;font-size:15px;color:var(--steel)}
.units li+li{padding-left:16px;border-left:1px solid var(--line)}
@media (max-width:760px){.billing{grid-template-columns:1fr}.units{grid-template-columns:1fr 1fr}.units li:nth-child(3){padding-left:0;border-left:0}.units li{padding-bottom:12px}}

/* Provisioning: image beside a three-step line that fills on scroll */
.prov-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px clamp(32px,6vw,112px);align-items:start}
.prov-media{position:sticky;top:110px}
.prov-media .clip{aspect-ratio:4/5}
@media (max-width:960px){.prov-grid{grid-template-columns:1fr}.prov-media{position:relative;top:0}.prov-media .clip{aspect-ratio:16/10}}
.prov{position:relative;display:flex;flex-direction:column}
.prov-line{position:absolute;left:7px;top:14px;bottom:14px;width:1px;background:var(--line-dark)}
.prov-line i{position:absolute;inset:0;background:var(--copper);transform-origin:50% 0;transform:scaleY(0)}
.prov-step{position:relative;display:grid;grid-template-columns:15px minmax(0,1fr);gap:10px 32px;padding:10px 0 56px}
.prov-step:last-child{padding-bottom:0}
.prov-step .node{grid-row:1 / span 2;width:15px;height:15px;margin-top:14px;border-radius:50%;border:1px solid rgba(242,243,244,.4);background:var(--night);transition:background .5s var(--ease),border-color .5s var(--ease)}
.prov-step.on .node{background:var(--copper);border-color:var(--copper)}
.prov-step h3{font-size:clamp(30px,3vw,46px);font-weight:300;letter-spacing:-.035em;line-height:1.05;color:rgba(242,243,244,.5);transition:color .5s var(--ease)}
.prov-step.on h3{color:var(--paper)}
.prov-step p{font-size:18px;color:var(--mist);max-width:50ch}

/* v2 edits */
.br-wide{display:none}
@media (min-width:1100px){.br-wide{display:inline}}
.sub-hero h1{max-width:none}
.store .ic{color:var(--copper);margin-bottom:6px}
.pack{grid-template-columns:56px minmax(0,4fr) minmax(0,8fr)}
.pack .n{font-size:15px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--steel);transition:color .45s var(--ease)}
.pack:hover .n{color:var(--copper)}
.billing{grid-template-columns:56px minmax(0,4fr) minmax(0,8fr)}
.billing::before{content:""}
@media (max-width:760px){.pack{grid-template-columns:40px minmax(0,1fr)}.pack p{grid-column:2}.billing{grid-template-columns:1fr}.billing::before{display:none}}
/* Access tiers: both H3s on one line, sized to the column width, so the two columns align */
.tier p:last-child{max-width:none}
@media (min-width:861px){.tier h3{white-space:nowrap;font-size:calc((min(100vw, 1360px) - 2 * var(--gutter) - clamp(24px,3vw,48px)) / 2 / var(--k, 17.3))}}
/* Provisioning line runs from the first circle's centre to the last (set in script) */
.prov-line{bottom:auto}

/* v3 edits */
.store-grid{border:1px solid var(--line-dark)}
.store,.store:first-child{padding:34px clamp(20px,2.4vw,34px) 40px}
@media (max-width:960px){.store:nth-child(3){padding-left:clamp(20px,2.4vw,34px)}.store:nth-child(3){border-left:0}}
@media (max-width:560px){.store{padding:30px 22px 34px!important}}
.pack{padding-left:28px;padding-right:12px}
.pack::before{left:0}
@media (max-width:760px){.pack{padding-left:22px}}
/* hero placeholder label sits clear of the headline on every inner page */
.sub-hero .ph-tag{top:calc(18% + 60px)}
@media (max-width:760px){.sub-hero .ph-tag{top:205px}}