/* =========================================================
   HEAVENS INTERNATIONAL LEARNING CENTRE
   Visual language: a printed school prospectus —
   ink navy, antique gold, ivory paper, hairline rules,
   classical serif headings, no rounded corners.
   ========================================================= */

:root{
  --navy:#0D1B39;
  --navy-2:#15264C;
  --navy-3:#1E3260;
  --gold:#C6A052;
  --gold-2:#E2C88E;
  --gold-3:#8A6E31;
  --ivory:#F7F3EB;
  --ivory-2:#FCFAF6;
  --paper:#FFFFFF;
  --text:#23293C;
  --muted:#666E85;
  --line:rgba(13,27,57,.14);
  --line-2:rgba(255,255,255,.18);
  --display:"Cormorant Garamond","Garamond","Times New Roman",serif;
  --sans:"Jost","Futura","Century Gothic",system-ui,-apple-system,sans-serif;
  --pad:clamp(20px,5vw,64px);
  --shadow:0 30px 70px rgba(13,27,57,.16);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--ivory);color:var(--text);
  font-family:var(--sans);font-weight:400;font-size:clamp(15px,1.02vw,16.5px);
  line-height:1.75;letter-spacing:.005em;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
p{margin:0 0 1.2em}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:500;line-height:1.08;letter-spacing:-.01em;color:var(--navy)}
::selection{background:var(--navy);color:var(--gold-2)}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

/* ---------------- layout ---------------- */
.wrap{width:min(1280px,100% - var(--pad)*2);margin-inline:auto}
.narrow{width:min(760px,100% - var(--pad)*2);margin-inline:auto}
.mid{width:min(1000px,100% - var(--pad)*2);margin-inline:auto}
.section{padding:clamp(72px,10vw,150px) 0;position:relative}
.section--sm{padding:clamp(52px,6vw,92px) 0}
.center{text-align:center}

/* ---------------- type ---------------- */
.label{
  font-family:var(--sans);font-size:.66rem;font-weight:500;letter-spacing:.3em;
  text-transform:uppercase;color:var(--gold-3);display:block;margin-bottom:1.4rem
}
.label--light{color:var(--gold-2)}
.num-label{display:flex;align-items:center;gap:1rem;margin-bottom:1.6rem}
.num-label i{
  font-family:var(--display);font-style:normal;font-size:1.5rem;color:var(--gold);line-height:1
}
.num-label span{
  font-size:.66rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)
}
.num-label::after{content:"";flex:1;height:1px;background:var(--line);max-width:180px}
.num-label--light span{color:rgba(255,255,255,.62)}
.num-label--light::after{background:var(--line-2)}

.d1{font-size:clamp(3rem,7.4vw,6.4rem);line-height:1.02;font-weight:400}
.d2{font-size:clamp(2.3rem,4.6vw,4rem);font-weight:400}
.d3{font-size:clamp(1.7rem,2.6vw,2.5rem);font-weight:500}
.d4{font-size:clamp(1.25rem,1.6vw,1.5rem);font-weight:600}
h1 em,h2 em,h3 em,.italic{font-family:var(--display);font-style:italic;color:var(--gold-3)}
.lead{font-size:clamp(1.02rem,1.24vw,1.16rem);color:var(--muted);max-width:64ch;line-height:1.85}
.big-quote{
  font-family:var(--display);font-size:clamp(1.5rem,2.9vw,2.5rem);line-height:1.34;
  color:var(--navy);font-weight:400
}
.muted{color:var(--muted)}
.rule{height:1px;background:var(--gold);width:72px;margin:1.8rem 0;transform-origin:left}
.rule--center{margin-inline:auto}
.rule--light{background:var(--gold-2)}

