/* ============================================================
   Living Spaces Gardening — portfolio + project pages
   Tokens match the homepage exactly. Do not fork these values.
   ============================================================ */
:root{
  --terra:#9e4732;--teal:#508e8a;--mustard:#c9802e;--cocoa:#63403c;
  --sand:#f8f5eb;--charcoal:#3b3836;--muted:#8a7a75;--white:#ffffff;
  --line:rgba(99,64,60,.12);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
*:focus-visible{outline:2px solid var(--terra);outline-offset:2px;}
html{scroll-behavior:smooth;}
body{font-family:'Noto Sans',sans-serif;background:var(--sand);color:var(--charcoal);overflow-x:hidden;}
img{display:block;}

.skip-nav{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:999;padding:12px 24px;background:var(--terra);color:#fff;font-size:.85rem;font-weight:600;text-decoration:none;border-radius:2px;}
.skip-nav:focus{position:fixed;left:16px;top:16px;width:auto;height:auto;overflow:visible;}

/* ---------- nav (homepage parity) ---------- */
#nav{position:fixed;top:0;left:0;right:0;z-index:600;display:flex;justify-content:space-between;align-items:center;padding:1.1rem 5%;transition:background .35s,box-shadow .35s;}
nav.scrolled{background:rgba(248,245,235,.97);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line);}
.nav-logo img{height:64px;width:auto;}
.nav-links{display:flex;gap:2.5rem;align-items:center;list-style:none;}
.nav-links a{font-size:.72rem;font-weight:600;letter-spacing:.06em;text-decoration:none;color:var(--charcoal);transition:color .2s;}
.nav-links a:hover{color:var(--teal)!important;}
.nav-links a[aria-current="page"]{color:var(--terra);}
.nav-cta{background:var(--terra)!important;color:#fff!important;padding:12px 18px;border-radius:2px;min-height:44px;display:inline-flex;align-items:center;}
.nav-cta:hover{background:var(--cocoa)!important;color:#fff!important;}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:.4rem;}
.hamburger span{display:block;width:22px;height:1.5px;background:var(--charcoal);transition:.3s;}
.nav-has-dropdown{position:relative;}
.nav-dropdown{display:none;position:absolute;top:100%;left:50%;transform:translateX(-50%);background:var(--sand);border:1px solid var(--line);border-radius:2px;padding:.4rem 0;min-width:210px;box-shadow:0 8px 24px rgba(0,0,0,.1);z-index:601;list-style:none;}
.nav-has-dropdown:hover .nav-dropdown{display:block;}
.nav-dropdown li a{display:block;padding:.55rem 1.25rem;font-size:.68rem;font-weight:600;letter-spacing:.06em;color:var(--charcoal);text-decoration:none;white-space:nowrap;transition:background .15s,color .15s;}
.nav-dropdown li a:hover{background:#f0ece0;color:var(--teal)!important;}

/* ---------- shared bits ---------- */
.eyebrow{font-size:.65rem;font-weight:700;letter-spacing:.08em;color:var(--teal);margin-bottom:1rem;display:flex;align-items:center;gap:.75rem;text-transform:uppercase;}
.eyebrow::before{content:'';display:block;width:24px;height:2px;background:var(--teal);}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 18px;border-radius:2px;font-size:.88rem;font-weight:600;letter-spacing:.02em;text-decoration:none;line-height:1.2;cursor:pointer;background:var(--terra);color:#fff;border:1.5px solid var(--terra);min-width:220px;transition:background .2s,transform .2s,border-color .2s;}
.btn-primary:hover{background:var(--cocoa);border-color:var(--cocoa);transform:translateY(-2px);}
.tag{font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.4rem .6rem;border-radius:2px;line-height:1;}
.tag-service{background:var(--teal);color:#fff;}
.tag-loc{background:transparent;color:var(--muted);border:1px solid var(--line);}
.pcard-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem;}

/* ---------- portfolio header ---------- */
.pf-head{padding:9rem 5% 2.5rem;position:relative;overflow:hidden;}
.pf-head::after{content:'';position:absolute;inset:0;background-image:url('assets/Living-Spaces-Gardening-Mark-Terracota-2.png');background-repeat:repeat;background-size:280px;opacity:.035;pointer-events:none;z-index:0;}
.pf-head-inner{position:relative;z-index:1;max-width:820px;}
.pf-head h1{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.08;font-weight:700;color:var(--charcoal);margin-bottom:1.2rem;}
.pf-head h1 em{font-style:normal;color:var(--terra);}
.pf-sub{font-size:.95rem;color:var(--muted);line-height:1.85;max-width:560px;}

/* ---------- filter bar ---------- */
.pf-bar{position:sticky;top:0;z-index:500;background:rgba(248,245,235,.97);backdrop-filter:blur(10px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.pf-bar-inner{display:flex;align-items:center;gap:1.5rem;padding:.9rem 5%;}
.pf-filter-toggle{background:none;border:1.5px solid var(--line);border-radius:2px;padding:.6rem 1rem;min-height:44px;font-family:inherit;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--charcoal);cursor:pointer;display:inline-flex;align-items:center;gap:.6rem;transition:border-color .2s,color .2s;}
.pf-filter-toggle:hover,.pf-filter-toggle[aria-expanded="true"]{border-color:var(--teal);color:var(--teal);}
.pf-plus{font-size:1rem;line-height:1;transition:transform .25s;}
.pf-filter-toggle[aria-expanded="true"] .pf-plus{transform:rotate(45deg);}
.pf-count{font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-right:auto;}
.pf-view{display:flex;border:1.5px solid var(--line);border-radius:2px;overflow:hidden;}
.vbtn{background:none;border:none;padding:.6rem 1rem;min-height:44px;font-family:inherit;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);cursor:pointer;transition:background .2s,color .2s;}
.vbtn+.vbtn{border-left:1.5px solid var(--line);}
.vbtn.is-on{background:var(--charcoal);color:var(--sand);}

.pf-filters{padding:1.5rem 5% 2rem;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:2.5rem;align-items:flex-start;}
.pf-filters[hidden]{display:none;}
.fgroup-label{font-size:.6rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:.75rem;}
.fgroup-btns{display:flex;flex-wrap:wrap;gap:.5rem;}
/* square-cornered buttons — deliberately not pills */
.fbtn{background:transparent;border:1.5px solid var(--line);border-radius:2px;padding:.65rem 1rem;min-height:44px;font-family:inherit;font-size:.7rem;font-weight:600;letter-spacing:.04em;color:var(--charcoal);cursor:pointer;transition:border-color .2s,background .2s,color .2s;}
.fbtn:hover{border-color:var(--teal);color:var(--teal);}
.fbtn.is-on{background:var(--terra);border-color:var(--terra);color:#fff;}
.fbtn.is-on:hover{background:var(--cocoa);border-color:var(--cocoa);color:#fff;}
.fclear{margin-left:auto;align-self:flex-end;background:none;border:none;font-family:inherit;font-size:.7rem;font-weight:600;color:var(--muted);cursor:pointer;text-decoration:underline;text-decoration-color:rgba(138,122,117,.35);padding:.5rem 0;}
.fclear:hover{color:var(--terra);}

/* ---------- grid ---------- */
.pf-grid-wrap{padding:3rem 5% 6rem;}
.pf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem 1.75rem;}
.pcard{display:flex;flex-direction:column;}
.pcard[hidden]{display:none;}

.pcard-media{position:relative;overflow:hidden;border-radius:3px;background:#e9e3d5;aspect-ratio:4/3;touch-action:pan-y;}
.pcard-track{display:flex;height:100%;transition:transform .45s cubic-bezier(.4,0,.2,1);will-change:transform;}
.pcard-track.is-dragging{transition:none;}
.pcard-slide{flex:0 0 100%;height:100%;display:block;}
.pcard-slide img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.pcard:hover .pcard-slide img{transform:scale(1.04);}

.pcard-arrow{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border:none;border-radius:50%;background:rgba(248,245,235,.92);color:var(--charcoal);font-size:1.3rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s,background .2s;z-index:2;}
.pcard-media:hover .pcard-arrow,.pcard-arrow:focus-visible{opacity:1;}
.pcard-arrow:hover{background:#fff;}
.pcard-arrow[disabled]{opacity:0!important;pointer-events:none;}
.pcard-prev{left:.6rem;}
.pcard-next{right:.6rem;}

.pcard-count{position:absolute;top:.7rem;right:.7rem;z-index:2;background:rgba(59,56,54,.72);color:var(--sand);font-size:.6rem;font-weight:700;letter-spacing:.1em;padding:.3rem .5rem;border-radius:2px;}
.pcard-count b{color:#fff;}

.pcard-dots{position:absolute;bottom:.7rem;left:50%;transform:translateX(-50%);display:flex;gap:.35rem;z-index:2;}
.pcard-dot{width:22px;height:3px;border:none;border-radius:0;padding:0;background:rgba(248,245,235,.45);cursor:pointer;transition:background .2s;}
.pcard-dot.is-on{background:var(--sand);}

.pcard-swipe-hint{position:absolute;bottom:.55rem;right:.7rem;z-index:2;font-size:.55rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(248,245,235,.8);pointer-events:none;display:none;}

.pcard-body{display:block;padding:1.25rem 0 0;text-decoration:none;color:inherit;}
.pcard-title{font-size:1.15rem;font-weight:700;line-height:1.3;color:var(--charcoal);margin-bottom:.5rem;transition:color .2s;}
.pcard-body:hover .pcard-title{color:var(--terra);}
.pcard-sum{font-size:.82rem;color:var(--muted);line-height:1.75;margin-bottom:.9rem;}
.pcard-link{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);border-bottom:2px solid rgba(80,142,138,.3);padding-bottom:.15rem;transition:border-color .2s;}
.pcard-body:hover .pcard-link{border-color:var(--teal);}

/* list view */
.pf-grid.is-list{grid-template-columns:1fr;gap:0;}
.pf-grid.is-list .pcard{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:2rem;align-items:center;padding:2rem 0;border-bottom:1px solid var(--line);}
.pf-grid.is-list .pcard:first-child{border-top:1px solid var(--line);}
.pf-grid.is-list .pcard-media{aspect-ratio:16/10;}
.pf-grid.is-list .pcard-body{padding:0;max-width:560px;}
.pf-grid.is-list .pcard-title{font-size:1.5rem;}

.pf-empty{text-align:center;padding:5rem 0;}
.pf-empty[hidden]{display:none;}
.pf-empty-h{font-size:1.2rem;font-weight:700;color:var(--charcoal);margin-bottom:.5rem;}
.pf-empty p{color:var(--muted);font-size:.88rem;line-height:1.8;margin-bottom:1.5rem;}

/* ---------- project page ---------- */
.crumbs{padding:7.5rem 5% 0;}
.crumbs ol{list-style:none;display:flex;gap:.5rem;flex-wrap:wrap;font-size:.68rem;font-weight:600;letter-spacing:.06em;color:var(--muted);}
.crumbs li+li::before{content:'/';margin-right:.5rem;opacity:.5;}
.crumbs a{color:var(--muted);text-decoration:none;}
.crumbs a:hover{color:var(--teal);}

.proj-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center;padding:2rem 5% 4rem;}
.proj-hero-media{overflow:hidden;border-radius:3px;aspect-ratio:4/3;background:#e9e3d5;}
.proj-hero-media img{width:100%;height:100%;object-fit:cover;}
.proj-hero-text h1{font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:700;line-height:1.12;margin-bottom:1rem;}
.proj-sum{font-size:1rem;color:var(--muted);line-height:1.85;margin-bottom:2rem;}
.proj-facts{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-bottom:2.25rem;border-top:1px solid var(--line);padding-top:1.5rem;}
.proj-facts dt{font-size:.6rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:.3rem;}
.proj-facts dd{font-size:.85rem;font-weight:600;color:var(--charcoal);line-height:1.5;}

.proj-story{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.story-col{background:var(--sand);padding:3rem 2rem;}
.story-col p:not(.eyebrow){font-size:.88rem;color:var(--muted);line-height:1.9;}

.proj-plants{padding:4rem 5%;}
.plant-list{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;}
.plant-list li{font-size:.75rem;font-weight:600;color:var(--charcoal);border:1.5px solid var(--line);border-radius:2px;padding:.55rem .85rem;background:#fff;}

.proj-shots{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;padding:0 5% 5rem;}
.proj-shots-single{grid-template-columns:1fr;max-width:900px;margin:0 auto;}
.shot{border-radius:3px;overflow:hidden;background:#e9e3d5;}
.shot img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.shot figcaption{font-size:.78rem;color:var(--muted);line-height:1.7;padding:.85rem .25rem 0;}

.proj-nav{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:2.5rem 5%;border-top:1px solid var(--line);}
.proj-nav-link{text-decoration:none;max-width:30%;}
.proj-nav-next{text-align:right;}
.proj-nav-dir{display:block;font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:.35rem;}
.proj-nav-title{font-size:.88rem;font-weight:600;color:var(--charcoal);line-height:1.4;}
.proj-nav-link:hover .proj-nav-title{color:var(--terra);}
.proj-nav-all{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--charcoal);text-decoration:none;border:1.5px solid var(--line);border-radius:2px;padding:.7rem 1.1rem;transition:border-color .2s,color .2s;}
.proj-nav-all:hover{border-color:var(--teal);color:var(--teal);}

/* ---------- CTA + footer (homepage parity) ---------- */
.cta{background:var(--terra);padding:8rem 5%;text-align:center;}
.cta-inner{max-width:640px;margin:0 auto;}
.cta .eyebrow{color:rgba(255,255,255,.85);justify-content:center;margin-bottom:1.25rem;}
.cta .eyebrow::before{background:rgba(255,255,255,.6);}
.cta h2{font-size:clamp(2rem,4vw,3.4rem);color:#fff;font-weight:700;line-height:1.1;margin-bottom:1.2rem;}
.cta h2 em{font-style:normal;color:#fff;text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:4px;}
.cta p{font-size:.93rem;color:rgba(255,255,255,.85);line-height:1.8;margin-bottom:3rem;}
.cta-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;max-width:520px;margin:0 auto 1.5rem;}
.cta-sms-btn{display:inline-flex;align-items:center;min-height:48px;padding:12px 18px;border-radius:2px;font-size:.88rem;font-weight:400;text-decoration:none;line-height:1.2;cursor:pointer;border:1.5px solid rgba(255,255,255,.2);color:var(--charcoal);background:rgba(255,255,255,.9);text-align:left;transition:background .2s,border-color .2s;}
.cta-sms-btn:hover{background:#fff;border-color:#fff;}
.cta-sms-wide{grid-column:1/-1;background:#fff!important;color:var(--terra)!important;justify-content:center;font-weight:600;border:none!important;}
.cta-sms-wide:hover{background:var(--sand)!important;}

footer{background:var(--charcoal);padding:3rem 5%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:2rem;}
.footer-logo img{height:64px;width:auto;opacity:.7;}
.footer-center{text-align:center;}
footer p{color:rgba(255,255,255,.70);font-size:.72rem;}
.footer-center a{color:rgba(255,255,255,.55);text-decoration:underline;}
.footer-right{text-align:right;display:flex;flex-direction:column;gap:.6rem;align-items:flex-end;}
.footer-social{display:flex;gap:.75rem;align-items:center;}
.footer-social img{opacity:.6;transition:opacity .2s;}
.footer-social a:hover img{opacity:1;}
.footer-right a{color:rgba(255,255,255,.80);text-decoration:underline;text-decoration-color:rgba(255,255,255,.2);font-size:.75rem;transition:color .2s;}
.footer-right a:hover{color:var(--teal);}
.sister-site{color:#74b9b4!important;font-weight:600;text-decoration:none!important;}

/* ---------- modals (homepage parity) ---------- */
.sms-overlay,.picker-overlay,.email-overlay{display:none;position:fixed;inset:0;z-index:999;background:rgba(59,56,54,.7);align-items:center;justify-content:center;backdrop-filter:blur(4px);}
.sms-overlay.open,.picker-overlay.open,.email-overlay.open{display:flex;}
.sms-modal{background:var(--sand);border-radius:3px;padding:2.75rem;max-width:460px;width:90%;position:relative;}
.sms-close,.picker-close,.email-close{position:absolute;top:1.1rem;right:1.1rem;background:none;border:none;font-size:1.25rem;cursor:pointer;color:var(--muted);width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s;}
.sms-close:hover,.picker-close:hover,.email-close:hover{background:rgba(0,0,0,.07);}
.sms-modal .eyebrow{margin-bottom:.6rem;}
.sms-modal h3{font-size:1.55rem;color:var(--charcoal);margin-bottom:.5rem;font-weight:700;}
.sms-sub{font-size:.82rem;color:var(--muted);margin-bottom:1.75rem;line-height:1.6;}
.sms-options{display:flex;flex-direction:column;gap:.6rem;}
.sms-option{display:inline-flex;align-items:center;gap:.75rem;min-height:48px;padding:12px 18px;border-radius:2px;font-size:.88rem;text-decoration:none;border:1.5px solid rgba(80,142,138,.2);color:var(--charcoal);background:#fff;transition:background .2s,border-color .2s;}
.sms-option:hover{background:var(--sand);border-color:var(--teal);}
.sms-option span{opacity:.4;font-size:1.1rem;flex-shrink:0;}
.picker-modal{background:var(--sand);border-radius:3px;padding:2.5rem;max-width:360px;width:90%;position:relative;text-align:center;}
.picker-modal::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--terra),var(--mustard),var(--teal));border-radius:3px 3px 0 0;}
.picker-modal .eyebrow{margin-bottom:.5rem;justify-content:center;}
.picker-modal h3{font-size:1.3rem;color:var(--charcoal);margin-bottom:.4rem;font-weight:700;}
.picker-modal p{font-size:.82rem;color:var(--muted);margin-bottom:1.75rem;line-height:1.6;}
.picker-options{display:flex;flex-direction:column;gap:.75rem;}
.picker-btn{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem;border-radius:2px;font-family:inherit;font-size:.9rem;font-weight:600;cursor:pointer;border:none;transition:background .2s;min-height:52px;}
.picker-btn-text{background:var(--terra);color:#fff;}
.picker-btn-text:hover{background:var(--cocoa);}
.picker-btn-email{background:#fff;color:var(--charcoal);border:1.5px solid rgba(80,142,138,.3);}
.picker-btn-email:hover{border-color:var(--teal);}
.email-modal{background:var(--sand);border-radius:3px;padding:2.75rem;max-width:500px;width:90%;position:relative;max-height:92vh;overflow-y:auto;}
.email-modal::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--terra),var(--mustard),var(--teal));border-radius:3px 3px 0 0;}
.email-modal .eyebrow{margin-bottom:.5rem;}
.email-modal h3{font-size:1.45rem;color:var(--charcoal);margin-bottom:.4rem;font-weight:700;}
.email-modal .form-sub{font-size:.82rem;color:var(--muted);margin-bottom:1.5rem;line-height:1.6;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:.75rem;}
.form-group{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.75rem;}
.form-group label{font-size:.62rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);}
.form-group input,.form-group select,.form-group textarea{font-family:inherit;font-size:.85rem;color:var(--charcoal);background:#fff;border:1.5px solid rgba(80,142,138,.2);border-radius:2px;padding:.75rem .9rem;transition:border-color .2s;resize:none;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--teal);}
.form-group select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23508e8a' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;cursor:pointer;background-color:#fff;}
.field-hint{font-size:.65rem;color:var(--muted);margin-top:.25rem;}
.form-submit{width:100%;background:var(--terra);color:#fff;border:none;padding:.9rem 2rem;border-radius:2px;font-family:inherit;font-size:.85rem;font-weight:600;letter-spacing:.04em;cursor:pointer;transition:background .2s,transform .2s;margin-top:.5rem;}
.form-submit:hover{background:var(--cocoa);transform:translateY(-1px);}
.form-note{font-size:.7rem;color:var(--muted);text-align:center;margin-top:.75rem;}

.cookie-banner{display:none;position:fixed;bottom:0;left:0;right:0;z-index:998;background:var(--charcoal);padding:1rem 5%;font-size:.78rem;color:rgba(255,255,255,.85);}
.cookie-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.cookie-inner p{margin:0;line-height:1.6;color:rgba(255,255,255,.85);font-size:.78rem;}
.cookie-inner a{color:#6bb3ae;text-decoration:underline;}
.cookie-actions{display:flex;gap:.5rem;}
.cookie-accept{background:#6bb3ae;color:#1a1a1a;border:none;padding:.45rem 1rem;border-radius:2px;font-size:.72rem;font-weight:600;cursor:pointer;font-family:inherit;}
.cookie-decline{background:transparent;color:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.35);padding:.45rem 1rem;border-radius:2px;font-size:.72rem;cursor:pointer;font-family:inherit;}

/* ---------- responsive ---------- */
@media(max-width:1024px){
  .pf-grid{grid-template-columns:repeat(2,1fr);}
  .proj-hero{grid-template-columns:1fr;gap:2rem;}
  .proj-story{grid-template-columns:1fr;}
}
@media(max-width:960px){
  .nav-links{display:none;}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:68px;left:0;right:0;background:var(--sand);padding:1.5rem 5%;gap:1.25rem;box-shadow:0 8px 24px rgba(0,0,0,.12);align-items:flex-start;}
  .hamburger{display:flex;align-items:center;justify-content:center;height:48px;padding:0;}
  nav{padding:.75rem 5%;}
  .nav-logo img{height:48px;}
  .hamburger span{width:24px;height:2px;}
  .pf-head{padding:6.5rem 5% 2rem;}
  .crumbs{padding:5.5rem 5% 0;}
  .pcard-arrow{opacity:1;background:rgba(248,245,235,.85);}
  .pcard-swipe-hint{display:block;}
  .pf-grid.is-list .pcard{grid-template-columns:1fr;gap:1rem;}
  .proj-shots{grid-template-columns:1fr;}
  .cta-grid{grid-template-columns:1fr;}
  footer{grid-template-columns:1fr;text-align:center;}
  .footer-right{text-align:center;align-items:center;}
  .proj-nav{flex-direction:column;align-items:flex-start;}
  .proj-nav-link{max-width:100%;}
  .proj-nav-next{text-align:left;}
}
@media(max-width:600px){
  .pf-grid{grid-template-columns:1fr;gap:2.5rem;}
  .pf-bar-inner{flex-wrap:wrap;gap:.75rem;}
  .pf-count{order:3;width:100%;margin-right:0;}
  .pf-filters{gap:1.5rem;}
  .fclear{margin-left:0;}
  .proj-facts{grid-template-columns:1fr;}
  .email-modal{padding:2rem 1.5rem;}
  .form-row{grid-template-columns:1fr;}
  .btn-primary{width:100%;min-width:0;}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;}
  .pcard-track{transition:none;}
}

/* ============================================================
   Before / after slider
   ============================================================ */
.tag-ba{background:var(--mustard);color:#fff;}
.ba{padding:4rem 5% 1rem;max-width:1100px;margin:0 auto;}
.ba-h{font-size:clamp(1.4rem,2.4vw,2rem);font-weight:700;line-height:1.2;margin-bottom:1.5rem;color:var(--charcoal);}
.ba-frame{position:relative;overflow:hidden;border-radius:3px;background:#e9e3d5;aspect-ratio:4/3;--pos:50%;touch-action:pan-y;user-select:none;}
.ba-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ba-before-wrap{position:absolute;inset:0;width:var(--pos);overflow:hidden;}
.ba-before-wrap img{width:100vw;max-width:none;}
.ba-frame::after{content:'';position:absolute;top:0;bottom:0;left:var(--pos);width:2px;background:var(--sand);transform:translateX(-1px);pointer-events:none;z-index:2;}
.ba-handle{position:absolute;top:50%;left:var(--pos);transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:var(--sand);box-shadow:0 2px 12px rgba(0,0,0,.25);z-index:3;pointer-events:none;display:flex;align-items:center;justify-content:center;}
.ba-handle i{width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:7px solid var(--terra);margin-right:3px;}
.ba-handle::after{content:'';width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid var(--terra);margin-left:3px;}
.ba-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:4;-webkit-appearance:none;appearance:none;background:none;}
.ba-range::-webkit-slider-thumb{-webkit-appearance:none;width:44px;height:100%;cursor:ew-resize;}
.ba-range::-moz-range-thumb{width:44px;height:100%;border:none;cursor:ew-resize;}
.ba-range:focus-visible+.ba-handle,.ba-range:focus-visible~.ba-handle{outline:2px solid var(--terra);outline-offset:3px;}
.ba-tag{position:absolute;top:.85rem;z-index:2;font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:.35rem .6rem;border-radius:2px;pointer-events:none;transition:opacity .2s;}
.ba-tag-b{left:.85rem;background:var(--cocoa);color:#fff;}
.ba-tag-a{right:.85rem;background:var(--teal);color:#fff;}
.ba-note{font-size:.7rem;font-weight:600;letter-spacing:.06em;color:var(--muted);margin-top:.85rem;}
@media(max-width:600px){
  .ba{padding:2.5rem 5% 1rem;}
  .ba-frame{aspect-ratio:1/1;}
  .ba-handle{width:38px;height:38px;}
}

/* ============================================================
   Project plans · Species guide · Related
   ============================================================ */
.sec-h{font-size:clamp(1.4rem,2.4vw,2rem);font-weight:700;line-height:1.2;color:var(--charcoal);margin-bottom:1.75rem;}

.plans{padding:4rem 5% 1rem;max-width:1100px;margin:0 auto;}
.plans-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;}
.plan{background:#fff;border:1px solid var(--line);border-radius:3px;overflow:hidden;}
.plan img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#fff;padding:1rem;}
.plan figcaption{font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:.9rem 1rem;border-top:1px solid var(--line);}

.species{padding:4rem 5% 1rem;max-width:1100px;margin:0 auto;}
.species-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden;}

/* ============================================================
   Species card — wide photo banner, text block on the left
   ============================================================ */
.species-list:has(.sp-figure){
  display:block;
  background:transparent;
  border:none;
}
.sp:has(.sp-figure){
  display:grid;
  height:240px;
  grid-template-columns:200px 1fr;   /* narrow text | long wide photo */
  max-height:240px;                  /* short strip, photo stretches long */
  align-items:stretch;
  background:var(--sand);
  border:1px solid var(--line);
  border-radius:3px;
  overflow:hidden;
}
.sp:has(.sp-figure) .sp-textwrap{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:.55rem;
  padding:1.75rem;
  position:relative;
  overflow:hidden;
}
.sp:has(.sp-figure) .sp-textwrap::after{
  content:'';
  position:absolute;
  left:-14px;
  bottom:-18px;
  width:120px;height:120px;
  background:url('assets/Living-Spaces-Gardening-Mark-Terracota-2.png') no-repeat center/contain;
  opacity:.06;
  pointer-events:none;
}
.sp:has(.sp-figure) .sp-textwrap > *{position:relative;z-index:1;}
.sp:has(.sp-figure) .sp-common{font-size:1.05rem;font-weight:700;color:var(--charcoal);margin:0;}
.sp:has(.sp-figure) .sp-latin{font-size:.8rem;font-style:italic;color:var(--teal);margin:0;}
.sp:has(.sp-figure) .sp-role{font-size:.82rem;color:var(--muted);line-height:1.6;margin:0;}
.sp:has(.sp-figure) .sp-figure{
  margin:0;
  position:relative;
  overflow:hidden;
  min-height:200px;
}
.sp:has(.sp-figure) .sp-figure img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transform:scale(1.35);           /* zoom into the lush middle, crop the blurry edges */
  display:block;
}
.sp-credit{
  position:absolute;bottom:.4rem;right:.5rem;margin:0;
  background:rgba(59,56,54,.6);color:rgba(255,255,255,.85);
  padding:.2rem .45rem;border-radius:2px;font-size:.55rem;
}
@media(max-width:700px){
  .sp:has(.sp-figure){grid-template-columns:1fr;}   /* stack: text over photo */
  .sp:has(.sp-figure) .sp-figure{min-height:220px;}
}