/* Cloud Foundation Inc. — site styles (Apple-inspired: white, minimal, photo-led). Light only, by design. */
:root{
  --ink:#1d1d1f; --ink-soft:#424245; --ink-faint:#6e6e73;
  --bg:#fff; --bg-alt:#f5f5f7; --line:#d2d2d7;
  --blue:#0071e3; --blue-hover:#0077ed; --link:#0066cc;
  --teal:#00a98a;                       /* brand accent, used sparingly */
  --radius:22px; --radius-sm:14px;
  --max:68rem; --max-narrow:44rem;
  color-scheme: light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font:17px/1.47 -apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  letter-spacing:-.022em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:0}

/* ---------- header: slim, translucent ---------- */
.site-head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.8);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(0,0,0,.08)}
.site-head .wrap{display:flex;align-items:center;gap:1.25rem;min-height:52px;padding-top:6px;padding-bottom:6px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.55rem;color:var(--ink);flex:0 0 auto}
.brand:hover{text-decoration:none}
.brand img{width:38px;mix-blend-mode:multiply}
.brand b{font-size:.88rem;font-weight:600;line-height:1.15;letter-spacing:-.01em}
.brand span{display:block;font-size:.68rem;color:var(--ink-faint);font-weight:400}
nav{margin-left:auto;display:flex;gap:1.35rem;align-items:center;flex-wrap:wrap}
nav a{color:var(--ink);opacity:.8;font-size:.78rem;letter-spacing:-.01em}
nav a:hover,nav a.here{opacity:1;text-decoration:none}
nav a.here{font-weight:600}
nav .nav-give{opacity:1;background:var(--blue);color:#fff!important;padding:.32rem .95rem;border-radius:980px;font-weight:500}
nav .nav-give:hover{background:var(--blue-hover)}
@media (max-width:52rem){
  .site-head .wrap{gap:.4rem .9rem}
  nav{margin-left:0;width:100%;gap:.35rem 1rem;padding-bottom:.35rem;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  nav::-webkit-scrollbar{display:none}
  nav a{white-space:nowrap}
  .site-head .wrap{position:relative}
  nav .nav-give{position:absolute;right:22px;top:12px}   /* keep Give visible next to the logo */
}

/* ---------- type ---------- */
h1{font-size:clamp(2.4rem,6.2vw,4.5rem);line-height:1.06;letter-spacing:-.035em;font-weight:700;margin:0 0 1.1rem}
h2{font-size:clamp(1.9rem,4.4vw,3rem);line-height:1.08;letter-spacing:-.03em;font-weight:700;margin:0 0 1rem}
h3{font-size:1.3rem;line-height:1.2;letter-spacing:-.02em;font-weight:600;margin:0 0 .45rem}
h4{font-weight:600}
p{margin:0 0 1.05rem;max-width:var(--max-narrow)}
.lede{font-size:clamp(1.15rem,2.2vw,1.5rem);line-height:1.38;color:var(--ink-soft);margin:0;max-width:40rem;letter-spacing:-.02em}
.eyebrow{font-size:.95rem;font-weight:600;color:var(--teal);margin:0 0 .5rem;letter-spacing:-.01em}
.muted{color:var(--ink-faint)}.small{font-size:.88rem}
.crumb{font-size:.85rem;color:var(--ink-faint);margin:0 0 .9rem}
.crumb a{color:var(--ink-faint)}

/* ---------- sections ---------- */
section{padding:clamp(3.5rem,8vw,6.5rem) 0}
section.alt{background:var(--bg-alt)}
.hero,.hero.navy{padding:clamp(3.5rem,9vw,7rem) 0 clamp(2.5rem,6vw,4.5rem);background:var(--bg);color:var(--ink);border:0;text-align:center}
.hero h1,.hero .lede,.hero p{margin-left:auto;margin-right:auto}
.hero h1{max-width:18ch}
.hero .cta-row{justify-content:center}
.hero.navy .lede,.hero.navy .eyebrow,.hero.navy .crumb,.hero.navy .crumb a,.hero.navy .cta-note{color:inherit}
.hero.navy .lede{color:var(--ink-soft)}
.hero.navy .eyebrow{color:var(--teal)}
.hero.navy .crumb,.hero.navy .crumb a,.hero.navy .cta-note{color:var(--ink-faint)}
.center{text-align:center}.center p,.center .lede{margin-left:auto;margin-right:auto}

/* ---------- buttons: Apple pills ---------- */
.btn{display:inline-block;background:var(--blue);color:#fff;padding:.72rem 1.4rem;border-radius:980px;font-size:1.02rem;
  font-weight:400;letter-spacing:-.01em;border:1px solid var(--blue);cursor:pointer;line-height:1.2}
.btn:hover{background:var(--blue-hover);text-decoration:none}
.btn-quiet,.hero.navy .btn-quiet{background:var(--blue);color:#fff;border:0}
.btn-quiet:hover,.hero.navy .btn-quiet:hover{background:var(--blue-hover);color:#fff}
.textlink{font-size:1.05rem}
.textlink::after{content:" ›"}
.cta-row{display:flex;flex-wrap:wrap;gap:.9rem 1.1rem;align-items:center;margin-top:1.8rem}
.cta-note{font-size:.85rem;color:var(--ink-faint)}

/* ---------- call-to-action band (was navy) ---------- */
.cta-band{background:var(--bg-alt);color:var(--ink);text-align:center}
.cta-band h2{color:var(--ink)}
.cta-band p{color:var(--ink-soft);margin-left:auto;margin-right:auto}
.cta-band .cta-row{justify-content:center}

/* ---------- cards & grids ---------- */
.grid{display:grid;gap:20px;margin:2rem 0 0;padding:0;list-style:none}
.g2{grid-template-columns:repeat(auto-fit,minmax(19rem,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.card{background:var(--bg-alt);border:0;border-radius:var(--radius);padding:1.6rem 1.6rem 1.5rem}
section.alt .card{background:var(--bg)}
.card p{margin:0;font-size:.98rem;color:var(--ink-soft)}
.card .tag,.tag{font-size:.8rem;font-weight:600;color:var(--teal);display:block;margin-bottom:.4rem;letter-spacing:-.005em}
.facts{display:grid;gap:2rem 1.5rem;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));margin:2rem 0 0;padding:0;list-style:none}
.facts div{border:0;padding:0}
.facts b{display:block;font-size:clamp(2.2rem,4.5vw,3rem);line-height:1;letter-spacing:-.035em;font-weight:700;margin-bottom:.35rem}
.facts span{font-size:.95rem;color:var(--ink-faint)}
.tiers{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));margin:2rem 0 0;padding:0;list-style:none}
.tier{background:var(--bg-alt);border:2px solid transparent;border-radius:var(--radius-sm);padding:1.3rem 1.35rem}
section.alt .tier{background:var(--bg)}
.tier b{display:block;font-size:1.7rem;letter-spacing:-.03em;font-weight:700}
.tier span{font-size:.95rem;color:var(--ink-soft)}
.tier.feature{border-color:var(--blue);background:var(--bg)}

/* ---------- steps & FAQ ---------- */
ol.steps{counter-reset:s;list-style:none;padding:0;margin:2rem 0 0;max-width:var(--max-narrow)}
ol.steps li{counter-increment:s;position:relative;padding-left:3rem;margin-bottom:1.4rem}
ol.steps li::before{content:counter(s);position:absolute;left:0;top:-.05rem;width:2rem;height:2rem;border-radius:50%;
  background:var(--ink);color:#fff;font-weight:600;font-size:.9rem;display:grid;place-items:center}
ol.steps b{display:block}
.faq{margin:2rem 0 0;max-width:var(--max-narrow)}
.faq details{border-bottom:1px solid var(--line);padding:1.1rem 0}
.faq summary{cursor:pointer;font-weight:600;font-size:1.08rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--ink-faint);font-weight:400;font-size:1.4rem;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq p{margin:.8rem 0 0;color:var(--ink-soft)}

/* ---------- photography ---------- */
.band{margin:0 auto;padding:0 22px;max-width:calc(var(--max) + 44px)}
.band img{width:100%;height:clamp(16rem,46vw,34rem);object-fit:cover;border-radius:var(--radius)}
.band figcaption{background:none;color:var(--ink-faint);font-size:.85rem;padding:.8rem .2rem 0;text-align:center;line-height:1.5}
.band figcaption b{color:var(--ink);font-weight:600}
.band.strip img{height:clamp(9rem,20vw,14rem)}
figure.inset{margin:2rem 0 0;max-width:var(--max-narrow)}
figure.inset img{width:100%;border-radius:var(--radius)}
figure.inset figcaption,figure.portrait figcaption{font-size:.85rem;color:var(--ink-faint);margin-top:.6rem;line-height:1.5}
figure.portrait{float:right;width:13rem;margin:0 0 1.2rem 1.8rem;max-width:40%}
figure.portrait img{width:100%;border-radius:var(--radius-sm)}
@media (max-width:34rem){figure.portrait{float:none;width:100%;max-width:16rem;margin:0 0 1.2rem}}

/* ---------- onward links ---------- */
.nextpages{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin:2rem 0 0;padding:0;list-style:none}
.nextpages a{display:block;background:var(--bg-alt);border-radius:var(--radius-sm);padding:1.3rem 1.4rem;color:var(--ink);transition:transform .2s}
section.alt .nextpages a{background:var(--bg)}
.nextpages a:hover{text-decoration:none;transform:translateY(-2px)}
.nextpages b{display:block;font-size:1.05rem;margin-bottom:.2rem;font-weight:600}
.nextpages b::after{content:" ›";color:var(--blue)}
.nextpages span{font-size:.92rem;color:var(--ink-faint)}

/* ---------- forms ---------- */
form{max-width:36rem;margin-top:1.6rem}
label{display:block;font-size:.92rem;font-weight:600;margin:1.1rem 0 .35rem}
input,select,textarea{width:100%;padding:.8rem .95rem;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font:inherit;font-size:1rem}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(0,113,227,.15)}
textarea{min-height:8rem;resize:vertical}
.hp{position:absolute;left:-9999px}
.form-note{font-size:.85rem;color:var(--ink-faint);margin-top:1rem}

/* ---------- footer: Apple-style light grey ---------- */
footer{padding:2.6rem 0 2rem;font-size:.78rem;line-height:1.5;color:var(--ink-faint);background:var(--bg-alt);border-top:0}
footer .cols{display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));margin-bottom:1.6rem;padding-bottom:1.6rem;border-bottom:1px solid var(--line)}
footer h4{font-size:.78rem;letter-spacing:0;text-transform:none;color:var(--ink);margin:0 0 .6rem}
footer a{color:var(--ink-soft);display:block;margin-bottom:.4rem}
footer a:hover{color:var(--ink)}
footer p{max-width:52rem;margin:0 0 .6rem;color:var(--ink-faint)}
footer .footer-links{margin-bottom:1rem}
footer .legal{border:0;padding:0}

/* =================== homepage =================== */
.home-hero{text-align:center;padding:clamp(3rem,8vw,6rem) 0 0}
.home-hero h1{max-width:16ch;margin-left:auto;margin-right:auto}
.home-hero .lede{margin:0 auto}
.home-hero .cta-row{justify-content:center}
.hero-photo{margin:clamp(2.5rem,6vw,4rem) auto 0;max-width:calc(var(--max) + 44px);padding:0 22px}
.hero-photo img{width:100%;height:clamp(18rem,52vw,40rem);object-fit:cover;border-radius:var(--radius)}

/* next steps: three big tiles */
.steps3{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));margin-top:2.5rem}
.tile{background:var(--bg);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.tile img{width:100%;aspect-ratio:4/3;object-fit:cover}
.tile .body{padding:1.6rem 1.6rem 1.8rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.tile h3{font-size:1.6rem;letter-spacing:-.03em;margin:0}
.tile p{color:var(--ink-soft);margin:0;font-size:1rem}
.tile .prices{list-style:none;padding:0;margin:.4rem 0 .2rem;display:grid;gap:.35rem;font-size:.95rem}
.tile .prices li{display:grid;grid-template-columns:5.4rem 1fr;gap:.6rem;align-items:baseline}
.tile .prices li:not(:has(b)){display:block}
.tile .prices b{font-weight:700}
.tile .prices a{display:contents;color:inherit;text-decoration:none}
.tile .prices a b{color:var(--link);text-decoration:underline;text-underline-offset:2px}
.tile .cta-row{margin-top:auto;padding-top:1rem}

/* impact feature rows */
.impact{display:grid;gap:clamp(1.5rem,4vw,3.5rem);grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));align-items:center;margin-top:clamp(2.5rem,6vw,4rem)}
.impact .pics{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.impact .pics img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--radius-sm)}
.impact .pics.one{grid-template-columns:1fr}
.impact .pics.one img{aspect-ratio:4/3}
.impact .date{font-size:.9rem;color:var(--ink-faint);font-weight:500;margin-bottom:.4rem}
.impact h3{font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.03em;line-height:1.1;margin-bottom:.8rem}
.impact ul{list-style:none;padding:0;margin:1rem 0 0;display:grid;gap:.4rem;color:var(--ink-soft);font-size:.98rem}
.impact ul b{color:var(--ink);font-weight:600}
.badge{display:inline-block;font-size:.78rem;font-weight:600;color:#bf4800;background:#fff3eb;border-radius:980px;padding:.2rem .7rem;margin-bottom:.6rem}

/* programmes list */
.programs{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin:2.5rem 0 0;padding:0;list-style:none}
.programs li{background:var(--bg-alt);border-radius:var(--radius-sm);padding:1.4rem 1.4rem 1.3rem}
.programs .tag{margin-bottom:.3rem}
.programs h3{font-size:1.15rem}
.programs p{font-size:.95rem;color:var(--ink-soft);margin:0}
.programs a{display:inline-block;margin-top:.5rem;font-size:.95rem}

/* flagship split */
.split{display:grid;gap:clamp(1.5rem,4vw,3.5rem);grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));align-items:center}
.split img{width:100%;border-radius:var(--radius);aspect-ratio:4/5;object-fit:cover}
.big-number{font-size:clamp(2.6rem,6vw,4rem);font-weight:700;letter-spacing:-.04em;line-height:1;margin:.4rem 0 .2rem}