/* ---------------- buttons ---------------- */
.btn{
  --bg:var(--navy);--fg:#fff;--bd:var(--navy);
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.7em;
  padding:1.05em 2.1em;border:1px solid var(--bd);background:transparent;color:var(--fg);
  font-size:.68rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;
  overflow:hidden;transition:color .45s ease,border-color .45s ease
}
.btn::before{
  content:"";position:absolute;inset:0;background:var(--bg);transform:scaleY(1);transform-origin:bottom;
  transition:transform .45s cubic-bezier(.7,0,.2,1);z-index:-1
}
.btn>*{position:relative;z-index:1}
.btn:hover::before{transform:scaleY(0)}
.btn:hover{color:var(--bg)}
.btn svg{width:16px;height:16px;position:relative;z-index:1}
.btn--gold{--bg:var(--gold);--bd:var(--gold);--fg:var(--navy)}
.btn--gold:hover{color:var(--gold-3);border-color:var(--gold)}
.btn--outline{--bg:transparent;--bd:var(--navy);--fg:var(--navy)}
.btn--outline::before{background:var(--navy);transform:scaleY(0)}
.btn--outline:hover::before{transform:scaleY(1)}
.btn--outline:hover{color:#fff}
.btn--light{--bd:rgba(255,255,255,.5);--bg:transparent;--fg:#fff}
.btn--light::before{background:#fff;transform:scaleY(0)}
.btn--light:hover::before{transform:scaleY(1)}
.btn--light:hover{color:var(--navy);border-color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.link-arrow{
  display:inline-flex;align-items:center;gap:.7em;font-size:.68rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--navy);padding-bottom:.5em;border-bottom:1px solid var(--gold);
  transition:gap .35s ease,color .35s
}
.link-arrow:hover{gap:1.3em;color:var(--gold-3)}
.link-arrow--light{color:#fff;border-color:var(--gold-2)}

/* ---------------- header ---------------- */
.hdr{
  position:fixed;inset:0 0 auto 0;z-index:90;padding:20px 0;
  transition:padding .4s ease,background .4s ease,box-shadow .4s ease
}
.hdr::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line-2);opacity:1;transition:opacity .4s}
.hdr.is-stuck{background:rgba(247,243,235,.94);backdrop-filter:blur(12px);padding:10px 0;
  box-shadow:0 1px 0 var(--line)}
.hdr.is-stuck::after{opacity:0}
.hdr__in{display:flex;align-items:center;gap:26px}
.brand{display:flex;align-items:center;gap:14px}
.brand img{width:50px;transition:width .4s ease}
.hdr.is-stuck .brand img{width:40px}
.brand__name{font-family:var(--display);font-size:1.32rem;letter-spacing:.16em;color:#fff;line-height:1;display:block;font-weight:600}
.brand__sub{font-size:.52rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.7);display:block;margin-top:5px}
.hdr.is-stuck .brand__name{color:var(--navy)}
.hdr.is-stuck .brand__sub{color:var(--gold-3)}
.hdr--solid .brand__name{color:var(--navy)}
.hdr--solid .brand__sub{color:var(--gold-3)}
.nav{margin-left:auto;display:flex;align-items:center;gap:30px}
.nav a{
  font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.86);
  position:relative;padding-bottom:6px;transition:color .35s
}
.hdr.is-stuck .nav a,.hdr--solid .nav a{color:var(--navy)}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);transition:width .4s cubic-bezier(.7,0,.2,1)}
.nav a:hover::after,.nav a[aria-current="page"]::after{width:100%}
.nav a[aria-current="page"]{color:var(--gold-2)}
.hdr.is-stuck .nav a[aria-current="page"],.hdr--solid .nav a[aria-current="page"]{color:var(--gold-3)}
.hdr .btn{padding:.85em 1.6em}
.burger{
  display:none;width:44px;height:44px;border:1px solid rgba(255,255,255,.45);background:transparent;
  cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:6px;margin-left:auto
}
.hdr.is-stuck .burger,.hdr--solid .burger{border-color:var(--line)}
.burger span{width:16px;height:1px;background:#fff;transition:transform .35s,opacity .35s}
.hdr.is-stuck .burger span,.hdr--solid .burger span{background:var(--navy)}
.burger.is-open span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:0;transform:translateY(0)}
.burger.is-open span:nth-child(3){transform:translateY(-3.5px) rotate(-45deg)}
.mnav{
  position:fixed;inset:0;z-index:85;background:var(--navy);display:grid;place-content:center;gap:4px;
  text-align:center;opacity:0;pointer-events:none;transition:opacity .5s ease
}
.mnav.is-open{opacity:1;pointer-events:auto}
.mnav a{font-family:var(--display);font-size:clamp(1.9rem,8vw,2.9rem);color:#fff;padding:.16em 0;transition:color .3s}
.mnav a:hover{color:var(--gold-2)}
.mnav .btn{margin-top:26px;justify-self:center}

/* ---------------- hero ---------------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--navy)}
.hero__media{position:absolute;inset:0;z-index:0}
.hero__media img{width:100%;height:120%;object-fit:cover;object-position:center 30%;will-change:transform}
.hero__media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(13,27,57,.68) 0%,rgba(13,27,57,.32) 30%,rgba(13,27,57,.56) 62%,rgba(13,27,57,.95) 100%)
}
.hero__in{position:relative;z-index:2;width:100%;padding:clamp(120px,13vw,150px) 0 0;text-align:center}
.hero__eyebrow{display:flex;flex-wrap:wrap;justify-content:center;column-gap:0;margin-bottom:1.7rem}
.hero__eyebrow span{
  font-size:.66rem;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-2);
  padding:0 1.1em;position:relative;line-height:1.6
}
.hero__eyebrow span+span::before{
  content:"";position:absolute;left:0;top:50%;width:1px;height:11px;background:rgba(255,255,255,.35);transform:translateY(-50%)
}
@media (max-width:420px){
  .hero__eyebrow{gap:.45rem 1rem}
  .hero__eyebrow span{padding:0}
  .hero__eyebrow span+span::before{display:none}
}
.hero h1{color:#fff;max-width:19ch;margin-inline:auto}
.hero h1 .wd{display:inline-block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.hero h1 .wd>span{display:inline-block}
.hero .lead{color:rgba(255,255,255,.78);max-width:54ch;margin:1.9rem auto 0}
.hero .btn-row{margin-top:2.6rem;justify-content:center}
.hero__facts{
  display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-2);
  margin-top:clamp(30px,4.4vw,58px);position:relative
}
.hero__facts::before{content:"";position:absolute;top:-1px;left:50%;width:64px;height:1px;background:var(--gold);transform:translateX(-50%)}
.hero__facts div{padding:1.35rem 1.6rem 1.6rem;border-right:1px solid var(--line-2);text-align:center}
.hero__facts div:last-child{border-right:0}
.hero__facts b{display:block;font-family:var(--display);font-size:clamp(1.5rem,2.3vw,2.05rem);color:#fff;font-weight:500;line-height:1.2}
.hero__facts span{font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-2);display:block;margin-top:.55rem}
@media (max-width:720px){
  .hero__facts{grid-template-columns:1fr}
  .hero__facts div{border-right:0;border-bottom:1px solid var(--line-2);padding-left:0}
  .hero__facts div:last-child{border-bottom:0}
}
.scroll-cue{
  position:absolute;right:var(--pad);bottom:34px;z-index:3;display:flex;align-items:center;gap:14px;
  font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.6)
}
.scroll-cue i{display:block;width:56px;height:1px;background:rgba(255,255,255,.4);position:relative;overflow:hidden}
.scroll-cue i::after{content:"";position:absolute;inset:0;background:var(--gold);animation:sweep 2.4s infinite}
@keyframes sweep{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}
@media (max-width:900px){.scroll-cue{display:none}}

/* page hero */
.phero{position:relative;background:var(--navy);overflow:hidden;padding:clamp(150px,20vw,240px) 0 clamp(60px,8vw,110px)}
.phero__media{position:absolute;inset:0;z-index:0;opacity:.42}
.phero__media img{width:100%;height:118%;object-fit:cover}
.phero::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(13,27,57,.86),rgba(13,27,57,.66) 60%,rgba(13,27,57,.92))}
.phero__in{position:relative;z-index:2}
.phero h1{color:#fff;max-width:18ch}
.phero .lead{color:rgba(255,255,255,.76);margin-top:1.6rem}
.crumbs{font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-2);margin-bottom:1.6rem}
.crumbs a{color:rgba(255,255,255,.6)}
.crumbs a:hover{color:#fff}

/* ---------------- photos ---------------- */
.ph{position:relative;margin:0;overflow:hidden;background:var(--navy-2)}
.ph img{width:100%;height:100%;object-fit:cover;will-change:transform}
.ph--fallback::after{
  content:"HEAVENS";position:absolute;inset:0;display:grid;place-items:center;
  background:linear-gradient(150deg,var(--navy),var(--navy-3));color:var(--gold);
  font-family:var(--display);font-size:1.4rem;letter-spacing:.3em
}
.ph--tall{aspect-ratio:3/4}
.ph--port{aspect-ratio:4/5}
.ph--sq{aspect-ratio:1}
.ph--wide{aspect-ratio:16/10}
.ph--pano{aspect-ratio:21/9}
.ph__cap{
  position:absolute;left:0;bottom:0;background:var(--ivory);padding:.85em 1.4em;
  font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--navy)
}
.ph-frame{position:relative}
.ph-frame::before{
  content:"";position:absolute;inset:26px -26px -26px 26px;border:1px solid var(--gold);z-index:0;pointer-events:none
}
.ph-frame .ph{position:relative;z-index:1}
@media (max-width:700px){.ph-frame::before{inset:16px -16px -16px 16px}}

