/* sanctuary.css — page-specific styles for The Romanian Sanctuary
   Auto-synced from previews/pennys-ark/sanctuary.css on 2026-05-29.
   Edit the preview file, not this file directly. */

/* Sticky nav override (preserved from prior live CSS) */
nav.topnav{position:sticky;top:0;z-index:50;background:#fff;backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft);transition:background .35s ease,border-color .35s ease,box-shadow .35s ease}

/* sanctuary.css — page-specific styles for sanctuary.html
   Extracted from inline <style> by tools/css-consolidate.py. */

/* ============================================
   NAV (shared with index.html / foster.html / sponsor.html)
   ============================================ */
nav.topnav{position:sticky;top:0;z-index:50;background:#fff;backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft);transition:background .35s ease,border-color .35s ease,box-shadow .35s ease}

/* ============================================
   SANCTUARY PAGE — page-specific styles
   ============================================ */

.sanctuary-heading-accent{font-family:'Fraunces',Georgia,'Times New Roman',serif;font-variation-settings:'opsz' 144,'SOFT' 100;font-style:italic;font-weight:700;letter-spacing:-0.005em}

/* HERO — full-bleed sanctuary photo, dark forest overlay */
.sanctuary-hero{position:relative;min-height:clamp(620px,84vh,820px);overflow:hidden;background:#0a1408;margin:0;border-radius:0}

.sanctuary-hero-bg{position:absolute;inset:0}

.sanctuary-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 35%;filter:saturate(0.94) contrast(1.04)}

.sanctuary-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0.5) 70%,rgba(0,0,0,0.85) 100%),linear-gradient(90deg,rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.1) 60%,rgba(0,0,0,0) 100%);}

