:root{
 color-scheme:light;
 --bg:#FFFCF4; --bg2:#FAF2DF; --surface:#FFFDF9;
 --header-bg:rgba(255,252,244,.9);
 --ink:#4A3F33; --ink-soft:#7F6E59;
 --primary:#EFC25E; --primary-d:#D9A93F;
 --pink:#F0CFC9; --pink-d:#D69A92;
 --sage:#9DAE8A; --sage-d:#6E8060;
 --brown:#6E5A45;
 --accent:#CE8A86; --accent-d:#BC766F; --on-accent:#FFFFFF;
 --band:#889A77; --on-band:#FFFFFF;
 --line:#ECE0C9;
 --radius:13px; --radius-lg:22px;
 --shadow:0 10px 30px rgba(120,92,52,.10);
 --shadow-lg:0 18px 44px rgba(120,92,52,.16);
 --img-filter:saturate(.97) contrast(1.02) sepia(.05);
 --font-display:'Fraunces',Georgia,'Times New Roman',serif;
 --font-body:'Newsreader',Georgia,'Times New Roman',serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#FFFCF4}
body{margin:0;font-family:var(--font-body);color:var(--ink);background-color:var(--bg);background-image:radial-gradient(rgba(110,90,69,.035) 1px,transparent 1px);background-size:24px 24px;font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased}
body.menu-open{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink);line-height:1.12;margin:0 0 .45em;font-weight:600}
h1{font-size:clamp(2.1rem,6vw,3.55rem);letter-spacing:-.01em}
h2{font-size:clamp(1.6rem,4vw,2.45rem)}
h3{font-size:1.18rem}
p{margin:0 0 1rem}
.ic{display:inline-block;vertical-align:middle;fill:currentColor}
.wrap{width:min(92%,1120px);margin-inline:auto}
.eyebrow{font-family:var(--font-body);text-transform:uppercase;letter-spacing:.22em;font-size:.72rem;font-weight:600;color:var(--sage-d);margin:0 0 .7rem}
.lead{font-size:1.08rem;color:var(--ink-soft);max-width:48ch}
.section{padding-block:clamp(2.6rem,6vw,5rem)}
.bg-alt{background:var(--bg2)}
.section-head{margin-bottom:1.9rem}
.section-head.between{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap}
/* header */
.site-header{position:fixed;top:0;left:0;right:0;z-index:200;background:var(--header-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);transition:box-shadow .3s,background .3s}
.hdr-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.8rem}
.site-header.scrolled{box-shadow:0 8px 26px rgba(110,90,52,.12)}
.site-header.scrolled .hdr-inner{padding-block:.45rem}
.brand{display:flex;align-items:center;gap:.7rem}
.brand-logo{height:54px;width:auto;transition:height .3s;filter:drop-shadow(0 3px 8px rgba(110,90,52,.22))}
.site-header.scrolled .brand-logo{height:44px}
.brand-text{font-family:var(--font-display);font-size:1.2rem;font-weight:600}
.brand-text em{font-style:normal;color:var(--accent)}
.site-nav{display:flex;align-items:center;gap:1.5rem}
.site-nav a{font-size:.96rem;color:var(--ink-soft);position:relative;padding:.2rem 0;transition:color .2s}
.site-nav a:hover{color:var(--ink)}.site-nav a.active{color:var(--ink)}
.site-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:2px;background:var(--accent);transition:right .25s}
.site-nav a:hover::after,.site-nav a.active::after{right:0}
.cart{display:inline-flex;align-items:center;gap:.3rem;color:var(--ink)}
.cart .ic{width:22px;height:22px}
.cart i{font-style:normal;background:var(--accent);color:var(--on-accent);font-size:.7rem;min-width:18px;height:18px;border-radius:9px;display:inline-grid;place-items:center;padding:0 4px}
.nav-toggle{display:none;width:42px;height:38px;flex-direction:column;justify-content:center;gap:5px;padding:8px;position:relative;z-index:210}
.nav-toggle span{height:2px;background:var(--ink);border-radius:2px;transition:transform .3s,opacity .2s}
#main{padding-top:84px}
/* page transition */
.page[hidden]{display:none}
.page{animation:pageIn .5s ease both}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:.45rem;background:var(--accent);color:var(--on-accent);padding:.8rem 1.4rem;border-radius:var(--radius);font-weight:600;font-size:.95rem;transition:transform .2s,box-shadow .2s,background .2s;box-shadow:0 7px 18px rgba(190,118,111,.28)}
.btn:hover{transform:translateY(-2px);background:var(--accent-d);box-shadow:0 11px 26px rgba(190,118,111,.34)}
.btn .ic{width:18px;height:18px}
.btn-outline{background:transparent;color:var(--ink);border:1.6px solid var(--line);box-shadow:none}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);background:transparent}
.btn-text{background:none;box-shadow:none;color:var(--accent);padding:.4rem 0}
.btn-text:hover{transform:none;gap:.65rem;background:none}
.btn-light{background:#fff;color:var(--ink);box-shadow:0 7px 18px rgba(80,70,40,.18)}
.btn-light:hover{background:#fff}
.btn-sm{padding:.5rem .9rem;font-size:.85rem;border-radius:calc(var(--radius) - 3px)}
/* media */
.media{position:relative;overflow:hidden;border-radius:var(--radius-lg);aspect-ratio:4/3;background:linear-gradient(135deg,#FBEEE0,#F3DAD3 55%,#E8E7C4)}
.media::after{content:"";position:absolute;inset:0;z-index:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='%236E5A45'%3E%3Cellipse cx='25' cy='16' rx='5.5' ry='8' transform='rotate(-12 25 16)'/%3E%3Cellipse cx='39' cy='16' rx='5.5' ry='8' transform='rotate(12 39 16)'/%3E%3Cellipse cx='13' cy='28' rx='5' ry='7' transform='rotate(-30 13 28)'/%3E%3Cellipse cx='51' cy='28' rx='5' ry='7' transform='rotate(30 51 28)'/%3E%3Cpath d='M32 30C21 30 16 38 16 46C16 53 22 58 32 58C42 58 48 53 48 46C48 38 43 30 32 30Z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:32% auto;opacity:.16}
.media img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;filter:var(--img-filter);transition:transform .6s ease;color:transparent;font-size:0}
.card:hover .media img,.tile:hover .media img{transform:scale(1.05)}
/* grids */
.grid{display:grid;gap:1.3rem}
.grid-cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))}
.grid-explore{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.grid-steps{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.grid-social{grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr))}
/* card */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.card .media{aspect-ratio:1/1;border-radius:0}
.card-body{padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.prod-name{margin:0;font-size:1.08rem}
.prod-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:auto}
.price{font-family:var(--font-display);font-weight:600;font-size:1.12rem;color:var(--ink)}
.tag{position:absolute;left:.7rem;top:.7rem;background:var(--surface);color:var(--ink);font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;padding:.28rem .55rem;border-radius:20px;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.post-date{font-size:.76rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.1em;margin:0}
.excerpt{color:var(--ink-soft);font-size:.94rem;margin:0}
/* tiles */
.tile{display:flex;flex-direction:column;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}
.tile:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.tile .media{aspect-ratio:3/4;border-radius:0}
.tile-cap{padding:1rem 1.1rem 1.2rem;position:relative}
.tile-cap h3{margin:0 0 .2rem}.tile-cap p{margin:0;color:var(--ink-soft);font-size:.9rem}
.tile-go{position:absolute;right:1.1rem;top:1.1rem;color:var(--accent)}.tile-go .ic{width:20px;height:20px}
/* socials */
.follow-row{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.4rem 0 0}
.follow-row.center{justify-content:center}
.socials-home .follow-row{margin-top:1.1rem}
.follow-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.05rem;border-radius:30px;border:1.5px solid var(--line);background:var(--surface);font-weight:600;font-size:.9rem;color:var(--ink);transition:.2s}
.follow-btn:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
.follow-btn .ic{width:18px;height:18px}
.spost{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}
.spost:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.spost-media{aspect-ratio:1/1;border-radius:0}
.plat-badge{position:absolute;top:.55rem;right:.55rem;z-index:2;width:30px;height:30px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 2px 8px rgba(0,0,0,.16);color:var(--ink)}
.plat-badge .ic{width:16px;height:16px}
.plat-instagram{color:var(--accent)}.plat-tiktok{color:var(--ink)}.plat-facebook{color:var(--sage-d)}.plat-pinterest{color:var(--accent-d)}
.spost-body{padding:.75rem .85rem .95rem;display:flex;flex-direction:column;gap:.4rem;flex:1}
.spost-cap{margin:0;font-size:.88rem;color:var(--ink);line-height:1.4}
.spost-stats{display:flex;flex-wrap:wrap;gap:.5rem .8rem;margin-top:auto;padding-top:.55rem;border-top:1px solid var(--line)}
.stat{display:inline-flex;align-items:center;gap:.28rem;font-size:.76rem;font-weight:600;color:var(--ink-soft)}
.stat .ic{width:14px;height:14px}
.stat .ic-heart{fill:var(--accent)}
.center-cta{text-align:center;margin-top:1.7rem}
/* welcome / feature / contact */
.welcome{background:var(--bg2)}
.welcome-grid,.feature-grid,.contact-grid{display:grid;gap:clamp(1.4rem,4vw,3rem);align-items:center}
.welcome-media{aspect-ratio:4/5;border-radius:var(--radius-lg);border:6px solid #fff;box-shadow:var(--shadow-lg)}
.feature-media{aspect-ratio:5/4}
@media(min-width:820px){.welcome-grid{grid-template-columns:.92fr 1.08fr}.feature-grid{grid-template-columns:1.05fr .95fr}.contact-grid{grid-template-columns:1fr 1fr}}
/* quote */
.quote{padding:1.5rem;gap:.8rem}
.quote blockquote{margin:0;font-family:var(--font-display);font-size:1.12rem;line-height:1.42;color:var(--ink)}
.quote figcaption{color:var(--accent);font-weight:600;font-size:.9rem}
/* page hero */
.page-hero{padding-top:clamp(2.6rem,7vw,4.6rem);text-align:center;background:var(--bg2)}
.page-hero-inner{max-width:720px;margin-inline:auto}.page-hero .lead{margin-inline:auto}
.soon-pill,.soon-note{display:inline-block;background:var(--surface);border:1px dashed var(--pink-d);color:var(--ink);padding:.55rem 1.05rem;border-radius:30px;font-size:.9rem;margin-top:.6rem}
.soon-note{margin:0 0 1.2rem}
/* chips */
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.7rem;justify-content:center}
.chip{border:1.4px solid var(--line);padding:.5rem 1rem;border-radius:30px;font-size:.88rem;color:var(--ink-soft);transition:.2s}
.chip:hover{color:var(--ink);border-color:var(--accent)}
.chip.active{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
/* subscribe */
.subscribe{display:flex;gap:.6rem;flex-wrap:wrap}
.subscribe input{flex:1;min-width:180px;padding:.8rem 1rem;border-radius:var(--radius);border:1.4px solid var(--line);background:var(--surface);color:var(--ink);font:inherit}
.subscribe input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.sub-strip .sub-card{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.7rem;box-shadow:var(--shadow)}
.sub-card h2{margin:0 0 .3rem;font-size:1.5rem}.sub-card p{margin:0;color:var(--ink-soft)}
.micro{font-size:.72rem;color:var(--ink-soft);margin:.5rem 0 0}
/* steps */
.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.4rem;box-shadow:var(--shadow)}
.step-n{font-family:var(--font-display);font-size:1.6rem;color:var(--accent);font-weight:600}
.step h3{margin:.4rem 0 .3rem}.step p{margin:0;color:var(--ink-soft);font-size:.92rem}
.foster-media{aspect-ratio:4/5 !important}
.foster-kind{color:var(--accent);font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;margin:0}
.section-sub{color:var(--ink-soft);max-width:54ch;margin:.35rem 0 0;font-size:1rem}
#available-fosters{scroll-margin-top:90px}
.avail-badge{position:absolute;left:.7rem;top:.7rem;z-index:2;background:var(--band);color:#fff;font-size:.64rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;padding:.32rem .62rem;border-radius:20px;box-shadow:0 2px 8px rgba(0,0,0,.14)}
.past-media{aspect-ratio:1/1 !important}
.adopted-badge{position:absolute;left:.7rem;top:.7rem;z-index:2;display:inline-flex;align-items:center;gap:.32rem;background:#fff;color:var(--accent);font-size:.66rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;padding:.32rem .62rem;border-radius:20px;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.adopted-badge .ic{width:13px;height:13px;fill:var(--accent)}
/* work */
.work-card{padding:1.5rem}
.work-ic{display:inline-grid;place-items:center;width:50px;height:50px;border-radius:50%;background:var(--bg2);color:var(--sage-d);margin-bottom:.5rem}
.work-ic .ic{width:26px;height:26px}
/* contact */
.contact-form{padding:1.6rem;gap:.9rem;box-shadow:var(--shadow)}
.contact-form label{display:flex;flex-direction:column;gap:.3rem;font-size:.82rem;font-weight:600;color:var(--ink-soft)}
.contact-form input,.contact-form textarea{padding:.7rem .85rem;border-radius:var(--radius);border:1.4px solid var(--line);background:var(--bg);font:inherit;color:var(--ink);resize:vertical}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
/* faq */
.faq-wrap{max-width:760px;margin-inline:auto}
.faq{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.15rem 0;font-family:var(--font-display);font-size:1.1rem;text-align:left}
.faq-ic{transition:transform .3s;color:var(--accent)}.faq-ic .ic{width:22px;height:22px}
.faq.open .faq-ic{transform:rotate(180deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq.open .faq-a{max-height:220px}
.faq-a p{padding-bottom:1.15rem;margin:0;color:var(--ink-soft)}
/* foster band */
.foster-band{background:var(--band)}
.foster-band-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.foster-band h2,.foster-band p{color:var(--on-band)}.foster-band h2{margin-bottom:.3rem}
.foster-band p{margin:0;max-width:46ch;opacity:.95}
.eyebrow.light{color:var(--on-band);opacity:.9}
/* hero */
.hero{position:relative;text-align:center;background:#FFFCF4;padding-block:clamp(1.6rem,7vw,3.4rem) clamp(2.8rem,9vw,4.6rem);overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:#FFFCF4}
.hero-inner{position:relative;z-index:1;max-width:680px;margin-inline:auto}
.hero-logo{display:flex;justify-content:center;margin-bottom:1.1rem}
.hero-logo img{width:clamp(124px,38vw,178px);height:auto;filter:drop-shadow(0 9px 20px rgba(120,92,52,.22))}
.hero-menu{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.5rem;margin:0 auto 1.5rem;max-width:540px}
.hero-menu a{font-family:var(--font-body);font-size:.95rem;font-weight:600;color:var(--ink);position:relative;padding:.3rem .15rem;transition:color .2s}
.hero-menu a:hover{color:var(--accent)}
.hero-menu a::after{content:"";position:absolute;left:0;right:100%;bottom:.05rem;height:2px;background:var(--accent);transition:right .25s}
.hero-menu a:hover::after{right:0}
.hero h1{font-size:clamp(2.05rem,8.4vw,3.35rem);line-height:1.18;margin:0 auto .85rem;max-width:15ch;letter-spacing:-.01em}
.hl{background:linear-gradient(transparent 60%,rgba(239,194,94,.62) 0);font-style:italic;padding:.02em .1em;border-radius:3px}
.hero .lead{font-size:clamp(1rem,4vw,1.12rem);color:var(--ink-soft);max-width:40ch;margin:0 auto 1.7rem}
.hero-cta{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.1rem}
.hero-meta{font-size:.8rem;color:var(--ink-soft);letter-spacing:.05em;text-transform:uppercase;margin:0}
.btn-lg{padding:.95rem 1.7rem;font-size:1rem;border-radius:calc(var(--radius) + 2px)}
.hero-decor{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hero-decor .ic{position:absolute;color:var(--pink-d);opacity:.32}
.hero-decor .ic:nth-child(1){top:8%;left:6%;width:40px;animation:float 7s ease-in-out infinite}
.hero-decor .ic:nth-child(2){bottom:14%;right:8%;width:32px;color:var(--sage-d);opacity:.3;animation:float 9s ease-in-out infinite .6s}
.hero-decor .ic:nth-child(3){top:46%;right:13%;width:24px;animation:float 8s ease-in-out infinite .3s}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-13px) rotate(8deg)}}
/* footer */
.site-footer{background:var(--bg2);border-top:1px solid var(--line);padding-top:3rem;margin-top:1rem}
.foot-grid{display:grid;gap:2rem}
@media(min-width:760px){.foot-grid{grid-template-columns:1.4fr 1fr 1.6fr}}
.foot-logo{height:76px;width:auto;filter:drop-shadow(0 3px 8px rgba(110,90,52,.2))}
.foot-tag{font-family:var(--font-display);letter-spacing:.03em;color:var(--sage-d);margin:.7rem 0 .3rem;font-size:1.05rem}
.foot-note{color:var(--ink-soft);font-size:.9rem;max-width:32ch}
.foot-col h4{font-family:var(--font-display);font-size:1.1rem;margin:0 0 .8rem}
.foot-nav{display:flex;flex-direction:column;gap:.5rem}
.foot-nav a{color:var(--ink-soft)}.foot-nav a:hover{color:var(--accent)}
.foot-sub p{color:var(--ink-soft);font-size:.92rem;margin:.2rem 0 .8rem}
.soc-row{display:flex;gap:.6rem;margin-top:.9rem}
.soc{width:38px;height:38px;border-radius:50%;border:1.4px solid var(--line);display:grid;place-items:center;color:var(--ink-soft);transition:.2s}
.soc:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-2px)}.soc .ic{width:18px;height:18px}
.foot-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:2.5rem;padding:1.3rem 0;font-size:.82rem;color:var(--ink-soft)}
/* toast + modal */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(24px);background:var(--ink);color:#fff;padding:.85rem 1.3rem;border-radius:40px;font-size:.92rem;box-shadow:0 14px 34px rgba(0,0,0,.22);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:400;max-width:90vw;text-align:center}
.to-top{position:fixed;right:16px;bottom:16px;width:48px;height:48px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;box-shadow:0 8px 22px rgba(120,92,52,.28);opacity:0;pointer-events:none;transform:translateY(12px) scale(.9);transition:opacity .3s,transform .3s,background .2s;z-index:250}
.to-top.show{opacity:1;pointer-events:auto;transform:none}
.to-top:hover{background:var(--accent-d)}
.to-top .ic{width:22px;height:22px}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.modal{position:fixed;inset:0;z-index:300;background:rgba(56,44,30,.55);display:grid;place-items:center;padding:1.2rem}
.modal[hidden]{display:none}
.modal-card{background:var(--surface);border-radius:var(--radius-lg);max-width:600px;width:100%;max-height:86vh;overflow:auto;padding:2rem;position:relative;box-shadow:var(--shadow-lg);animation:pop .35s ease}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.modal-close{position:absolute;top:.8rem;right:.8rem;width:38px;height:38px;border-radius:50%;background:var(--bg2);display:grid;place-items:center;font-size:1.3rem;line-height:1;color:var(--ink)}
.modal-title{font-family:var(--font-display);margin:.2rem 2rem 1rem 0;font-size:1.6rem}
.modal-lead{color:var(--ink-soft);margin:0 0 1.1rem}
.modal-micro{font-size:.72rem;color:var(--ink-soft);margin:1rem 0 0;text-align:center}
.modal-form{display:flex;flex-direction:column;gap:.8rem}
.modal-form label{display:flex;flex-direction:column;gap:.3rem;font-size:.82rem;font-weight:600;color:var(--ink-soft)}
.modal-form input,.modal-form textarea{padding:.7rem .85rem;border-radius:var(--radius);border:1.4px solid var(--line);background:var(--bg);font:inherit;color:var(--ink);resize:vertical}
.modal-form input:focus,.modal-form textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.modal-form .btn{margin-top:.3rem;align-self:flex-start}
.modal-body p{color:var(--ink-soft)}.modal-body em{color:var(--accent)}
/* reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.reveal.d2{transition-delay:.09s}.reveal.d3{transition-delay:.18s}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.hero-decor .ic{animation:none}}
/* mobile nav */
@media(max-width:880px){
 .nav-toggle{display:flex}
 .site-nav{position:fixed;top:0;right:0;height:100vh;width:min(82vw,330px);background:var(--surface);flex-direction:column;align-items:flex-start;gap:.3rem;padding:5.4rem 1.7rem 2rem;box-shadow:-16px 0 44px rgba(80,60,35,.2);transform:translateX(106%);transition:transform .35s cubic-bezier(.4,0,.2,1);z-index:190}
 .site-nav.open{transform:none}
 .site-nav a{font-family:var(--font-display);font-size:1.35rem;padding:.55rem 0;width:100%;color:var(--ink)}
 .site-nav a::after{display:none}
 .cart{margin-top:1.1rem;font-size:1.05rem}
 .nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
 .nav-toggle.open span:nth-child(2){opacity:0}
 .nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
 .brand-text{display:none}
 .foot-bottom{justify-content:flex-start}
}

/* additions for Statamic version */
.coming-soon-banner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.4rem;padding:1.4rem 1.6rem;border-radius:var(--radius-lg);background:linear-gradient(135deg,#FAF2DF,#F0CFC9 70%);border:1px solid var(--line);box-shadow:var(--shadow)}
.coming-soon-banner h2{margin:.25rem 0 .35rem;font-size:clamp(1.15rem,2.4vw,1.45rem)}
.coming-soon-banner p{margin:0;color:var(--ink-soft);font-size:.95rem;max-width:520px}
.coming-soon-banner .sub-form{flex:1 1 240px;max-width:380px}
@media (max-width:640px){.coming-soon-banner{flex-direction:column;align-items:flex-start}}

.foot-legal{margin-top:.4rem;font-size:.85rem;color:var(--ink-soft)}
.foot-legal a{text-decoration:underline}
.foot-legal a:hover{color:var(--accent)}

.foster-kind{color:var(--ink-soft);font-size:.92rem;margin:.1rem 0 .5rem;font-style:italic}
.foster-bio{margin:.2rem 0 1rem;color:var(--ink)}

.tag-pending{background:var(--primary);color:var(--ink)}
.tag-adopted{background:var(--accent);color:var(--on-accent)}

.faq-contact{margin-top:1.4rem;text-align:center;color:var(--ink-soft);font-size:.93rem}
.faq-contact a{color:var(--accent);text-decoration:underline}

.post-cover img{aspect-ratio:16/9;object-fit:cover;width:100%}
.post-body .article{font-size:1.05rem;line-height:1.78}
.post-body .article p{margin:1rem 0}
.post-body .article h2,.post-body .article h3{margin-top:2rem}

.article-body{font-size:1rem;line-height:1.72}
.article-body p{margin:.8rem 0}

.form{display:grid;gap:.85rem;background:var(--surface);padding:1.4rem;border-radius:var(--radius-lg);border:1px solid var(--line);box-shadow:var(--shadow)}
.form label{display:block;font-size:.9rem;color:var(--ink-soft)}
.form input,.form textarea,.form select{display:block;width:100%;margin-top:.3rem;padding:.65rem .85rem;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit}
.form input:focus,.form textarea:focus,.form select:focus{outline:2px solid var(--accent);outline-offset:1px}

/* ============ deployment patches ============ */
/* Grid layouts for templates that use newer class names */
.grid-blog,.grid-shop{grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))}
.grid-foster{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.grid-past{grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr))}
.grid-testi{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.grid-work{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}

/* Footer social icons — constrain to small circular buttons */
.foot-socials{display:flex;gap:.7rem;margin-top:.7rem;flex-wrap:wrap}
.foot-socials a{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;display:inline-grid;place-items:center;color:var(--ink);background:var(--surface);transition:.2s;flex-shrink:0}
.foot-socials a:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-2px)}
.foot-socials .ic{width:18px;height:18px;display:block}