/* ---------------- split ---------------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.split--wide{grid-template-columns:1.15fr 1fr}
.split--narrow{grid-template-columns:1fr 1.15fr}
.split--rev .split__media{order:2}
.split--top{align-items:start}
@media (max-width:920px){
  .split,.split--wide,.split--narrow{grid-template-columns:1fr}
  .split--rev .split__media{order:0}
}

/* ---------------- stat band ---------------- */
.band-navy{background:var(--navy);color:#fff}
.band-navy h2,.band-navy h3{color:#fff}
.band-navy .lead{color:rgba(255,255,255,.72)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.stats div{padding:clamp(30px,4vw,54px) 1.4rem;border-right:1px solid var(--line-2);text-align:center}
.stats div:last-child{border-right:0}
.stats b{display:block;font-family:var(--display);font-size:clamp(2.4rem,4.4vw,3.6rem);font-weight:400;color:var(--gold-2);line-height:1}
.stats span{display:block;margin-top:.9rem;font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.66)}
@media (max-width:820px){.stats{grid-template-columns:1fr 1fr}
  .stats div:nth-child(2){border-right:0}
  .stats div:nth-child(1),.stats div:nth-child(2){border-bottom:1px solid var(--line-2)}}

/* ---------------- numbered list grid ---------------- */
.feats{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--line)}
.feats article{padding:clamp(28px,3.4vw,48px) clamp(20px,3vw,44px);border-bottom:1px solid var(--line);border-right:1px solid var(--line)}
.feats article:nth-child(2n){border-right:0}
.feats article:nth-child(2n+1){padding-left:0}
.feats i{font-family:var(--display);font-style:normal;font-size:1.05rem;color:var(--gold);letter-spacing:.1em}
.feats h3{margin:.9rem 0 .7rem;font-size:1.45rem}
.feats p{margin:0;color:var(--muted);font-size:.95rem}
@media (max-width:820px){
  .feats{grid-template-columns:1fr}
  .feats article{border-right:0;padding-left:0;padding-right:0}
}

/* ---------------- advantage cards (icon grid) ---------------- */
.adv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.adv-card{
  background:var(--ivory-2);padding:clamp(28px,3vw,40px) clamp(24px,2.6vw,34px);
  position:relative;overflow:hidden;transition:background .45s ease
}
.adv-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.7,0,.2,1)
}
.adv-card:hover{background:var(--paper)}
.adv-card:hover::before{transform:scaleX(1)}
.adv-card:hover svg{transform:translateY(-2px)}
.adv-card__top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:1.4rem}
.adv-card svg{width:30px;height:30px;color:var(--gold);transition:transform .4s ease}
.adv-card__no{
  font-family:var(--display);font-style:normal;font-size:.82rem;letter-spacing:.06em;color:var(--muted)
}
.adv-card h3{font-size:1.26rem;margin-bottom:.65rem}
.adv-card p{margin:0;color:var(--muted);font-size:.94rem;line-height:1.7}
@media (max-width:1080px){.adv-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.adv-grid{grid-template-columns:1fr}}