@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* big-number panel used where no suitable photo exists */
.stat{background:var(--bg-alt);border-radius:var(--radius);aspect-ratio:4/3;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem}
section.alt .stat{background:var(--bg)}
.stat b{font-size:clamp(4rem,11vw,7.5rem);line-height:1;letter-spacing:-.05em;font-weight:700}
.stat span{margin-top:.6rem;color:var(--ink-faint);font-size:1rem;max-width:18rem}

/* =================== give page =================== */
.give-choices{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));max-width:56rem;margin:0 auto}
.give-card{background:var(--bg-alt);border-radius:var(--radius);padding:clamp(1.8rem,4vw,2.6rem);display:flex;flex-direction:column;gap:.6rem;text-align:center;align-items:center}
.give-card h2{font-size:clamp(1.8rem,3.5vw,2.4rem);margin:0}
.give-card p{margin:0 auto}
.give-card > .btn{margin-top:auto}
.give-card > p.muted{margin-bottom:1.2rem}
.btn-lg{font-size:1.12rem;padding:.9rem 2.2rem}
.amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;margin-top:1.2rem!important}
.amount{display:flex;flex-direction:column;align-items:center;background:var(--bg);border:2px solid var(--line);border-radius:var(--radius-sm);padding:.85rem .4rem;color:var(--ink);transition:border-color .15s,transform .15s}
.amount:hover{text-decoration:none;border-color:var(--blue);transform:translateY(-1px)}
.amount b{font-size:1.5rem;letter-spacing:-.03em;font-weight:700}
.amount span{font-size:.8rem;color:var(--ink-faint)}
.paynote{text-align:center;color:var(--ink-faint);font-size:.88rem;margin:1.4rem auto 0;max-width:none}