/* Footer layout — basic grid with subscribe column */
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;padding:3rem 0 1.5rem;align-items:start}
.foot-col h4{margin:0 0 .8rem;font-family:var(--font-display);font-size:1.05rem}
.foot-tag{margin:.6rem 0 .2rem;color:var(--ink-soft);font-size:.92rem;max-width:32ch}
.foot-links{list-style:none;padding:0;margin:0;display:grid;gap:.45rem}
.foot-links a{color:var(--ink-soft);font-size:.93rem}
.foot-links a:hover{color:var(--accent)}
.site-footer{background:var(--bg2);border-top:1px solid var(--line);margin-top:3rem}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem;padding:1rem 0 2rem;font-size:.85rem;color:var(--ink-soft);border-top:1px solid var(--line)}
.foot-bottom p{margin:0}
.foot-sub p{color:var(--ink-soft);font-size:.9rem;margin:.2rem 0 .8rem}
.sub-form{display:flex;gap:.5rem;flex-wrap:wrap}
.sub-form input{flex:1;min-width:160px;padding:.6rem .85rem;border:1.4px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--ink);font:inherit}

/* FAQ — bridge .faq-item / .faq-list naming */
.faq-list{max-width:760px;margin-inline:auto}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item .faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.15rem 0;font-family:var(--font-display);font-size:1.1rem;text-align:left;background:none;border:none;cursor:pointer;color:inherit}
.faq-item .faq-q .ic{width:22px;height:22px;color:var(--accent);transition:transform .3s}
.faq-item.open .faq-q .ic{transform:rotate(180deg)}
.faq-item .faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq-item.open .faq-a{max-height:300px}
.faq-item .faq-a p{padding-bottom:1.15rem;margin:0;color:var(--ink-soft)}