/* ---------------- prospectus contents list ---------------- */
.contents{border-top:1px solid var(--line);margin-top:2.4rem}
.contents li{
  list-style:none;display:flex;align-items:baseline;gap:1rem;padding:1.15rem 0;border-bottom:1px solid var(--line)
}
.contents ul{margin:0;padding:0}
.contents .nm{font-family:var(--display);font-size:1.5rem;color:var(--navy);white-space:nowrap;font-weight:500}
.contents .dots{flex:1;height:1px;background:repeating-linear-gradient(to right,var(--line) 0 3px,transparent 3px 8px);transform:translateY(-4px)}
.contents .meta{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);white-space:nowrap}

/* ---------------- gallery rail ---------------- */
.rail{overflow:hidden;position:relative}
.rail__track{display:flex;gap:clamp(16px,2.4vw,34px);will-change:transform;padding-bottom:6px}
.rail__item{flex:0 0 clamp(260px,30vw,420px)}
.rail__item .ph{aspect-ratio:4/5}
.rail__item h3{font-size:1.3rem;margin:1.2rem 0 .4rem}
.rail__item p{color:var(--muted);font-size:.92rem;margin:0}
@media (max-width:900px){
  .rail__track{overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:16px}
  .rail__item{flex-basis:74vw;scroll-snap-align:center}
}

