/* RAIN public pages — shared building blocks (loaded by rain/public_base.html).
   Black #111214 + metallic gold, Archivo. Mobile first: nothing scrolls sideways. */

/* page banner with a photo */
.pb { position:relative; background:var(--ink); color:#fff; overflow:hidden; }
.pb > img { position:absolute; inset:0; width:100%; height:100%; }
.pb::before { content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg, rgba(17,18,20,.95) 0%, rgba(17,18,20,.8) 45%, rgba(17,18,20,.3) 100%), linear-gradient(0deg, rgba(17,18,20,.55), transparent 50%); }
.pb .wrap { position:relative; z-index:2; padding-top:72px; padding-bottom:60px; }
.pb .kick { display:inline-flex; align-items:center; gap:10px; color:var(--gold-hi); font-weight:600; font-size:var(--t-sm); letter-spacing:.02em; }
.pb .kick i { width:8px; height:8px; border:2px solid var(--gold-hi); }
.pb h1 { font-size:clamp(2rem, 5vw, 3.4rem); font-stretch:118%; line-height:1.03; color:#fff; margin-top:14px; max-width:18ch; }
.pb p.lead { color:#D5D7DC; font-size:var(--t-lg); max-width:58ch; margin-top:14px; }
.pb .btns { display:flex; gap:10px; flex-wrap:wrap; margin-top:26px; }
.pb .btn-secondary { background:transparent; color:#fff; border-color:#5A5E68; }
.pb .btn-secondary:hover { border-color:var(--gold-hi); color:var(--gold-hi); }
@media (max-width:760px) { .pb::before { background:linear-gradient(0deg, rgba(17,18,20,.97) 40%, rgba(17,18,20,.6) 100%); } .pb .wrap { padding-top:56px; padding-bottom:40px; } }

/* jump menu: wraps into chips — never a sideways scroll */
.jump { position:sticky; top:64px; z-index:15; background:rgba(255,255,255,.96); backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }
.jump .wrap { display:flex; flex-wrap:wrap; gap:6px; padding-top:10px; padding-bottom:10px; }
.jump a { padding:6px 12px; border-radius:999px; border:1px solid var(--line-2); font-size:var(--t-sm); font-weight:600; color:var(--text-2); text-decoration:none; background:#fff; }
.jump a:hover, .jump a.on { background:var(--ink); color:#fff; border-color:var(--ink); }
@media (max-width:760px) { .jump { position:static; } .jump a { font-size:.8125rem; padding:6px 10px; } }

/* sections */
.sec { padding:64px 0 8px; scroll-margin-top:120px; }
.sec h2 { font-size:clamp(1.6rem, 3.4vw, 2.3rem); font-stretch:112%; color:var(--ink); line-height:1.1; }
.sec .eyebrow { display:block; font-size:var(--t-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--gold-text); font-weight:700; margin-bottom:10px; }
.sec p.sub { color:var(--text-2); font-size:var(--t-md); max-width:66ch; margin-top:10px; }
.soft { color:var(--text-2); }
.sec-dark { background:var(--ink); color:#E6E7EA; margin-top:64px; padding-bottom:64px; }
.sec-dark h2, .sec-dark h3 { color:#fff; } .sec-dark p.sub { color:#BFC3CB; }

/* programme split: photo + facts */
.split { display:grid; grid-template-columns:1.1fr 1fr; gap:34px; align-items:start; margin-top:26px; }
.split figure { margin:0; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/3; background:var(--canvas); }
.split figure img { width:100%; height:100%; }
@media (max-width:860px) { .split { grid-template-columns:1fr; gap:20px; } }
.facts { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; margin:18px 0; }
.facts div { background:#fff; padding:14px 16px; }
.facts b { display:block; color:var(--ink); font-size:var(--t-lg); font-stretch:108%; }
.facts span { color:var(--text-3); font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.08em; font-weight:600; }

/* accordion (curriculum) */
.acc { border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; margin-top:18px; background:#fff; }
.acc details + details { border-top:1px solid var(--line); }
.acc summary { list-style:none; cursor:pointer; display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; padding:16px 18px; }
.acc summary::-webkit-details-marker { display:none; }
.acc summary .n { font-size:var(--t-xs); font-weight:700; color:var(--gold-text); background:var(--gold-wash); border-radius:6px; padding:4px 8px; white-space:nowrap; }
.acc summary b { display:block; color:var(--ink); font-size:var(--t-md); }
.acc summary small { color:var(--text-3); }
.acc summary::after { content:"+"; font-size:22px; color:var(--text-3); line-height:1; }
.acc details[open] summary::after { content:"–"; }
.acc ol { list-style:none; margin:0; padding:0 18px 16px; counter-reset:m; display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; }
.acc li { counter-increment:m; padding:10px 0 10px 34px; position:relative; border-top:1px dashed var(--line); }
.acc li::before { content:counter(m, decimal-leading-zero); position:absolute; left:0; top:10px; font:600 12px var(--mono, monospace); color:var(--gold-text); }
.acc li b { display:block; color:var(--ink); font-size:var(--t-sm); }
.acc li span { color:var(--text-2); font-size:var(--t-sm); }
@media (max-width:760px) { .acc ol { grid-template-columns:1fr; } .acc summary { grid-template-columns:1fr auto; } .acc summary .n { grid-column:1 / -1; justify-self:start; } }

/* chips + cards */
.chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }
.chips span { font-size:var(--t-xs); font-weight:600; padding:5px 10px; border-radius:999px; background:var(--canvas); border:1px solid var(--line); color:var(--text); }
.cards { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:14px; margin-top:24px; }
.card-p { border:1px solid var(--line); border-radius:var(--r-lg); padding:20px; background:#fff; display:flex; flex-direction:column; gap:8px; }
.card-p h3 { font-size:var(--t-lg); color:var(--ink); }
.card-p p { color:var(--text-2); font-size:var(--t-sm); margin:0; }
.card-p .meta { font-size:var(--t-xs); color:var(--text-3); font-weight:600; text-transform:uppercase; letter-spacing:.06em; }
.card-p .go { margin-top:auto; padding-top:8px; }
.card-photo { border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:#fff; display:flex; flex-direction:column; }
.card-photo figure { margin:0; aspect-ratio:16/10; overflow:hidden; } .card-photo figure img { width:100%; height:100%; transition:transform .6s var(--ease); }
.card-photo:hover figure img { transform:scale(1.04); }
.card-photo .body { padding:18px 20px 20px; display:flex; flex-direction:column; gap:6px; flex:1; }
.card-photo h3 { font-size:var(--t-lg); color:var(--ink); } .card-photo p { color:var(--text-2); font-size:var(--t-sm); margin:0; }

/* quotes */
.quotes { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:14px; margin-top:24px; }
.quotes blockquote { margin:0; border-left:3px solid var(--gold); background:var(--gold-wash); padding:18px 20px; border-radius:0 var(--r-lg) var(--r-lg) 0; }
.quotes blockquote p { color:var(--ink); font-size:var(--t-md); line-height:1.55; margin:0 0 10px; }
.quotes cite { font-style:normal; font-size:var(--t-sm); color:var(--text-2); } .quotes cite b { color:var(--ink); display:block; }

/* fee calculator */
.calc { border:1px solid var(--line); border-radius:var(--r-lg); background:#fff; overflow:hidden; margin-top:22px; }
.calc .top { background:var(--ink); color:#fff; padding:18px 20px; display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; }
.calc .top select { max-width:100%; }
.calc .total { font-size:var(--t-2xl); font-weight:750; font-stretch:112%; color:var(--gold-hi); }
.calc .plan { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:1px; background:var(--line); }
.calc .plan div { background:#fff; padding:16px 20px; }
.calc .plan b { display:block; font-size:var(--t-xl); color:var(--ink); }
.calc .plan span { color:var(--text-2); font-size:var(--t-sm); }
.calc .note { padding:14px 20px; background:var(--gold-wash); color:var(--ink); font-size:var(--t-sm); }

/* call to action band */
.cta-band { background:var(--ink); color:#fff; border-radius:var(--r-lg); padding:34px; margin:56px 0 0; display:flex; justify-content:space-between; align-items:center; gap:22px; flex-wrap:wrap; position:relative; overflow:hidden; }
.cta-band h2 { color:#fff; font-size:var(--t-2xl); } .cta-band p { color:#C9CCD3; margin:6px 0 0; max-width:56ch; }
.cta-band .btns { display:flex; gap:10px; flex-wrap:wrap; }
.cta-band .btn-secondary { background:transparent; color:#fff; border-color:#5A5E68; }

/* simple content page (privacy, legal) */
.prose { max-width:760px; } .prose h2 { font-size:var(--t-xl); color:var(--ink); margin:34px 0 10px; } .prose h3 { font-size:var(--t-lg); color:var(--ink); margin:24px 0 8px; }
.prose p, .prose li { color:var(--text); line-height:1.7; } .prose ul, .prose ol { padding-left:22px; }

/* forms on public pages (admission) */
.pform { max-width:760px; margin:0 auto; }
.pform .card { border-radius:var(--r-lg); }
.pform label { display:block; font-weight:600; font-size:var(--t-sm); color:var(--ink); margin:14px 0 6px; }
.pform .row2 { display:grid; grid-template-columns:1fr 1fr; gap:0 16px; }
@media (max-width:640px) { .pform .row2 { grid-template-columns:1fr; } }