/* Steps — bridge .step-num naming */
.step-num{font-family:var(--font-display);font-size:1.6rem;color:var(--accent);font-weight:600;display:block}

/* Adopted tag on past-foster cards */
.past-foster .tag-adopted{background:#fff;color:var(--accent);box-shadow:0 2px 8px rgba(0,0,0,.12)}
.past-foster .tag{font-weight:600}
.past-foster figcaption{padding:.9rem 1rem 1.1rem;font-size:.92rem;color:var(--ink-soft);text-align:center;background:var(--surface);margin:0}
.past-foster figcaption strong{color:var(--ink);font-family:var(--font-display);font-size:1.05rem;display:block;margin-bottom:.2rem}

/* Foster card body padding (was missing) */
.foster .card-body{padding:1.1rem 1.2rem 1.3rem}

/* Section-sub typography helper */
.section-sub{color:var(--ink-soft);font-size:.95rem;margin:.5rem 0 0;max-width:48ch}
.section-head .section-sub{margin-inline:auto}

/* Section-head centering for page heroes */
.section-head{text-align:center;margin-bottom:2rem}
.section-head h2{font-family:var(--font-display);margin:.2rem 0}

/* Subscribe card spacing */
.sub-band .sub-card{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.7rem;box-shadow:var(--shadow)}
.sub-band .sub-card h3{margin:0 0 .3rem}
.sub-band .sub-card p{margin:0;color:var(--ink-soft)}

/* Hero-menu nav — center the inline link group */
.hero-menu{display:flex;flex-wrap:wrap;gap:1.2rem;justify-content:center;margin:1.5rem 0 .5rem;font-family:var(--font-display);font-size:1.05rem}
.hero-menu a{position:relative;padding:.25rem .1rem;color:var(--ink)}
.hero-menu a:hover{color:var(--accent)}

/* Welcome grid (was used but not styled enough) */
.welcome-grid{grid-template-columns:1fr 1fr}
@media (max-width:760px){.welcome-grid{grid-template-columns:1fr}}

/* Highlight in hero headline */
.hl{background:linear-gradient(180deg,transparent 62%,var(--primary) 62%);padding:0 .15em;font-style:italic}

/* Hero spacing */
.hero h1{font-family:var(--font-display);font-size:clamp(2rem,5.5vw,3.4rem);line-height:1.08;margin:.4rem 0 .9rem;max-width:16ch;margin-inline:auto;text-align:center}
.hero .lead{margin:0 auto 1.4rem;text-align:center}
.hero-logo{display:flex;justify-content:center;margin-bottom:.6rem}
.hero-logo img{width:clamp(140px,22vw,200px);height:auto}
.hero-cta{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center}
.btn-lg{padding:.95rem 1.7rem;font-size:1rem}
.hero-meta{margin-top:1.4rem;text-align:center;font-size:.78rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.16em}

/* Header */
.site-header{position:sticky;top:0;z-index:200;background:var(--header-bg);backdrop-filter:blur(8px);border-bottom:1px solid transparent;transition:border-color .3s, padding .3s}
.site-header.scrolled{border-bottom-color:var(--line)}
.hdr-inner{display:flex;align-items:center;justify-content:space-between;padding:.85rem 0}
.site-nav{display:flex;align-items:center;gap:1.4rem;font-family:var(--font-display)}
.site-nav a{position:relative;padding:.3rem .1rem;color:var(--ink);font-size:.95rem}
.site-nav a:hover{color:var(--accent)}

/* Mobile nav */
@media (max-width:880px){
  .nav-toggle{display:flex}
  .site-nav{position:fixed;top:0;right:0;height:100vh;width:280px;max-width:80vw;background:var(--surface);flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:5rem 1.6rem 1.6rem;gap:1.1rem;transform:translateX(110%);transition:transform .35s ease;box-shadow:-6px 0 24px rgba(0,0,0,.12);z-index:205}
  .site-nav.open{transform:translateX(0)}
  .site-nav a{font-size:1.05rem}
  .cart{margin-top:.8rem}
}

/* Toast */
.toast{position:fixed;left:50%;bottom:1.4rem;transform:translateX(-50%) translateY(110%);background:var(--ink);color:#fff;padding:.85rem 1.3rem;border-radius:30px;font-size:.92rem;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:400;transition:transform .35s ease;pointer-events:none}
.toast.show{transform:translateX(-50%) translateY(0)}

/* Back-to-top */
.to-top{position:fixed;right:1.1rem;bottom:1.1rem;width:48px;height:48px;border-radius:50%;background:var(--accent);color:var(--on-accent);box-shadow:var(--shadow);display:grid;place-items:center;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s;z-index:150;pointer-events:none;border:none;cursor:pointer}
.to-top.visible{opacity:1;transform:translateY(0);pointer-events:auto}

/* Reveal animation (already in CSS but ensure it fires) */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}
.reveal.d2{transition-delay:.08s}
.reveal.d3{transition-delay:.16s}

/* social cards as clickable links */
a.spost{color:inherit;text-decoration:none;cursor:pointer;display:flex;flex-direction:column}

/* footer Explore links — 2 columns instead of one tall stack */
.foot-links{grid-template-columns:1fr 1fr;column-gap:1.5rem}

/* Shop product "Coming soon" pill (replaces Add to cart while shop is closed) */
.prod-soon{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--accent);background:var(--pink);padding:.42rem .8rem;border-radius:20px;font-weight:600}