/* ---------------- timeline ---------------- */
.tl{border-top:1px solid var(--line)}
.tl__row{display:grid;grid-template-columns:180px 1fr;gap:clamp(16px,3vw,50px);padding:clamp(22px,2.6vw,34px) 0;border-bottom:1px solid var(--line)}
.tl__t{font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-3);padding-top:.5rem}
.tl__h{font-size:1.4rem;margin-bottom:.4rem}
.tl__row p{margin:0;color:var(--muted)}
@media (max-width:700px){.tl__row{grid-template-columns:1fr;gap:6px}}

/* ---------------- fee sheet ---------------- */
.sheet{background:var(--paper);padding:clamp(30px,4.6vw,68px);border:1px solid var(--line)}
.sheet__row{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:baseline;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.sheet__row:last-of-type{border-bottom:0}
.sheet__row h3{font-size:1.4rem;margin-bottom:.35rem}
.sheet__row p{margin:0;color:var(--muted);font-size:.94rem;max-width:52ch}
.sheet__amt{font-family:var(--display);font-size:clamp(1.7rem,3vw,2.4rem);color:var(--gold-3);text-align:right;white-space:nowrap;font-weight:500}
.sheet__amt small{display:block;font-family:var(--sans);font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:.4rem}
@media (max-width:620px){.sheet__row{grid-template-columns:1fr}.sheet__amt{text-align:left}}
.notice{border-left:2px solid var(--gold);background:var(--ivory);padding:1.4rem 1.7rem;margin-top:2.4rem}
.notice strong{display:block;font-family:var(--display);font-size:1.25rem;color:var(--navy);margin-bottom:.5rem;font-weight:600}
.notice p{margin:0;font-size:.95rem;color:var(--text)}
.notice u{text-decoration:none;box-shadow:inset 0 -8px 0 rgba(198,160,82,.3)}

/* ---------------- cards (policies etc) ---------------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.cards article{background:var(--ivory-2);padding:clamp(26px,3vw,42px);transition:background .5s ease}
.cards article:hover{background:var(--paper)}
.cards h3{font-size:1.35rem;margin:1rem 0 .7rem}
.cards p{margin:0;color:var(--muted);font-size:.95rem}
.cards i{font-family:var(--display);font-style:normal;color:var(--gold);font-size:1rem;letter-spacing:.1em}

/* ---------------- quote band ---------------- */
.quote-band{position:relative;background:var(--navy);color:#fff;overflow:hidden;padding:clamp(70px,10vw,140px) 0;text-align:center}
.quote-band__media{position:absolute;inset:0;opacity:.2}
.quote-band__media img{width:100%;height:100%;object-fit:cover}
.quote-band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,27,57,.9),rgba(13,27,57,.78))}
.quote-band>.wrap{position:relative;z-index:2}
.quote-band .big-quote{color:#fff}
.mark{display:block;width:34px;height:34px;margin:0 auto 2rem}

/* ---------------- accordion ---------------- */
.acc{border-top:1px solid var(--line)}
.acc__item{border-bottom:1px solid var(--line)}
.acc__btn{
  width:100%;background:none;border:0;text-align:left;padding:1.5rem 52px 1.5rem 0;cursor:pointer;position:relative;
  font-family:var(--display);font-size:clamp(1.15rem,1.8vw,1.45rem);color:var(--navy);font-weight:500;transition:color .3s
}
.acc__btn:hover{color:var(--gold-3)}
.acc__btn::before,.acc__btn::after{content:"";position:absolute;right:6px;top:50%;background:var(--gold);transition:transform .4s cubic-bezier(.7,0,.2,1)}
.acc__btn::before{width:16px;height:1px}
.acc__btn::after{width:1px;height:16px;right:13.5px;margin-top:-8px}
.acc__item.is-open .acc__btn::after{transform:rotate(90deg)}
.acc__panel{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.7,0,.2,1)}
.acc__panel div{padding:0 0 1.6rem;color:var(--muted);max-width:70ch}