.sanctuary-hero-content{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:clamp(80px,12vh,140px) var(--gutter) clamp(70px,10vh,110px);color:#fbf6e7;display:flex;flex-direction:column;justify-content:center;min-height:clamp(620px,84vh,820px)}

.sanctuary-hero-eyebrow{font:700 11px/1 var(--sans);letter-spacing:0.28em;text-transform:uppercase;color:#fff;margin-bottom:24px;display:inline-flex;align-items:center;gap:14px;background:rgba(255,255,255,0.10);backdrop-filter:blur(6px);padding:10px 16px 10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,0.20);align-self:flex-start}

.sanctuary-hero-eyebrow::before{content:"";width:8px;height:8px;background:var(--gold);border-radius:50%;box-shadow:0 0 12px rgba(244,211,94,0.6)}

.sanctuary-hero h1{font-family:var(--slab);font-weight:800;font-size:clamp(44px,6.6vw,92px);line-height:0.98;letter-spacing:-0.025em;margin:0 0 26px;max-width:18ch;text-wrap:balance;color:#fbf6e7}

.sanctuary-hero h1 span{color:var(--gold-l)}

.sanctuary-hero p.lede{font-family:'Fraunces',Georgia,serif;font-variation-settings:'opsz' 144,'SOFT' 80;font-style:italic;font-weight:500;font-size:clamp(22px,2.4vw,30px);max-width:32ch;margin:0 0 36px;color:rgba(251,246,231,0.95);line-height:1.35;letter-spacing:-0.005em}

.sanctuary-hero p.attrib{font:600 12px/1.4 var(--sans);letter-spacing:0.20em;text-transform:uppercase;color:rgba(232,176,74,0.85);margin:0 0 30px}

.sanctuary-hero-actions{display:flex;gap:14px;flex-wrap:wrap}

.sanctuary-hero-meta{position:absolute;left:var(--gutter);bottom:30px;z-index:2;color:rgba(251,246,231,0.95);font:600 11px/1.4 var(--sans);letter-spacing:0.18em;text-transform:uppercase;display:flex;align-items:center;gap:14px}

.sanctuary-hero-meta .place{font-family:'Fraunces',Georgia,serif;font-variation-settings:'opsz' 144,'SOFT' 100;font-style:italic;font-weight:700;color:var(--gold-l);letter-spacing:0.04em;text-transform:none;font-size:14px}

/* TAKEOVER — narrative on cream */
.sanctuary-takeover{padding:clamp(90px,12vw,160px) var(--gutter);background:var(--green-d);color:var(--paper-w)}

.sanctuary-takeover .container{max-width:880px;text-align:center}

.sanctuary-takeover .heading{margin-bottom:42px}

.sanctuary-takeover .heading .eyebrow{color:var(--gold-l)}
.sanctuary-takeover .heading .eyebrow::before{background:var(--gold)}

.sanctuary-takeover h2{font-family:var(--slab);font-weight:800;font-size:clamp(34px,4.6vw,60px);line-height:1.1;letter-spacing:-0.02em;margin:18px 0 0;color:var(--paper-w);text-wrap:balance}

.sanctuary-takeover h2 span,
.sanctuary-takeover .sanctuary-heading-accent{color:var(--gold-l);font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500}

.sanctuary-takeover .body{font-size:18px;line-height:1.8;color:rgba(251,246,231,0.86);text-align:left}

.sanctuary-takeover .body p{margin:0 0 22px}

.sanctuary-takeover .body em{font-family:'Fraunces',Georgia,serif;font-style:italic;color:var(--gold-l);font-weight:500}

/* PLACE — photo gallery, dog-card pattern (paper-2 cards with paper-3 photo frames) */
.sanctuary-place{padding:clamp(80px,11vw,140px) 0;background:var(--paper);position:relative;overflow:hidden}

.sanctuary-place::before{content:"";position:absolute;top:-30px;right:-50px;width:240px;height:240px;background:var(--green-l);-webkit-mask:url('../images/paw-only.svg') no-repeat center/contain;mask:url('../images/paw-only.svg') no-repeat center/contain;opacity:0.18;pointer-events:none;transform:rotate(16deg)}

.sanctuary-place .heading h2{color:var(--green-d)}

.sanctuary-place .heading h2 span{color:var(--green-l)}

.sanctuary-place .heading .eyebrow{color:var(--green-l)}

.sanctuary-place .heading .eyebrow::before{background:var(--gold)}

.sanctuary-place .heading p{color:var(--ink-2)}

.sanctuary-place .container{max-width:var(--maxw);position:relative;z-index:1}

.sanctuary-place .heading{text-align:center;max-width:760px;margin:0 auto 56px}

.sanctuary-place .heading h2{font-family:var(--slab);font-weight:800;font-size:clamp(40px,5.4vw,72px);line-height:1.05;letter-spacing:-0.025em;margin:18px 0 16px;color:var(--green-d);text-wrap:balance}

.sanctuary-place .heading .eyebrow{justify-content:center}

.sanctuary-place .heading p{font-size:17px;color:var(--ink-2);max-width:54ch;margin:0 auto;line-height:1.65}

/* Gallery — full-bleed marquee, two rows scrolling in opposite directions */
.place-rows{margin-top:48px;display:flex;flex-direction:column;gap:clamp(16px,1.8vw,24px);overflow:hidden;width:100%;mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%)}

/* Each row is a horizontal scroller — JS-driven auto-scroll + drag to nudge. */
.place-row{display:flex;gap:clamp(14px,1.6vw,22px);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;cursor:grab;user-select:none;-webkit-user-select:none;will-change:scroll-position;scroll-behavior:auto;touch-action:pan-y}

.place-row::-webkit-scrollbar{display:none}

.place-row.dragging{cursor:grabbing}

.place-row.dragging *{pointer-events:none}

.place-card{flex-shrink:0;display:flex;flex-direction:column;background:var(--paper-2);border-radius:var(--r-lg);padding:12px;transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;border:1px solid transparent;overflow:hidden}

.place-card:hover{background:var(--paper);border-color:var(--gold);box-shadow:var(--shadow)}

.place-card .photo-frame{position:relative;border-radius:var(--r-md);overflow:hidden;background:var(--paper-3);flex:1}

.place-card .photo-frame img{width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block;transition:transform .6s ease;pointer-events:none}

.place-card:hover .photo-frame img{transform:scale(1.04)}

.place-card .caption{position:static;padding:0;background:transparent;backdrop-filter:none;font-family:var(--slab);font-weight:800;font-size:15px;letter-spacing:-0.01em;color:var(--green-d);margin:12px 4px 2px;text-transform:none;border-radius:0;display:block;line-height:1.2}

/* Hover overlay — slides up from the bottom of the photo with title + body */
.place-card .photo-overlay{position:absolute;left:0;right:0;bottom:0;padding:clamp(20px,3vw,32px) clamp(16px,2vw,24px) clamp(16px,2vw,22px);background:linear-gradient(180deg,transparent 0%,rgba(31,43,29,0.55) 30%,rgba(31,43,29,0.96) 100%);color:#fbf6e7;transform:translateY(100%);opacity:0;transition:transform 0.4s cubic-bezier(0.2,0.8,0.2,1),opacity 0.3s ease;pointer-events:none}

.place-card:hover .photo-overlay{transform:translateY(0);opacity:1}

.place-card .overlay-title{font-family:var(--slab);font-weight:800;font-size:18px;color:var(--gold-l);margin:0 0 8px;letter-spacing:-0.005em;line-height:1.15}

.place-card .overlay-body{font-size:13px;line-height:1.5;color:rgba(251,246,231,0.92);margin:0}

.place-card.size-sm .overlay-title{font-size:16px}

.place-card.size-sm .overlay-body{font-size:12px;line-height:1.45}

/* Four rows, varied heights for visual rhythm */
.place-row.row-a .place-card{height:440px}

.place-row.row-b .place-card{height:340px}

.place-row.row-c .place-card{height:500px}

.place-row.row-d .place-card{height:380px}

/* Card width variation */
.place-card.size-sm{width:300px}

.place-card.size-md{width:380px}

.place-card.size-lg{width:480px}

.place-card.size-xl{width:620px}

@media (max-width:820px){
  .place-row.row-a .place-card{height:340px}
  .place-row.row-b .place-card{height:260px}
  .place-row.row-c .place-card{height:380px}
  .place-row.row-d .place-card{height:300px}
  .place-card.size-sm{width:230px}
  .place-card.size-md{width:290px}
  .place-card.size-lg{width:360px}
  .place-card.size-xl{width:440px}
}
@media (max-width:480px){
  /* Phones: smaller cards so roughly 1.3 fit and the row reads as a strip. */
  .place-rows{margin-top:32px}
  .place-row.row-a .place-card{height:300px}
  .place-row.row-b .place-card{height:240px}
  .place-row.row-c .place-card{height:330px}
  .place-row.row-d .place-card{height:270px}
  .place-card{padding:9px}
  .place-card.size-sm{width:210px}
  .place-card.size-md{width:248px}
  .place-card.size-lg{width:286px}
  .place-card.size-xl{width:300px}
}

/* CATALIN — dark forest gradient section, photo + story */
.sanctuary-catalin{padding:clamp(80px,11vw,140px) var(--gutter);background:linear-gradient(160deg,var(--green-d) 0%,var(--green) 100%);color:var(--paper);position:relative;overflow:hidden}

.sanctuary-catalin::after{content:"";position:absolute;bottom:-40px;right:-50px;width:300px;height:300px;background:var(--gold);-webkit-mask:url('../images/paw-only.svg') no-repeat center/contain;mask:url('../images/paw-only.svg') no-repeat center/contain;opacity:0.20;pointer-events:none;transform:rotate(20deg)}

.sanctuary-catalin .container{max-width:1100px;position:relative;z-index:1}

.catalin-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(36px,5vw,64px);align-items:center}

@media (max-width:840px){.catalin-grid{grid-template-columns:1fr}}

.catalin-photo{aspect-ratio:4/5;background:rgba(251,246,231,0.06);border-radius:var(--r-lg);overflow:hidden;border:1.5px solid var(--gold);position:relative;display:flex;align-items:center;justify-content:center;color:var(--paper);font:600 11px/1.4 var(--sans);letter-spacing:0.16em;text-transform:uppercase;text-align:center;padding:24px;backdrop-filter:blur(2px)}

.catalin-photo .placeholder-name{display:block;font-family:'Fraunces',Georgia,serif;font-variation-settings:'opsz' 144,'SOFT' 100;font-weight:700;font-style:italic;font-size:42px;color:var(--gold-l);letter-spacing:-0.02em;text-transform:none;margin-bottom:8px}

.catalin-photo .placeholder-note{display:block;max-width:22ch;color:rgba(251,246,231,0.7)}

.catalin-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}

.catalin-text .eyebrow{margin-bottom:20px;color:var(--gold-l)}

.catalin-text .eyebrow::before{background:var(--gold)}

.catalin-text h2{font-family:var(--slab);font-weight:800;font-size:clamp(32px,4vw,52px);line-height:1.1;letter-spacing:-0.02em;margin:0 0 24px;color:#fbf6e7;text-wrap:balance}

.catalin-text h2 span{color:var(--gold-l)}

.catalin-text p{font-size:17px;color:rgba(251,246,231,0.92);line-height:1.7;margin:0 0 16px}

.catalin-text .pullquote-small{margin-top:24px;padding:18px 22px;background:rgba(251,246,231,0.08);backdrop-filter:blur(2px);border-radius:var(--r-md);border:1px solid rgba(232,176,74,0.4);font-family:'Fraunces',Georgia,serif;font-variation-settings:'opsz' 144,'SOFT' 100;font-style:italic;font-weight:600;font-size:17px;line-height:1.5;color:#fbf6e7}

.catalin-text .pullquote-small .src{display:block;margin-top:8px;font:600 10px/1.4 var(--sans);font-style:normal;letter-spacing:0.20em;text-transform:uppercase;color:var(--gold-l);opacity:0.85}

/* COST — light cream section matching the live sponsor page */
.sanctuary-cost{ background:var(--paper); padding:clamp(72px,9vw,120px) var(--gutter); color:var(--ink); position:relative; isolation:isolate; }
.sanctuary-cost .container{ max-width:var(--maxw); margin:0 auto; }
.sanctuary-cost .heading{ text-align:center; margin:0 0 48px; }
.sanctuary-cost .heading h2.section-h2{
  font-family:var(--slab); font-weight:800;
  font-size:clamp(40px,5vw,64px); line-height:1; letter-spacing:-.02em;
  margin:0 auto; color:var(--green-d); text-align:center; max-width:24ch;
}
.sanctuary-cost .heading h2.section-h2 .accent{
  font-family:'Fraunces', Georgia, serif; font-style:italic; font-weight:500;
  color:var(--green);
}
.sanctuary-cost .heading h2.section-h2 .accent.gold{ color:var(--gold-d); }
.sanctuary-cost .heading > p{
  font-family:'Lora', Georgia, serif; font-style:italic;
  font-size:clamp(15.5px,1.3vw,17.5px); line-height:1.6;
  color:var(--ink-2); margin:18px auto 0; max-width:62ch;
}

/* Cards: deepest cream on cream, soft, with deep-forest amount + slab title */
.cost-card{
  background:var(--paper-3); border-radius:28px;
  padding:26px 22px 24px;
  border:1px solid transparent;
  text-align:left;
  display:flex; flex-direction:column;
  aspect-ratio:auto;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
}
.cost-card:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 28px rgba(0,0,0,0.14);
  background:var(--paper);
  border-color:var(--gold);
}
.cost-card .pct{
  font-family:var(--slab); font-weight:800;
  font-size:42px; line-height:1; letter-spacing:-.025em;
  color:var(--green-d); margin:0 0 12px;
}
.cost-card h3{
  font-family:var(--slab); font-weight:800;
  font-size:19px; line-height:1.18; letter-spacing:-.01em;
  margin:0 0 8px; color:var(--green-d);
  padding:0; background:none;
}
.cost-card p{
  font-family:'Lora', Georgia, serif; font-style:italic;
  font-size:13.5px; line-height:1.5;
  color:var(--ink-2); margin:0;
  padding:0; background:none;
}

/* Coffee section — Mission-style centered statement (mirrors homepage "one by one") */
.sanctuary-coffee{text-align:center;background:var(--paper);padding:clamp(110px,13vw,170px) var(--gutter);position:relative;overflow:hidden}

.sanctuary-coffee::before{content:"";position:absolute;top:-30px;left:-50px;width:240px;height:240px;background:var(--gold);-webkit-mask:url('../images/paw-only.svg') no-repeat center/contain;mask:url('../images/paw-only.svg') no-repeat center/contain;opacity:0.16;pointer-events:none;transform:rotate(-14deg)}

.sanctuary-coffee::after{content:"";position:absolute;bottom:-40px;right:-40px;width:200px;height:200px;background:var(--green-l);-webkit-mask:url('../images/paw-only.svg') no-repeat center/contain;mask:url('../images/paw-only.svg') no-repeat center/contain;opacity:0.14;pointer-events:none;transform:rotate(20deg)}

.sanctuary-coffee .container{max-width:1100px;position:relative;z-index:1}

.sanctuary-coffee .ornament{width:60px;height:60px;border-radius:50%;background:var(--gold);display:flex;align-items:center;justify-content:center;margin:0 auto 36px;box-shadow:0 4px 18px rgba(232,176,74,0.42)}

.sanctuary-coffee .ornament::before{content:"";display:block;width:32px;height:32px;background:var(--green-d);-webkit-mask:url('../images/paw-only.svg') no-repeat center/contain;mask:url('../images/paw-only.svg') no-repeat center/contain}

.sanctuary-coffee p.quote{font-family:var(--slab);font-weight:600;font-size:clamp(30px,4.2vw,54px);line-height:1.18;letter-spacing:-0.02em;margin:0 0 28px;color:var(--green-d);text-wrap:balance}

.sanctuary-coffee p.quote em{font-family:'Fraunces',Georgia,serif;font-variation-settings:'opsz' 144,'SOFT' 100;font-style:italic;font-weight:700;color:var(--gold-d)}

.sanctuary-coffee p.attribution{font:600 12px/1.4 var(--sans);letter-spacing:0.22em;text-transform:uppercase;color:var(--muted);margin:0}

/* CTA — donate-band pattern (2-col: text + impacts left, Zeffy widget right) */
.sanctuary-cta{padding:clamp(72px,9vw,110px) var(--gutter);background:linear-gradient(160deg,var(--green-d) 0%,var(--leaf) 100%);color:var(--paper);position:relative;overflow:hidden}

.sanctuary-cta::before{content:"";position:absolute;top:-200px;right:-150px;width:600px;height:600px;background:radial-gradient(circle,rgba(178,135,96,0.18),transparent 60%);pointer-events:none}

.sanctuary-cta::after{content:"";position:absolute;top:-50px;right:-60px;width:280px;height:280px;background:var(--yellow);-webkit-mask:url('../images/paw-only.svg') no-repeat center/contain;mask:url('../images/paw-only.svg') no-repeat center/contain;opacity:0.25;pointer-events:none;z-index:0;transform:rotate(22deg)}

.sanctuary-cta .container{position:relative;z-index:1;max-width:var(--maxw);display:grid;grid-template-columns:1fr 1.3fr;gap:clamp(40px,6vw,80px);align-items:start}

@media (max-width:920px){.sanctuary-cta .container{grid-template-columns:1fr}}

.sanctuary-cta .eyebrow{color:var(--gold-l)}

.sanctuary-cta .eyebrow::before{background:var(--gold)}

.sanctuary-cta h2{font-family:var(--slab);font-weight:800;font-size:clamp(40px,5.4vw,72px);line-height:1.05;letter-spacing:-0.025em;margin:18px 0 24px;color:#fbf6e7;text-wrap:balance}

.sanctuary-cta h2 span{color:var(--gold-l);font-family:'Fraunces',Georgia,serif;font-variation-settings:'opsz' 144,'SOFT' 100;font-style:italic;font-weight:600;letter-spacing:-0.005em}

.sanctuary-cta p.lede{font-size:19px;color:#dfd6bd;max-width:44ch;line-height:1.6;margin:0}

.sanctuary-cta .impacts{margin-top:36px;padding-top:28px;border-top:1px solid rgba(255,255,255,0.14);display:grid;gap:14px}

.sanctuary-cta .impact{display:grid;grid-template-columns:110px 1fr;gap:18px;align-items:baseline;padding:8px 0}

.sanctuary-cta .impact .amt{font-family:var(--slab);font-weight:800;font-size:30px;color:var(--gold-l);letter-spacing:-0.015em;line-height:1}

.sanctuary-cta .impact .amt small{font-size:0.5em;letter-spacing:0.04em;font-weight:600;color:rgba(244,211,114,0.7);margin-left:4px}

.sanctuary-cta .impact .what{font-size:16px;color:#dfd6bd;line-height:1.4}

.sanctuary-cta-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}

.sanctuary-cta-actions .btn-secondary{background:transparent;color:#fbf6e7;border:1.5px solid rgba(251,246,231,0.8);font-family:var(--slab);font-weight:700;font-size:13px;letter-spacing:0.16em;text-transform:uppercase;padding:16px 28px;border-radius:999px;display:inline-flex;align-items:center;gap:10px;transition:all .22s ease;backdrop-filter:blur(4px)}

.sanctuary-cta-actions .btn-secondary:hover{background:#fbf6e7;color:var(--green-d);border-color:#fbf6e7}

/* Zeffy donate embed — sits on the right column */
/* Zeffy frame — mirrors live homepage. Tall enough that the form fits with
   no internal scroll; the outer frame doesn't scroll either. */
.zeffy-frame{ background:var(--paper); color:var(--ink); display:flex; flex-direction:column; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line-soft); }
.zeffy-header{ padding:18px 26px; border-bottom:1px solid var(--line-soft); display:flex; align-items:center; justify-content:space-between; font:700 10px/1 var(--sans); letter-spacing:0.22em; text-transform:uppercase; background:var(--paper-2); }
.zeffy-header .lock{ display:inline-flex; align-items:center; gap:8px; color:var(--green-d); }
.zeffy-header .fees{ color:var(--brown-d); }
.zeffy-iframe{ width:100%; height:1200px; min-height:1200px; border:0; display:block; background:var(--paper-w); }
.zeffy-foot{ padding:14px 26px; border-top:1px solid var(--line-soft); display:flex; align-items:center; justify-content:space-between; font:600 10px/1 var(--sans); letter-spacing:0.22em; text-transform:uppercase; color:var(--muted); background:var(--paper-2); }
@media (max-width:920px){ .zeffy-iframe{ height:1400px; min-height:1400px; } }

/* FAQ — mirrors live sponsor: deep forest section, cream pill items */
.sanctuary-faq{ background:var(--green-d); color:var(--paper-w); padding:clamp(72px,9vw,120px) var(--gutter); }
.sanctuary-faq .container{ max-width:820px; margin:0 auto; }
.sanctuary-faq .heading{ text-align:center; margin:0 0 40px; }
.sanctuary-faq .heading h2{
  font-family:var(--slab); font-weight:800;
  font-size:clamp(40px,5vw,64px); line-height:1; letter-spacing:-.02em;
  margin:0 auto; color:var(--paper-w); max-width:22ch;
}
.sanctuary-faq .heading h2 .accent,
.sanctuary-faq .heading h2 span{
  font-family:'Fraunces', Georgia, serif; font-style:italic; font-weight:500;
  color:var(--gold-l);
}
.sanctuary-faq .faq-list,
.sanctuary-faq > .container > *:not(.heading){ /* support either wrapper or bare items */ }
.sanctuary-faq .faq-item{
  background:var(--paper-3); border-radius:18px;
  padding:0; overflow:hidden;
  border:1px solid transparent;
  box-shadow:0 4px 14px rgba(0,0,0,.18);
  margin:0 0 12px;
  transition:background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.sanctuary-faq .faq-item:hover{
  background:var(--paper-2);
  border-color:var(--gold);
  box-shadow:0 8px 22px rgba(0,0,0,.22);
  transform:translateY(-1px);
}
.sanctuary-faq .faq-item.open,
.sanctuary-faq .faq-item[open]{
  background:var(--paper-2);
  border-color:var(--gold);
  box-shadow:0 10px 26px rgba(0,0,0,.24);
}
/* Row container: handles BOTH <details><summary> (live) and <button class="faq-q"> (preview).
   `justify-content:space-between` handles the layout — DO NOT apply flex:1 to children
   or the .tg circle (the only ELEMENT child of summary) will stretch the full row. */
.sanctuary-faq .faq-item summary,
.sanctuary-faq .faq-item .faq-q{
  list-style:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:22px 28px;
  font-family:var(--slab); font-weight:700; font-size:18px; line-height:1.3;
  color:var(--green-d);
  width:100%; background:transparent; border:0; text-align:left;
}
.sanctuary-faq .faq-item summary::-webkit-details-marker{ display:none; }
.sanctuary-faq .faq-item summary::marker{ content:""; }
.sanctuary-faq .faq-item .tg,
.sanctuary-faq .faq-item .faq-toggle{
  flex-shrink:0; width:34px; height:34px; border-radius:50%;
  background:var(--green-d); color:var(--gold-l);
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces', Georgia, serif; font-style:italic; font-weight:500;
  font-size:22px; line-height:1;
  transition:background .25s ease, color .25s ease, transform .3s ease;
}
.sanctuary-faq .faq-item:hover .tg,
.sanctuary-faq .faq-item:hover .faq-toggle{ background:var(--gold); color:var(--green-d); }
.sanctuary-faq .faq-item[open] .tg,
.sanctuary-faq .faq-item.open .faq-toggle{
  background:var(--yellow); color:var(--green-d); transform:rotate(45deg);
  box-shadow:0 3px 10px rgba(237,202,102,.45);
}
.sanctuary-faq .faq-item .a,
.sanctuary-faq .faq-item .faq-a{
  padding:0 28px 22px;
  font-family:var(--slab); font-weight:500; font-size:15.5px; line-height:1.65;
  color:var(--ink-2);
}
.sanctuary-faq .faq-item .a p,
.sanctuary-faq .faq-item .faq-a p{ margin:0 0 12px; }
.sanctuary-faq .faq-item .a p:last-child,
.sanctuary-faq .faq-item .faq-a p:last-child{ margin:0; }
.sanctuary-faq .faq-item .a em,
.sanctuary-faq .faq-item .faq-a em{ font-family:'Fraunces'; font-style:italic; color:var(--gold-d); font-weight:500; }
.sanctuary-faq .faq-a em{ font-family:'Fraunces'; font-style:italic; color:var(--gold-d); font-weight:500; }

/* ANIMATIONS */
html{scroll-behavior:smooth}

.sanctuary-hero-bg img{animation:kb-slow 24s ease-in-out infinite alternate;will-change:transform}

.sanctuary-hero-actions .btn-primary,.sanctuary-cta-actions .btn-primary{animation:cta-pulse 2.6s ease-in-out infinite}

.sanctuary-hero-actions .btn-primary:hover,.sanctuary-cta-actions .btn-primary:hover{animation:none}

@media (prefers-reduced-motion:reduce){
  .r-up{transition:opacity 0.3s ease;transform:none !important}
  .r-up.in{transform:none !important}
  .sanctuary-hero-bg img{animation:none !important}
  .sanctuary-hero-actions .btn-primary,.sanctuary-cta-actions .btn-primary{animation:none !important}
  html{scroll-behavior:auto}
}

/* ============================================
   MOBILE GUARDS (<=640px) — sanctuary-specific
   Tap-target minimums, readable-text minimums, and
   layout safety at 360px. Desktop is untouched.
   ============================================ */
@media (max-width:640px){
  /* Hero: keep impact but don't dominate the viewport on tall phones */
  .sanctuary-hero{min-height:clamp(540px,72vh,720px)}
  .sanctuary-hero-content{min-height:clamp(540px,72vh,720px);padding:clamp(60px,9vh,100px) var(--gutter) clamp(56px,8vh,90px)}
  .sanctuary-hero-eyebrow{font-size:11px;padding:10px 14px;letter-spacing:0.22em}
  .sanctuary-hero h1{font-size:clamp(34px,8.4vw,48px)}
  .sanctuary-hero p.lede{font-size:18px}
  .sanctuary-hero p.attrib{font-size:12px}
  .sanctuary-hero-meta{font-size:11px;letter-spacing:0.14em;bottom:18px}
  .sanctuary-hero-actions{gap:12px}
  .sanctuary-hero-actions .btn,
  .sanctuary-hero-actions .btn-primary,
  .sanctuary-hero-actions .btn-secondary{min-height:44px;display:inline-flex;align-items:center}

  /* Takeover: keep readable body */
  .sanctuary-takeover .body{font-size:17px;line-height:1.7}

  /* Catalin: stack already at 840; bump small text */
  .catalin-text p{font-size:16px}
  .catalin-text .pullquote-small{font-size:16px}
  .catalin-text .pullquote-small .src{font-size:11px;letter-spacing:0.16em}
  .catalin-photo{font-size:12px;letter-spacing:0.12em}

  /* Cost cards: small italic body was 13.5px — keep readable */
  .cost-card{padding:22px 18px 20px}
  .cost-card p{font-size:14px;line-height:1.55}
  .cost-card h3{font-size:18px}

  /* Place cards (marquee) — caption and overlays */
  .place-card .caption{font-size:15px}
  .place-card .overlay-body{font-size:14px;line-height:1.5}
  .place-card.size-sm .overlay-body{font-size:13px}

  /* CTA: impacts column won't fit 110px + gap + text at 360 — collapse to two rows */
  .sanctuary-cta .impact{grid-template-columns:1fr;gap:6px;padding:10px 0}
  .sanctuary-cta .impact .amt{font-size:26px}
  .sanctuary-cta .impact .what{font-size:15px;line-height:1.45}
  .sanctuary-cta p.lede{font-size:17px}
  .sanctuary-cta-actions{gap:12px}
  .sanctuary-cta-actions .btn,
  .sanctuary-cta-actions .btn-primary,
  .sanctuary-cta-actions .btn-secondary{min-height:44px;padding:14px 22px;letter-spacing:0.12em}

  /* Zeffy frame metadata: 10px uppercase tracking is unreadable — bump up */
  .zeffy-header{padding:14px 18px;font-size:11px;letter-spacing:0.16em}
  .zeffy-foot{padding:12px 18px;font-size:11px;letter-spacing:0.16em}

  /* FAQ: ensure summary/button tap target and readable body */
  .sanctuary-faq .faq-item summary,
  .sanctuary-faq .faq-item .faq-q{padding:18px 20px;min-height:44px;font-size:16px;gap:14px}
  .sanctuary-faq .faq-item .a,
  .sanctuary-faq .faq-item .faq-a{padding:0 20px 20px;font-size:15px}
  .sanctuary-faq .faq-item .tg,
  .sanctuary-faq .faq-item .faq-toggle{width:32px;height:32px;font-size:20px}

  /* Coffee section: keep ornament tappable scale & readable attribution */
  .sanctuary-coffee p.attribution{font-size:12px;letter-spacing:0.16em}
}


/* === PA hero mobile restructure (auto, 2026-05-31) === prefix:sanctuary */
@media (max-width:980px){
  .sanctuary-hero{
    display:flex; flex-direction:column;
    min-height:0 !important; height:auto !important;
    padding:0 !important; background:var(--paper);
    position:relative; overflow:hidden; align-items:stretch !important;
  }
  .sanctuary-hero-bg{
    position:relative !important; inset:auto !important; z-index:auto !important;
    width:100%; aspect-ratio:4/3; height:auto !important; order:1; flex:0 0 auto;
  }
  .sanctuary-hero-bg img{
    position:absolute !important; inset:0 !important;
    width:100%; height:100% !important; object-fit:cover; object-position:center 30%;
  }
  .sanctuary-hero > .container,
  .sanctuary-hero > .sanctuary-hero-content,
  .sanctuary-hero .sanctuary-hero-content{
    position:static !important; inset:auto !important;
    padding:0 !important; max-width:100%; width:100%; margin:0;
    background:var(--paper); color:var(--ink);
    order:2; flex:1 1 auto; min-height:0 !important; display:block !important;
  }
  .sanctuary-hero-eyebrow, .sanctuary-hero .eyebrow{ display:none !important; }
  .sanctuary-hero h1{
    position:absolute !important; top:37.5vw; left:0; right:0; transform:translateY(-50%);
    margin:0 !important; padding:0 24px; max-width:none; text-align:center; color:var(--paper-w);
    font-size:clamp(26px,7vw,38px); line-height:1.1;
    text-shadow:0 2px 14px rgba(0,0,0,.6), 0 1px 4px rgba(0,0,0,.5); z-index:3;
  }
  .sanctuary-hero h1 .accent, .sanctuary-hero h1 span{ color:var(--gold-l); }
  .sanctuary-hero .lede, .sanctuary-hero p.sub{
    margin:0 !important; padding:22px 22px 8px; max-width:none;
    background:var(--paper); color:#4a4a3d; font-size:14.5px; line-height:1.5; text-align:center;
  }
  .sanctuary-hero .lede strong{ color:var(--ink); }
  .sanctuary-hero .hero-actions, .sanctuary-hero .actions, .sanctuary-hero .sanctuary-hero-actions{
    margin:0 !important; padding:0 22px 24px; background:var(--paper);
    display:flex; flex-direction:row; flex-wrap:wrap; gap:10px;
    align-items:center; justify-content:center; width:100%;
  }
  .sanctuary-hero .btn-light{ background:transparent; border:1.5px solid var(--green-d); color:var(--green-d); }
  .sanctuary-hero .btn-light:hover{ background:var(--green-d); color:var(--paper-w); }
  .sanctuary-hero .hero-meta, .sanctuary-hero .meta, .sanctuary-hero .sanctuary-hero-meta{
    position:absolute; top:calc(75vw - 34px); left:50%; right:auto; bottom:auto; transform:translateX(-50%);
    margin:0 !important; padding:5px 14px; background:rgba(0,0,0,.34);
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); border-radius:999px;
    font-family:'Lora',Georgia,serif; font-style:italic; font-size:11px;
    color:rgba(251,246,231,.92); z-index:3; display:inline-flex; gap:5px; white-space:nowrap;
  }
  .sanctuary-hero .who{ color:var(--gold-l); font-weight:600; }
}

/* === PA hero mobile contrast/meta fix (auto, 2026-05-31b) === prefix:sanctuary */
@media (max-width:980px){
  .sanctuary-hero .lede, .sanctuary-hero p.lede,
  .sanctuary-hero p.sub, .sanctuary-hero .sub,
  .sanctuary-hero blockquote, .sanctuary-hero .quote{ color:#4a4a3d !important; }
  .sanctuary-hero .lede strong, .sanctuary-hero p.lede strong{ color:var(--ink) !important; }
  .sanctuary-hero .attrib, .sanctuary-hero .attribution,
  .sanctuary-hero .credit, .sanctuary-hero .source{ color:var(--gold-d) !important; }
  .sanctuary-hero .hero-meta, .sanctuary-hero .meta, .sanctuary-hero .sanctuary-hero-meta{ display:none !important; }
}

/* Cost breakdown is 4 cards (60/20/10/10), not the global 5 — override the
   global repeat(5) so they lay out evenly on this page. */
.cost-grid{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.cost-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.cost-grid{grid-template-columns:1fr}}