/* /socials page — feed sections */
.feed-section{padding-block:2.2rem}
.embed-wrap{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;max-width:680px;margin-inline:auto}
.embed-wrap iframe,.embed-wrap .fb-page{max-width:100%}
.feed-section .section-head{margin-bottom:1.4rem}

/* Blog: empty-state styling */
.empty-state{font-style:italic}

/* Text-only social post cards — used when no image attached (e.g. Facebook video/text posts) */
.post-text{background:linear-gradient(160deg,var(--bg2) 0%,#FAF2DF 70%,var(--pink) 100%);border:1px solid var(--line);border-radius:var(--radius-lg);padding:0;color:inherit;text-decoration:none;display:flex;flex-direction:column;min-height:240px;transition:transform .25s,box-shadow .25s}
.post-text:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.post-text .card-body{padding:1.4rem 1.4rem 1.4rem;display:flex;flex-direction:column;gap:.7rem;flex:1}
.post-text-meta{margin:0;font-size:.78rem;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-soft)}
.post-text-tag{color:var(--accent);font-weight:600}
.post-text-body{font-family:var(--font-display);font-size:1.05rem;line-height:1.5;color:var(--ink);margin:0}

/* Modal — hidden by default, shown when .open class is added by JS */
.modal{display:none}
.modal.open{display:grid}
body.modal-open{overflow:hidden}

/* Foster bio truncation — collapse to ~6 lines, "Read more" expands inline */
.foster-bio-wrap{position:relative}
.foster-bio-wrap[data-collapsed="true"] .foster-bio{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:.5rem}
.foster-bio-wrap[data-collapsed="false"] .foster-bio{display:block;margin-bottom:.5rem}
.foster-bio-toggle{background:none;border:0;padding:0;color:var(--accent);font-weight:600;font-size:.85rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px;margin-bottom:.8rem}
.foster-bio-toggle:hover{opacity:.8}

/* Additional scattered paw prints in hero — more sprinkled cottagecore feel */
.hero-decor .ic:nth-child(4){top:24%;right:5%;width:30px;color:var(--sage-d);opacity:.26;transform:rotate(18deg);animation:float 8.5s ease-in-out infinite .9s}
.hero-decor .ic:nth-child(5){bottom:28%;left:7%;width:34px;color:var(--pink-d);opacity:.3;transform:rotate(-22deg);animation:float 7.5s ease-in-out infinite .4s}
.hero-decor .ic:nth-child(6){top:60%;left:14%;width:22px;color:var(--sage-d);opacity:.28;transform:rotate(35deg);animation:float 9.2s ease-in-out infinite .2s}
.hero-decor .ic:nth-child(7){top:36%;left:4%;width:26px;color:var(--pink-d);opacity:.24;transform:rotate(-12deg);animation:float 8s ease-in-out infinite .7s}
.hero-decor .ic:nth-child(8){bottom:46%;right:22%;width:28px;color:var(--sage-d);opacity:.26;transform:rotate(8deg);animation:float 7.8s ease-in-out infinite .5s}

/* About / team cards */
.grid-team{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem}
.team-card{padding:1.7rem 1.5rem}
.team-card h3{margin:0 0 .35rem;font-size:1.25rem}
.team-role{font-size:.74rem;text-transform:uppercase;letter-spacing:.14em;color:var(--accent);font-weight:600;margin:0 0 1rem}
.team-bio{color:var(--ink-soft);font-size:.95rem;line-height:1.6;margin:0 0 .7rem}
.team-faves{font-size:.85rem;font-style:italic;color:var(--ink-soft);margin:.6rem 0 0;padding-top:.7rem;border-top:1px solid var(--line)}

/* About / team cards — circle avatars on top, text below, all center-aligned */
.grid-team{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem}
.team-card{padding:1.7rem 1.5rem;text-align:center}
.team-photo{width:140px;height:140px;border-radius:50%;margin:0 auto 1.1rem;background:var(--pink);overflow:hidden;border:3px solid var(--bg2);box-shadow:var(--shadow);display:grid;place-items:center;color:#fff;font-family:var(--font-display);font-size:3rem}
.team-photo img{width:100%;height:100%;object-fit:cover;display:block}
.team-photo-fallback{font-size:3rem;color:#fff}
.team-card h3{margin:0 0 .35rem;font-size:1.25rem}
.team-role{font-size:.74rem;text-transform:uppercase;letter-spacing:.14em;color:var(--accent);font-weight:600;margin:0 0 1rem}
.team-bio{color:var(--ink-soft);font-size:.95rem;line-height:1.6;margin:0 0 .7rem;text-align:left}
.team-faves{font-size:.85rem;font-style:italic;color:var(--ink-soft);margin:.6rem 0 0;padding-top:.7rem;border-top:1px solid var(--line);text-align:left}

/* Foster photo: clickable link to Wake County */
.foster-media a{display:block;width:100%;height:100%;cursor:pointer;overflow:hidden;position:relative}
.foster-media a img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.foster-media a:hover img{transform:scale(1.03)}

/* FAQ answer bullet list styling */
.faq-a ul{margin:.5rem 0 .8rem 1.2rem;padding:0;color:var(--ink-soft);line-height:1.7}
.faq-a ul li{margin:.15rem 0}

/* Make inline content links visually obvious — accent color + underline */
.faq-a a, .team-bio a, .team-faves a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.faq-a a:hover, .team-bio a:hover, .team-faves a:hover{text-decoration-thickness:2.5px}

/* Home page Instagram tile — show 8 posts (2 rows of 4), no gap, no internal scroll */
.socials-home .embed-wrap{max-width:1100px;width:100%}
.socials-home .embed-wrap iframe{height:760px;overflow:hidden}
@media (max-width:900px){.socials-home .embed-wrap iframe{height:1100px}}
@media (max-width:600px){.socials-home .embed-wrap iframe{height:1900px}}

/* Finer responsive tuning for Fouita IG grids (home + socials), 8 posts */
@media (max-width:1100px){.socials-home .embed-wrap iframe{height:900px}}
@media (max-width:820px){.socials-home .embed-wrap iframe{height:1300px}}
@media (max-width:560px){.socials-home .embed-wrap iframe{height:2400px}}
@media (max-width:400px){.socials-home .embed-wrap iframe{height:2100px}}

/* Instagram Fouita iframe — unified treatment for home + socials, 8 posts, no squeeze */
.socials-home .embed-wrap, .feed-section .embed-wrap{max-width:1100px;width:100%;margin-inline:auto}
.socials-home .embed-wrap iframe, .feed-section .embed-wrap iframe{width:100%;border:0;display:block;overflow:hidden}
/* desktop: 2 rows of 4 */
.socials-home .embed-wrap iframe, .feed-section .embed-wrap iframe{height:760px}
/* 3-column zone */
@media (max-width:1000px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:1050px}}
/* 2-column zone (the "looks funny" width in your screenshot) */
@media (max-width:760px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:1500px}}
/* 1-column zone (phones) */
@media (max-width:520px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:2600px}}