/* ---------------- contact rows ---------------- */
.crows{border-top:1px solid var(--line)}
.crow{display:grid;grid-template-columns:200px 1fr auto;gap:clamp(14px,3vw,40px);align-items:center;
  padding:clamp(20px,2.4vw,30px) 0;border-bottom:1px solid var(--line)}
.crow__k{font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-3)}
.crow__v{font-family:var(--display);font-size:clamp(1.2rem,2vw,1.6rem);color:var(--navy)}
.crow__v a:hover{color:var(--gold-3)}
@media (max-width:760px){.crow{grid-template-columns:1fr;gap:6px}}

/* ---------------- forms ---------------- */
.form{display:grid;gap:22px}
.form__grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media (max-width:560px){.form__grid{grid-template-columns:1fr}}
.field{position:relative;display:grid;gap:8px}
.field label{font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{
  width:100%;padding:.9em 0;border:0;border-bottom:1px solid var(--line);background:transparent;
  font:inherit;font-size:.98rem;color:var(--navy);transition:border-color .35s
}
.field select{padding-left:0}
.field textarea{min-height:96px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:#A6ABBA}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--gold)}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-bottom-color:#B4472F}
.form__note{font-size:.78rem;color:var(--muted);margin:0}
.form__ok{display:none;border:1px solid var(--gold);padding:1rem 1.3rem;font-size:.9rem;color:var(--navy);background:var(--ivory)}
.form__ok.show{display:block}
.form-panel{background:var(--paper);border:1px solid var(--line);padding:clamp(26px,3.4vw,48px)}

/* ---------------- modal ---------------- */
.modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:16px;visibility:hidden}
.modal.is-open{visibility:visible}
.modal__bg{position:absolute;inset:0;background:rgba(13,27,57,.72);opacity:0;transition:opacity .45s}
.modal.is-open .modal__bg{opacity:1}
.modal__box{
  position:relative;width:min(680px,100%);max-height:92vh;overflow:auto;background:var(--ivory);
  padding:clamp(28px,4vw,52px);opacity:0;transform:translateY(24px);transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1);
  box-shadow:var(--shadow);border-top:2px solid var(--gold)
}
.modal.is-open .modal__box{opacity:1;transform:none}
.modal__x{position:absolute;top:18px;right:18px;width:40px;height:40px;border:1px solid var(--line);background:transparent;cursor:pointer;
  font-size:1rem;color:var(--navy);transition:background .3s,color .3s}