/* Mission line + "Where we've been" (2026-10-13) */
.mission{max-width:44rem;margin:1.2rem auto 0;font-size:1.02rem;color:var(--ink-soft)}
.mission b{color:var(--ink)}
.visits{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin:2.5rem 0 0;padding:0;list-style:none}
.visits li{background:var(--bg-alt);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.visits img{width:100%;aspect-ratio:4/3;object-fit:cover}
.visits .body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.visits .badge{align-self:flex-start;margin-bottom:.2rem}
.visits .date{font-size:.88rem;color:var(--ink-faint);font-weight:500;margin:0}
.visits h3{font-size:1.25rem;letter-spacing:-.02em;margin:0}
.visits p{font-size:.95rem;color:var(--ink-soft);margin:0}
.visits .textlink{margin-top:auto;padding-top:.6rem;font-size:.95rem}
.visits .noimg{aspect-ratio:4/3;background:var(--blue);color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:1rem}
.visits .noimg b{font-size:clamp(2.6rem,6vw,3.4rem);letter-spacing:-.04em;line-height:1}
.visits .noimg span{font-size:.9rem;opacity:.9;margin-top:.4rem}
.mission-big{font-size:clamp(1.4rem,3vw,1.9rem);line-height:1.25;letter-spacing:-.02em;font-weight:600;color:var(--ink);max-width:40rem}