/* Truly hide Fouita's inner scrollbar by clipping it with a wrapper */
.socials-home .embed-wrap, .feed-section .embed-wrap{overflow:hidden;border-radius:12px}
.socials-home .embed-wrap iframe, .feed-section .embed-wrap iframe{width:calc(100% + 18px)!important}

/* Make Fouita iframes tall enough to show all 8 posts + See More button, no leftover scroll */
.socials-home .embed-wrap iframe, .feed-section .embed-wrap iframe{width:100%!important;height:980px!important}
@media (max-width:1000px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:1320px!important}}
@media (max-width:760px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:1850px!important}}
@media (max-width:520px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:3050px!important}}

/* Taller iframes as window narrows (more rows when fewer columns) */
@media (max-width:1000px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:1400px!important}}
@media (max-width:760px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:2100px!important}}
@media (max-width:520px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:3400px!important}}

/* 2-column zone needs more height: 8 posts = 4 rows + button */
@media (max-width:760px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:2900px!important}}

/* === FINAL Fouita iframe heights — overrides all earlier scattered rules === */
/* desktop / 4-col: 8 posts = 2 rows */
.socials-home .embed-wrap iframe, .feed-section .embed-wrap iframe{height:980px!important}
/* ~3-col */
@media (max-width:1000px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:1350px!important}}
/* ~2-col */
@media (max-width:700px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:2000px!important}}
/* 1-col phones */
@media (max-width:480px){.socials-home .embed-wrap iframe,.feed-section .embed-wrap iframe{height:3400px!important}}