.modal__x:hover{background:var(--navy);color:#fff}

/* ---------------- footer ---------------- */
.ftr{background:var(--navy);color:rgba(255,255,255,.7);padding:clamp(60px,8vw,110px) 0 34px}
.ftr__top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:clamp(28px,4vw,60px)}
@media (max-width:900px){.ftr__top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ftr__top{grid-template-columns:1fr}}
.ftr h4{font-family:var(--sans);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-2);margin-bottom:1.5rem;font-weight:500}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:.85rem;font-size:.92rem}
.ftr a:hover{color:var(--gold-2)}
.ftr__badge{width:78px;background:#fff;padding:10px;margin-bottom:22px}
.ftr__name{font-family:var(--display);font-size:1.5rem;color:#fff;letter-spacing:.1em;margin-bottom:.6rem;display:block}
.ftr__tag{font-family:var(--display);font-style:italic;color:var(--gold-2);font-size:1.15rem;margin-top:1.2rem}
.ftr__btm{margin-top:clamp(40px,5vw,70px);padding-top:26px;border-top:1px solid var(--line-2);
  display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;font-size:.74rem;letter-spacing:.06em;color:rgba(255,255,255,.45)}

/* floating enquiry */
.fab{
  position:fixed;right:0;bottom:18%;z-index:80;background:var(--gold);color:var(--navy);
  padding:1.25em 1.05em;writing-mode:vertical-rl;font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;
  transition:background .35s,color .35s
}
.fab:hover{background:var(--navy);color:#fff}
@media (max-width:760px){
  .fab{writing-mode:horizontal-tb;right:14px;bottom:14px;padding:1em 1.4em;box-shadow:var(--shadow)}
}

/* reveal states — applied only when GSAP is present */
.gsap-on [data-fade]{opacity:0}
.gsap-on [data-stagger]>*{opacity:0}
.gsap-on [data-curtain] img{transform:scale(1.18)}
.gsap-on [data-curtain]{clip-path:inset(0 0 100% 0)}
.gsap-on .rule[data-line]{transform:scaleX(0)}

@media (prefers-reduced-motion:reduce){
  .gsap-on [data-fade],.gsap-on [data-stagger]>*{opacity:1!important;transform:none!important}
  .gsap-on [data-curtain]{clip-path:none!important}
  .gsap-on [data-curtain] img{transform:none!important}
  .scroll-cue i::after{animation:none}
  html{scroll-behavior:auto}
}

@media (max-width:1080px){
  .nav{display:none}
  .burger{display:flex}
  .hdr .btn{display:none}
}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* small-screen refinements */
@media (max-width:620px){
  .contents li{flex-wrap:wrap;gap:.2rem 1rem;padding:1rem 0}
  .contents .nm{white-space:normal;flex:1 1 100%;font-size:1.15rem}
  .contents .dots{display:none}
  .contents .meta{flex:none}
  .crow{padding:1.1rem 0}
  .sheet__amt{text-align:left}
}
@media (max-width:420px){
  .btn{padding:1em 1.4em;letter-spacing:.18em}
}

/* short laptop screens: keep the hero on one screen */
@media (min-width:900px) and (max-height:960px){
  .hero .d1{font-size:clamp(2.6rem,4.6vw,3.7rem)}
  .hero__in{padding-top:105px}
  .hero .lead{margin-top:1.2rem}
  .hero .btn-row{margin-top:1.7rem}
  .hero__facts{margin-top:28px}
  .hero__facts div{padding-top:1.1rem;padding-bottom:1.2rem}
  .scroll-cue{display:none}
}
