@import url('https://fonts.googleapis.com/css2?family=Old+Standard+TT:ital,wght@0,400;0,700;1,400&family=Cardo:ital,wght@0,400;0,700;1,400&family=Karla:wght@300;400;500;600;700&display=swap');

/* ============================================================
   BELLE HAVEN — ALMANAC STYLESHEET
   Full drop-in replacement for style.css. Reskins the existing
   markup (no HTML changes required) into the app's Almanac
   design language: warm paper, deep ink, one rust accent,
   thin rules, zero shadows. Old Standard TT (display) /
   Cardo (body-serif) / Karla (labels & UI).
   ------------------------------------------------------------
   NOTE: services.php package section is the one page that
   gains a small markup change (per-package <details>
   accordion). Styles for it live under "SERVICES — PACKAGES".
   ============================================================ */

:root{
  --paper:#F5EEDF;
  --paper-deep:#EFE6D2;
  --card:#FEFCF6;
  --ink:#1F1612;
  --ink-med:#5C4A42;
  --ink-soft:#8B776A;
  --ink-faint:#B8A698;          /* hairlines / borders */
  --rust:#8B3A28;               /* single accent */
  --rust-soft:rgba(139,58,40,0.10);
  --cream:#F5EDE0;
  --hero-bg:#1A1016;

  --serif:'Old Standard TT', Georgia, serif;
  --body-serif:'Cardo', Georgia, serif;
  --sans:'Karla', system-ui, -apple-system, sans-serif;

  --r-card:16px;
  --r-pill:100px;
  --r-sm:8px;

  /* warm depth — carried over from the original hub (Lettre de Paris) system.
     Soft, brown-ink based; never a cold grey drop shadow. */
  --shadow-card:0 2px 8px rgba(42,26,22,.07), 0 6px 24px rgba(42,26,22,.06);
  --shadow-lifted:0 4px 16px rgba(42,26,22,.10), 0 12px 34px rgba(42,26,22,.09);
  --shadow-photo:0 6px 22px rgba(42,26,22,.12), 0 14px 40px rgba(42,26,22,.08);

  --maxw:1240px;
}

/* ---------- reset / base ---------- */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;max-width:100%;overflow-x:hidden;}
body{
  font-family:var(--sans);
  font-size:17px;
  line-height:1.7;
  color:var(--ink);
  background-color:var(--paper);
  font-weight:400;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  width:100%;
}
/* kill the old fixed background texture */
body::before{content:none !important;display:none !important;}

::selection{background:var(--rust);color:var(--cream);}

h1,h2,h3,h4,h5,h6{font-family:var(--serif);font-weight:400;line-height:1.14;letter-spacing:0;color:var(--ink);}
h1{font-size:clamp(40px,6vw,64px);margin-bottom:20px;}
h2{font-size:clamp(30px,4.5vw,48px);margin-bottom:18px;}
h3{font-size:clamp(22px,2.6vw,28px);margin-bottom:14px;}
p{font-size:17px;line-height:1.7;color:var(--ink-med);margin-bottom:18px;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
ul{list-style:none;}

/* ---------- layout helpers ---------- */
section{padding:92px 40px;position:relative;max-width:100%;}
.text-center{text-align:center;margin-top:54px;}
.full-width{grid-column:1 / -1;}

/* ============================================================
   NAVIGATION
   ============================================================ */
nav{
  position:fixed;top:0;left:0;right:0;
  background:var(--paper);
  border-bottom:1px solid var(--ink-faint);
  z-index:99000;
  transition:padding .3s ease, background .3s ease;
  isolation:isolate;
}
nav.scrolled{background:var(--paper);border-bottom-color:var(--ink-faint);}
.nav-content{
  max-width:1400px;margin:0 auto;padding:16px 40px;
  display:flex;justify-content:space-between;align-items:center;
  transition:padding .3s ease;position:relative;
}
nav.scrolled .nav-content{padding:12px 40px;}

.logo{position:relative;z-index:10;display:flex;align-items:center;gap:14px;text-decoration:none;}
.logo img{height:54px;transition:height .3s ease;filter:none;}
nav.scrolled .logo img{height:46px;}
.logo-text{
  font-family:var(--serif);font-weight:700;font-size:24px;
  color:var(--ink);letter-spacing:.01em;text-transform:none;line-height:1.05;
}
.logo-text span{
  display:block;font-family:var(--sans);font-size:10px;font-weight:600;
  letter-spacing:.28em;text-transform:uppercase;color:var(--rust);margin-top:6px;
}
nav.scrolled .logo-text{font-size:24px;}
nav.scrolled .logo-text span{font-size:10px;}

.nav-links{display:flex;gap:30px;list-style:none;align-items:center;}
.nav-links a{
  color:var(--ink);font-family:var(--sans);font-size:13px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;position:relative;
  padding-bottom:5px;border-bottom:2px solid transparent;
  transition:color .2s ease,border-color .2s ease;
}
.nav-links a::before{content:none;}
.nav-links a:hover,.nav-links a.active{color:var(--rust);border-bottom-color:var(--rust);}

/* dropdown */
.has-dropdown{position:relative;}
.dropdown{
  position:absolute;top:calc(100% + 12px);left:50%;
  transform:translateX(-50%) translateY(-8px);
  background:var(--card);border:1px solid var(--ink-faint);border-radius:var(--r-sm);
  min-width:280px;padding:8px 0;
  opacity:0;visibility:hidden;transition:opacity .25s ease,transform .25s ease,visibility .25s;
  list-style:none;
}
.has-dropdown:hover .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.dropdown li{position:relative;}
.dropdown a{
  display:block;padding:11px 24px;font-family:var(--sans);font-size:13px;font-weight:500;
  letter-spacing:.04em;text-transform:none;color:var(--ink-med);
  border-bottom:none;transition:background .2s ease,color .2s ease;
}
.dropdown a::before,.dropdown a::after{content:none;}
.dropdown a:hover{background:var(--rust-soft);color:var(--rust);padding-left:28px;}

/* hamburger */
.menu-toggle{display:none;flex-direction:column;cursor:pointer;gap:6px;position:relative;z-index:99002;}
.menu-toggle span{width:26px;height:2px;background-color:var(--ink);transition:transform .3s ease,opacity .3s ease;border-radius:2px;}
.menu-toggle.active span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.menu-toggle.active span:nth-child(2){opacity:0;}
.menu-toggle.active span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

/* ============================================================
   BUTTONS  (ink fill, pill, rust on hover)
   ============================================================ */
.cta-button,.submit-btn,.btn-secondary,.view-details-btn,.survey-submit-btn{
  display:inline-block;padding:15px 34px;font-family:var(--sans);font-size:12.5px;
  font-weight:600;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  border:1px solid var(--ink);background:var(--ink);color:var(--cream);
  border-radius:var(--r-pill);cursor:pointer;position:relative;overflow:hidden;
  transition:background .25s ease,border-color .25s ease,color .25s ease;
}
.cta-button::before,.submit-btn::before,.btn-secondary::before{content:none;}
.cta-button span,.submit-btn span,.btn-secondary span{position:relative;z-index:1;}
.cta-button:hover,.submit-btn:hover,.survey-submit-btn:hover{
  background:var(--rust);border-color:var(--rust);color:var(--cream);transform:none;box-shadow:none;
}
.btn-secondary{background:transparent;color:var(--ink);border:1px solid var(--ink);box-sizing:border-box;}
.btn-secondary:hover{background:var(--ink);color:var(--cream);transform:none;}
.view-details-btn{background:transparent;color:var(--ink);}
.view-details-btn:hover{background:var(--ink);color:var(--cream);}
.cta-button-large{padding:17px 44px;font-size:13px;}

/* ============================================================
   HERO  (dark scrim — Option A)
   ============================================================ */
.hero{
  height:80vh;min-height:560px;position:relative;display:flex;
  align-items:center;justify-content:center;overflow:hidden;isolation:isolate;
  background:var(--hero-bg);
}
.hero::before{
  content:'';position:absolute;inset:0;
  background-image:url('images/photosWebsite/image14.jpeg');
  background-size:cover;background-position:center;background-attachment:scroll;
  filter:brightness(1.12);transform:scale(1.04);z-index:0;
}
.hero-image{display:none !important;}
.hero-overlay{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg, rgba(26,16,22,.45) 0%, rgba(26,16,22,.78) 100%),
    radial-gradient(ellipse 80% 70% at 50% 50%, rgba(26,16,22,.30), rgba(26,16,22,.62));
}
.hero-content{
  position:relative;z-index:2;text-align:center;color:var(--cream);
  max-width:880px;padding:60px 28px 0;width:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.hero-company-name{
  font-family:var(--sans);font-size:clamp(11px,1.6vw,13px);font-weight:600;
  letter-spacing:.28em;text-transform:uppercase;color:#D4A89A;margin-bottom:18px;
  opacity:0;transform:translateY(24px);animation:alFadeUp .9s ease .1s forwards;text-shadow:none;
}
.hero-content h1{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(42px,8vw,82px);margin-bottom:22px;letter-spacing:0;line-height:1.08;
  color:var(--cream);text-shadow:none;
  opacity:0;transform:translateY(24px);animation:alFadeUp .9s ease .3s forwards;
}
.hero-content p{
  font-family:var(--body-serif);font-style:italic;font-size:clamp(18px,2.6vw,24px);
  font-weight:400;color:rgba(245,237,224,.92);margin-bottom:36px;letter-spacing:0;
  text-transform:none;text-shadow:none;
  opacity:0;transform:translateY(24px);animation:alFadeUp .9s ease .6s forwards;
}
.hero-buttons{
  display:flex;gap:14px;justify-content:center;flex-wrap:wrap;
  opacity:0;transform:translateY(24px);animation:alFadeUp .9s ease .9s forwards;
}
/* hero buttons invert: light fill on the dark scrim */
.hero-buttons .cta-button{background:var(--cream);border-color:var(--cream);color:var(--ink);box-shadow:none;}
.hero-buttons .cta-button:hover{background:var(--rust);border-color:var(--rust);color:var(--cream);}
.hero-buttons .btn-secondary{background:transparent;border-color:var(--cream);color:var(--cream);box-shadow:none;}
.hero-buttons .btn-secondary:hover{background:var(--cream);color:var(--ink);}

@keyframes alFadeUp{to{opacity:1;transform:translateY(0);}}

/* ============================================================
   PAGE HEADER (inner pages)
   ============================================================ */
.page-header{
  padding:150px 40px 70px;text-align:center;background:var(--paper-deep);
  position:relative;overflow:hidden;border-bottom:1px solid var(--ink-faint);box-shadow:none;
}
.page-header::before{content:none;}
.page-header h1{
  position:relative;display:inline-block;font-style:italic;
  font-size:clamp(40px,6vw,64px);color:var(--ink);
}
.page-header h1::after{
  content:'';position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);
  width:48px;height:1px;background:var(--rust);
}
.page-header p{
  font-family:var(--body-serif);font-style:italic;font-size:20px;font-weight:400;
  color:var(--ink-med);letter-spacing:0;text-transform:none;margin-top:36px;
}

/* ============================================================
   SECTION HEADER / EYEBROW
   ============================================================ */
.section-header{text-align:center;margin-bottom:60px;max-width:820px;margin-left:auto;margin-right:auto;}
.section-subtitle{
  display:inline-block;font-family:var(--sans);font-size:12px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--rust);margin-bottom:14px;position:relative;
}
.section-subtitle::before,.section-subtitle::after{content:none;}
.section-header h2{margin-top:0;}

/* ============================================================
   HOME — SERVICES TEASER
   ============================================================ */
.services-teaser{background:var(--paper);}
.services-teaser::before,.services-teaser::after{content:none;}
.services-grid-teaser{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:var(--maxw);margin:0 auto;
}
.service-card-link{text-decoration:none;display:block;}
.service-card{
  background:var(--card);border:1px solid var(--ink-faint);border-radius:var(--r-card);
  padding:34px 26px;height:100%;transition:border-color .25s ease;position:relative;overflow:hidden;
}
.service-card::before,.service-card::after{content:none;}
.service-card:hover{border-color:var(--rust);transform:none;box-shadow:none;}
.service-card h3{font-size:23px;margin-bottom:12px;color:var(--ink);}
.service-card h3::before{content:"";display:block;width:30px;height:1px;background:var(--rust);margin-bottom:16px;}
.service-card p{font-size:15px;color:var(--ink-med);margin-bottom:20px;}
.learn-more{
  font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--rust);position:relative;
}
.learn-more::after{content:" →";}
.service-card:hover .learn-more{color:var(--rust);}
.coming-soon-text{
  display:inline;font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-soft);
}

/* ============================================================
   HOME — PORTFOLIO TEASER
   ============================================================ */
.portfolio-teaser{background:var(--paper-deep);border-top:1px solid var(--ink-faint);border-bottom:1px solid var(--ink-faint);}
.portfolio-teaser::before{content:none;}
.portfolio-grid-teaser{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:var(--maxw);margin:0 auto;}
.portfolio-item{
  position:relative;overflow:hidden;border-radius:var(--r-card);border:1px solid var(--ink-faint);
  aspect-ratio:4/5;cursor:pointer;
}
.portfolio-item::before,.portfolio-item::after{content:none;}
.portfolio-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;display:block;}
.portfolio-item:hover img{transform:scale(1.04);}
.portfolio-overlay{
  position:absolute;inset:0;display:flex;align-items:flex-end;
  background:linear-gradient(0deg, rgba(26,16,18,.62), transparent 55%);
}
.portfolio-overlay h3{
  color:var(--cream);font-family:var(--serif);font-size:22px;font-weight:400;
  padding:22px 24px;margin:0;width:100%;
}
.portfolio-overlay h3 sup{font-size:.6em;}
.portfolio-overlay h3::after{content:none;}

/* ============================================================
   HOME — WHY TEASER  (+ Why-Us page grid)
   ============================================================ */
.why-teaser{background:var(--paper);}
.why-grid-teaser,.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:var(--maxw);margin:0 auto;}
.why-card{
  background:var(--card);border:1px solid var(--ink-faint);border-radius:var(--r-card);
  padding:34px 30px;transition:border-color .25s ease;
}
.why-card::before{content:none;}
.why-card:hover{border-color:var(--rust);transform:none;box-shadow:none;}
.why-card h3{font-size:23px;margin-bottom:12px;color:var(--ink);}
.why-card h3::after{content:"";display:block;width:30px;height:1px;background:var(--rust);margin:0 0 16px;order:-1;}
.why-card h3{display:flex;flex-direction:column;}
.why-card p{font-size:15px;color:var(--ink-med);}

/* ============================================================
   CTA SECTION
   ============================================================ */
.cta-section{background:var(--paper-deep);border-top:1px solid var(--ink-faint);text-align:center;padding:84px 24px;position:relative;overflow:hidden;}
.cta-section::before,.cta-section::after{content:none;}
.cta-content{position:relative;z-index:2;max-width:760px;margin:0 auto;}
.cta-section h2{font-family:var(--serif);font-style:italic;font-size:clamp(30px,5vw,48px);color:var(--ink);margin-bottom:14px;}
.cta-section p{font-family:var(--body-serif);font-style:italic;font-size:21px;color:var(--ink-med);letter-spacing:0;text-transform:none;margin-bottom:32px;}
.cta-section .cta-button-large{display:inline-block;}
.cta-section .cta-button-large:hover{transform:none;}

/* ============================================================
   ABOUT PAGE
   ============================================================ */
.about-page{max-width:var(--maxw);margin:0 auto;padding:80px 40px;}
.about-content{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-bottom:90px;}
.about-image img{width:100%;border-radius:var(--r-card);border:1px solid var(--ink-faint);}
.about-image:hover img{transform:none;}
.about-text h2{font-size:clamp(28px,4vw,42px);margin-bottom:18px;}
.about-text p{font-family:var(--body-serif);font-size:17px;color:var(--ink-med);line-height:1.75;margin-bottom:16px;}
.about-text .cta-button{margin-top:14px;}

.vision-section{background:var(--paper-deep);border:1px solid var(--ink-faint);border-radius:var(--r-card);padding:60px 50px;margin-bottom:90px;}
.vision-content{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.vision-text h2{font-size:clamp(26px,3.5vw,38px);margin-bottom:16px;}
.vision-text p{font-family:var(--body-serif);font-size:17px;color:var(--ink-med);line-height:1.75;margin-bottom:14px;}
.vision-image{position:relative;text-align:center;}
.vision-image::before{content:none;}
.vision-image img:not(.vision-stamp){width:100%;border-radius:var(--r-card);border:1px solid var(--ink-faint);}
.vision-image:hover img{transform:none;}
.vision-stamp{
  position:absolute;top:14px;right:14px;width:84px;height:auto;opacity:.9;mix-blend-mode:multiply;
}
.vision-caption{font-family:var(--body-serif);font-style:italic;font-size:14px;color:var(--ink-soft);margin-top:14px;}

.founders-section{text-align:center;}
.founders-section h2{font-size:clamp(28px,4vw,42px);margin-bottom:40px;}
.founders-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:840px;margin:0 auto;}
.founder-card{
  background:var(--card);border:1px solid var(--ink-faint);border-radius:var(--r-card);
  padding:38px 32px;text-align:center;transition:border-color .25s ease;
}
.founder-card::before{content:none;}
.founder-card:hover{border-color:var(--rust);transform:none;box-shadow:none;}
.founder-card h3{font-size:26px;margin-bottom:6px;}
.founder-card p:first-of-type{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--rust);margin-bottom:16px;}
.founder-card p{font-family:var(--body-serif);font-size:16px;color:var(--ink-med);line-height:1.7;}

/* ============================================================
   SERVICES PAGE — detail rows
   ============================================================ */
.services-page{max-width:var(--maxw);margin:0 auto;padding:70px 40px;}
.service-detail{padding:50px 0;border-bottom:1px solid var(--ink-faint);}
.service-detail:last-child{border-bottom:none;}
.service-content{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;}
.service-detail.alt .service-content{direction:rtl;}
.service-detail.alt .service-content > *{direction:ltr;}
.service-image img{width:100%;border-radius:var(--r-card);border:1px solid var(--ink-faint);}
.service-image:hover img{transform:none;}
.service-text h2{font-size:clamp(28px,4vw,40px);margin-bottom:16px;}
.service-text h3{font-size:13px;}
.service-text p{font-family:var(--body-serif);font-size:16px;color:var(--ink-med);line-height:1.7;margin-bottom:14px;}
.service-text ul,.service-features{margin:20px 0 26px;}
.service-text li{position:relative;padding-left:24px;margin-bottom:10px;font-family:var(--sans);font-size:15.5px;color:var(--ink-med);list-style:none;}
.service-text li::before{content:"";position:absolute;left:0;top:13px;width:12px;height:1px;background:var(--rust);}
.service-text .cta-button{margin-top:8px;}

/* SERVICES — pricing table */
.pricing-section{margin:26px 0;}
.pricing-section h3{
  font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--rust);margin-bottom:8px;border-top:1px solid var(--ink-faint);padding-top:22px;
}
.pricing-table{width:100%;border-collapse:collapse;margin:8px 0 14px;}
.pricing-table tr{border-bottom:1px solid var(--ink-faint);}
.pricing-table td{padding:13px 0;font-family:var(--sans);font-size:16px;color:var(--ink);}
.pricing-table td:first-child{font-weight:500;}
.pricing-table td:last-child{text-align:right;font-family:var(--serif);font-size:23px;color:var(--ink);}
.pricing-note{font-family:var(--body-serif);font-style:italic;font-size:14px;color:var(--ink-soft);margin:10px 0 22px;}
.pricing-image{width:100%;max-width:520px;border:1px solid var(--ink-faint);border-radius:var(--r-card);margin:8px 0 6px;}

/* SERVICES — PACKAGES (Option B: <details> accordion)
   New markup: <details class="package-card">
                 <summary class="package-header">
                   <span class="package-name">…</span>
                   <span class="package-price">$…</span>
                 </summary>
                 <p class="package-description">…</p>
                 <p class="package-features-title">What's Included</p>
                 <div class="package-features"><div class="package-feature">…</div>…</div>
               </details>
   The old #packageDetails toggle button/wrapper is removed.   */
.package-details-section{margin-top:18px;}
.package-card{
  background:var(--card);border:1px solid var(--ink-faint);border-radius:var(--r-card);
  margin-bottom:14px;overflow:hidden;
}
.package-card > summary.package-header{
  list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:16px;
  padding:22px 26px;margin:0;border-bottom:1px solid transparent;transition:background .2s ease;
}
.package-card > summary.package-header::-webkit-details-marker{display:none;}
.package-card > summary.package-header::after{
  content:"⌄";font-family:var(--sans);color:var(--ink-soft);font-size:16px;
  margin-left:auto;transition:transform .25s ease,color .25s ease;line-height:1;
}
.package-card[open] > summary.package-header::after{transform:rotate(180deg);color:var(--rust);}
.package-card > summary.package-header:hover{background:var(--rust-soft);}
.package-card[open] > summary.package-header{border-bottom-color:var(--ink-faint);}
.package-name{font-family:var(--serif);font-size:22px;color:var(--ink);}
.package-price{font-family:var(--serif);font-size:22px;color:var(--ink);margin-left:auto;}
.package-card[open] .package-price{margin-left:0;}
.package-description{font-family:var(--body-serif);font-size:16px;color:var(--ink-med);line-height:1.65;padding:20px 26px 0;margin:0;}
.package-features-title{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-soft);padding:18px 26px 0;margin:0;
}
.package-features{display:grid;grid-template-columns:1fr 1fr;gap:8px 22px;padding:12px 26px 26px;}
.package-feature{position:relative;padding-left:20px;font-family:var(--sans);font-size:14.5px;color:var(--ink-med);}
.package-feature::before{content:"";position:absolute;left:0;top:11px;width:10px;height:1px;background:var(--rust);}
.addons-card .package-features-title{color:var(--rust);}

/* coming-soon "picnics" stamp */
.picnics-section{position:relative;}
.stamp-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;}
.rubber-stamp{
  font-family:var(--serif);font-style:italic;font-size:clamp(28px,5vw,52px);color:var(--rust);
  border:2px solid var(--rust);border-radius:var(--r-sm);padding:10px 28px;transform:rotate(-8deg);opacity:.85;
}

/* ============================================================
   PORTFOLIO PAGE — filters, grid, lightbox
   ============================================================ */
.portfolio-page{max-width:var(--maxw);margin:0 auto;padding:70px 40px;}
.portfolio-filters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:44px;}
.filter-btn{
  font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:10px 20px;border:1px solid var(--ink-faint);border-radius:var(--r-sm);
  background:transparent;color:var(--ink-med);cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.filter-btn::before{content:none;}
.filter-btn:hover{border-color:var(--ink);color:var(--ink);}
.filter-btn.active{background:var(--ink);color:var(--cream);border-color:var(--ink);}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.portfolio-page .portfolio-item{aspect-ratio:4/5;}
.portfolio-item.hidden{display:none;}

.lightbox{
  position:fixed;inset:0;background:rgba(26,16,18,.92);z-index:99999;
  display:none;align-items:center;justify-content:center;padding:40px;
}
.lightbox.active{display:flex;}
.lightbox-content{max-width:90vw;max-height:88vh;border:1px solid rgba(245,237,224,.2);border-radius:var(--r-sm);}
.lightbox-close{
  position:absolute;top:24px;right:32px;font-size:38px;line-height:1;color:var(--cream);
  cursor:pointer;font-family:var(--serif);transition:color .2s ease;
}
.lightbox-close:hover{color:#D4A89A;}

/* ============================================================
   WHY-US PAGE
   ============================================================ */
.why-us-content{max-width:var(--maxw);margin:0 auto;padding:70px 40px;}
.why-intro{text-align:center;max-width:760px;margin:0 auto 56px;}
.why-intro h2{margin-bottom:16px;}
.why-intro p{font-family:var(--body-serif);font-style:italic;font-size:20px;color:var(--ink-med);}

.testimonials-section{background:var(--paper-deep);border-top:1px solid var(--ink-faint);padding:90px 40px;}
.testimonials-section h2{text-align:center;}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:var(--maxw);margin:0 auto;}
.testimonial-card{
  background:var(--card);border:1px solid var(--ink-faint);border-left:3px solid var(--rust);
  border-radius:var(--r-card);padding:36px 32px;transition:border-color .25s ease;
}
.testimonial-card:hover{transform:none;box-shadow:none;}
.testimonial-card p{font-family:var(--body-serif);font-style:italic;font-size:17px;line-height:1.7;color:var(--ink);margin-bottom:18px;}
.testimonial-author{font-family:var(--serif);font-size:18px;color:var(--ink);}

/* ============================================================
   CONTACT PAGE  (+ overrides for inline survey styles)
   ============================================================ */
.contact-page{max-width:var(--maxw);margin:0 auto;padding:150px 40px 80px;}
.contact-content{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start;}
.contact-info-card{
  background:var(--paper-deep);border:1px solid var(--ink-faint);border-radius:var(--r-card);padding:40px 36px;
}
.contact-info-card h2{font-size:clamp(26px,3.4vw,34px);margin-bottom:24px;}
.contact-info-card .contact-item{margin-bottom:24px;}
.contact-info-card .contact-item:last-child{margin-bottom:0;}
.contact-info-card .contact-item h4{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--rust);margin-bottom:10px;}
.contact-info-card .contact-item p{font-family:var(--body-serif);font-size:16px;color:var(--ink-med);margin:0;}
.contact-info-card .contact-item a{color:var(--ink);}
.contact-social{display:flex;gap:14px;align-items:center;}
.contact-social a{display:inline-flex;}
.contact-social img{width:24px;height:24px;object-fit:contain;}

.contact-form-container{background:var(--card);border:1px solid var(--ink-faint);border-radius:var(--r-card);padding:42px 38px;}
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.form-group{margin-bottom:0;}
.form-group.full-width{grid-column:1 / -1;}
.form-group label{
  display:block;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px;
}
.form-group input,.form-group select,.form-group textarea{
  width:100%;padding:13px 16px;border:1px solid var(--ink-faint);border-radius:var(--r-sm);
  background:var(--paper);font-family:var(--sans);font-size:16px;color:var(--ink);
  transition:border-color .2s ease,box-shadow .2s ease;box-sizing:border-box;
}
.form-group input::placeholder,.form-group textarea::placeholder{font-family:var(--body-serif);font-style:italic;color:var(--ink-soft);}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--rust);box-shadow:0 0 0 3px var(--rust-soft);}
.form-group textarea{min-height:140px;resize:vertical;}
.contact-form .cta-button{width:100%;}

/* success panel */
.form-success-message{
  display:none;text-align:center;background:var(--paper-deep);border:1px solid var(--ink-faint);
  border-radius:var(--r-card);padding:46px 38px;
}
.form-success-message .success-icon{
  width:58px;height:58px;border:1px solid var(--rust);background:transparent;color:var(--rust);
  font-size:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 22px;
}
.form-success-message h3{font-family:var(--serif);font-style:italic;font-size:30px;color:var(--ink);margin-bottom:10px;}
.form-success-message p{font-family:var(--body-serif);font-style:italic;font-size:17px;color:var(--ink-med);line-height:1.7;}
.form-success-message .cta-button{margin-top:18px;}

/* survey — override inline contact.php block via specificity */
.contact-page .survey-section{margin-top:28px;padding-top:28px;border-top:1px solid var(--ink-faint);}
.contact-page .survey-section h4{font-family:var(--serif);font-size:22px;color:var(--ink);margin-bottom:6px;font-weight:400;}
.contact-page .survey-section .survey-subtitle{font-family:var(--body-serif);font-style:italic;font-size:15px;color:var(--ink-soft);margin-bottom:18px;}
.contact-page .survey-options{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px;justify-content:center;}
.contact-page .survey-option label{
  display:inline-block;padding:10px 18px;background:transparent;border:1px solid var(--ink-faint);
  border-radius:var(--r-sm);cursor:pointer;font-family:var(--sans);font-size:12.5px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-med);transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.contact-page .survey-option label:hover{border-color:var(--ink);color:var(--ink);background:transparent;}
.contact-page .survey-option input[type="radio"]:checked + label{background:var(--ink);color:var(--cream);border-color:var(--ink);}
.contact-page .survey-other-input{
  width:100%;padding:13px 16px;border:1px solid var(--ink-faint);border-radius:var(--r-sm);
  font-family:var(--sans);font-size:15px;background:var(--paper);color:var(--ink);margin:8px 0 16px;
}
.contact-page .survey-other-input:focus{outline:none;border-color:var(--rust);box-shadow:0 0 0 3px var(--rust-soft);}
.contact-page .survey-submit-btn{background:var(--ink);color:var(--cream);border:1px solid var(--ink);border-radius:var(--r-pill);padding:13px 30px;font-family:var(--sans);font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:12.5px;}
.contact-page .survey-submit-btn:hover{background:var(--rust);border-color:var(--rust);transform:none;box-shadow:none;}
.contact-page .survey-skip{display:block;text-align:center;margin-top:14px;font-family:var(--body-serif);font-style:italic;font-size:14px;color:var(--ink-soft);text-decoration:none;}
.contact-page .survey-skip:hover{color:var(--rust);}
.contact-page .survey-thanks p{color:var(--ink-med);}

/* ============================================================
   REVIEWS PAGE  (override inline reviews.php block via specificity)
   ============================================================ */
.reviews-page{max-width:var(--maxw);margin:0 auto;padding:0 40px;}
.reviews-intro{text-align:center;max-width:780px;margin:0 auto 60px;}
.reviews-intro p{font-family:var(--body-serif);font-style:italic;font-size:19px;line-height:1.7;color:var(--ink-med);}

.reviews-page .reviews-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:24px;margin-bottom:90px;}
.reviews-page .review-card{
  background:var(--card);border:1px solid var(--ink-faint);border-left:3px solid var(--rust);
  border-radius:var(--r-card);padding:36px 32px;box-shadow:none;transition:border-color .25s ease;
}
.reviews-page .review-card:hover{transform:none;box-shadow:none;}
.reviews-page .review-card .review-text{font-family:var(--body-serif);font-style:italic;font-size:18px;line-height:1.7;color:var(--ink);margin-bottom:22px;}
.reviews-page .review-card .review-text::before,
.reviews-page .review-card .review-text::after{content:none;}
.reviews-page .review-meta{border-top:1px solid var(--ink-faint);padding-top:16px;display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;}
.reviews-page .review-author{font-family:var(--serif);font-size:20px;font-weight:400;color:var(--ink);margin:0;}
.reviews-page .review-divider{color:var(--ink-faint);}
.reviews-page .review-event{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--rust);margin:0;}
.reviews-page .review-date{font-family:var(--sans);font-size:13px;color:var(--ink-soft);margin:0 0 0 auto;}

.reviews-page .no-reviews{text-align:center;padding:60px 40px;background:var(--paper-deep);border:1px dashed var(--ink-faint);border-radius:var(--r-card);margin-bottom:80px;}
.reviews-page .no-reviews p{font-family:var(--body-serif);font-style:italic;font-size:18px;color:var(--ink-soft);margin:0;}

.reviews-page .review-form-section{
  background:var(--paper-deep);border-top:1px solid var(--ink-faint);border-bottom:1px solid var(--ink-faint);
  padding:80px 40px;margin:0 -40px;
}
.reviews-page .review-form-container{max-width:680px;margin:0 auto;}
.reviews-page .review-form-header{text-align:center;margin-bottom:46px;}
.reviews-page .review-form-header h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(30px,5vw,44px);margin-bottom:12px;}
.reviews-page .review-form-header p{font-family:var(--body-serif);font-style:italic;font-size:18px;color:var(--ink-med);}
.reviews-page .review-form{background:var(--card);border:1px solid var(--ink-faint);border-radius:var(--r-card);padding:46px 40px;box-shadow:none;}
.reviews-page .review-form .form-group{margin-bottom:22px;display:block;}
.reviews-page .review-form label{display:block;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px;}
.reviews-page .review-form input,
.reviews-page .review-form select,
.reviews-page .review-form textarea{
  width:100%;padding:13px 16px;border:1px solid var(--ink-faint);border-radius:var(--r-sm);
  font-family:var(--sans);font-size:16px;background:var(--paper);color:var(--ink);box-sizing:border-box;
}
.reviews-page .review-form input::placeholder,
.reviews-page .review-form textarea::placeholder{font-family:var(--body-serif);font-style:italic;color:var(--ink-soft);}
.reviews-page .review-form input:focus,
.reviews-page .review-form select:focus,
.reviews-page .review-form textarea:focus{outline:none;border-color:var(--rust);box-shadow:0 0 0 3px var(--rust-soft);}
.reviews-page .review-form textarea{min-height:160px;resize:vertical;}
.reviews-page .review-form .submit-btn{width:100%;margin-top:16px;}
.reviews-page .form-note{text-align:center;margin-top:18px;font-family:var(--body-serif);font-style:italic;font-size:14px;color:var(--ink-soft);}

.reviews-page .review-success-message{display:none;text-align:center;padding:56px 40px;background:var(--paper-deep);border:1px solid var(--ink-faint);border-radius:var(--r-card);}
.reviews-page .review-success-message .success-icon{width:58px;height:58px;border:1px solid var(--rust);background:transparent;color:var(--rust);font-size:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;}
.reviews-page .review-success-message h3{font-family:var(--serif);font-style:italic;font-size:30px;color:var(--ink);margin-bottom:12px;}
.reviews-page .review-success-message p{font-family:var(--body-serif);font-style:italic;font-size:17px;color:var(--ink-med);}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--ink);color:var(--cream);padding:62px 40px 30px;}
.footer-content{max-width:none;margin:0;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;align-items:start;}
.footer-logo img{height:56px;margin-bottom:14px;filter:brightness(0) invert(1);opacity:.92;}
.footer-company-name{font-family:var(--serif);font-weight:700;font-size:22px;display:block;margin-bottom:8px;color:var(--cream);}
.footer-tagline{font-family:var(--body-serif);font-size:14px;color:rgba(245,237,224,.66);max-width:330px;line-height:1.6;}
.footer-links{display:flex;gap:48px;}
.footer-section h4{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#D4A89A;margin-bottom:14px;}
.footer-section p{margin-bottom:8px;}
.footer-section a{font-family:var(--sans);font-size:14px;color:rgba(245,237,224,.85);transition:color .2s ease;}
.footer-section a:hover{color:var(--cream);}
.social-links{display:flex;gap:14px;align-items:center;}
.social-links a{display:inline-flex;}
.social-links a:hover{opacity:.7;}
.social-links img{width:22px;height:22px;object-fit:contain;filter:brightness(0) invert(1);opacity:.85;}
.copyright{max-width:none;margin:42px 0 0;grid-column:1/-1;padding-top:22px;border-top:1px solid rgba(245,237,224,.15);font-family:var(--sans);font-size:12px;letter-spacing:.05em;color:rgba(245,237,224,.55);text-align:center;}

/* ============================================================
   LEGAL PAGES (terms / privacy)
   ============================================================ */
.legal-page{max-width:860px;margin:0 auto;padding:70px 40px;}
.legal-content .last-updated{font-family:var(--body-serif);font-style:italic;font-size:15px;color:var(--ink-soft);margin-bottom:40px;}
.legal-section{margin-bottom:36px;}
.legal-section:last-child{margin-bottom:0;}
.legal-section h2{font-size:clamp(24px,3vw,32px);margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--ink-faint);}
.legal-section h3{font-family:var(--serif);font-size:20px;color:var(--ink);margin:20px 0 10px;}
.legal-section p{font-family:var(--body-serif);font-size:16px;color:var(--ink-med);line-height:1.75;margin-bottom:12px;}
.legal-section ul{margin:0 0 14px;padding:0;}
.legal-section li{position:relative;padding-left:24px;margin-bottom:9px;font-family:var(--body-serif);font-size:16px;color:var(--ink-med);}
.legal-section li::before{content:"";position:absolute;left:0;top:13px;width:12px;height:1px;background:var(--rust);}
.legal-section a{color:var(--rust);border-bottom:1px solid var(--rust-soft);}
.legal-section a:hover{border-bottom-color:var(--rust);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:980px){
  section{padding:64px 24px;}
  .services-grid-teaser{grid-template-columns:1fr 1fr;}
  .portfolio-grid-teaser,.why-grid-teaser,.why-grid,.testimonials-grid{grid-template-columns:1fr 1fr;}
  .about-content,.vision-content,.service-content,.founders-grid{grid-template-columns:1fr;gap:32px;}
  .service-detail.alt .service-content{direction:ltr;}
  .vision-section{padding:40px 28px;}
  .contact-content{grid-template-columns:1fr;gap:28px;}
  .portfolio-grid{grid-template-columns:1fr 1fr;}
  .footer-content{grid-template-columns:1fr;gap:32px;}
  .footer-links{gap:40px;}
  .nav-content{padding:14px 24px;}
}

@media (max-width:768px){
  /* mobile hamburger */
  .menu-toggle{display:flex;}
  .logo{position:relative;z-index:99002;}
  .nav-links{
    position:fixed;top:0;right:0;height:100vh;width:100%;max-width:none;
    flex-direction:column;align-items:flex-start;justify-content:flex-start;
    gap:0;padding:96px 32px 32px;background:var(--paper);border-left:none;
    transform:translateX(100%);transition:transform .3s ease;overflow-y:auto;
  }
  .nav-links.active{transform:translateX(0);}
  .nav-links li{width:100%;border-bottom:1px solid var(--ink-faint);}
  .nav-links a{display:block;width:100%;padding:16px 0;border-bottom:none;font-size:14px;}
  body.menu-open{overflow:hidden;}
  body.menu-open::before{content:'';position:fixed;inset:0;background:rgba(31,22,18,.5);z-index:98000;pointer-events:none;}

  /* mobile dropdown */
  .has-dropdown .dropdown{
    position:static;transform:none;opacity:1;visibility:visible;display:none;
    border:none;background:transparent;min-width:0;padding:0 0 8px;
  }
  .has-dropdown.dropdown-open .dropdown{display:block;}
  /* touch can trigger a sticky :hover; the desktop hover rule (higher specificity)
     re-applies translateX(-50%) and shoves the submenu off-screen. Cancel it here. */
  .has-dropdown:hover .dropdown{transform:none;left:auto;top:auto;position:static;}
  .dropdown a{padding:10px 0 10px 16px;color:var(--ink-soft);}
  .dropdown a:hover{padding-left:20px;background:transparent;}

  .hero{height:auto;min-height:520px;padding:120px 0 80px;}
  .services-grid-teaser{grid-template-columns:1fr;}
  .portfolio-grid-teaser,.why-grid-teaser,.why-grid,.testimonials-grid{grid-template-columns:1fr;}
  .portfolio-grid{grid-template-columns:1fr;}
  .contact-form{grid-template-columns:1fr;}
  .package-features{grid-template-columns:1fr;}
  .page-header{padding:120px 24px 56px;}
  .contact-page{padding:120px 24px 64px;}
  .reviews-page,.review-form-section{padding-left:22px;padding-right:22px;}
  .reviews-page .review-form-section{margin:0 -22px;}
  .review-meta,.reviews-page .review-meta{flex-direction:column;align-items:flex-start;gap:6px;}
  .reviews-page .review-divider{display:none;}
  .reviews-page .review-date{margin-left:0;}
}

@media (max-width:480px){
  .nav-content{padding:12px 18px;}
  .logo img{height:46px;}
  .logo-text{font-size:20px;}
  section{padding:52px 18px;}
  .package-card > summary.package-header{padding:18px 18px;}
  .package-name,.package-price{font-size:20px;}
}

/* ---------- accessibility: reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
  .hero-company-name,.hero-content h1,.hero-content p,.hero-buttons{opacity:1;transform:none;}
}

/* ============================================================
   DIMENSION  (warm depth, Almanac-faithful)
   Raised paper cards on the paper ground; recessed bands stay
   flat. Appended last so it layers cleanly over the base rules.
   ============================================================ */
.service-card,
.why-card,
.founder-card,
.testimonial-card,
.reviews-page .review-card,
.package-card,
.contact-info-card,
.contact-form-container,
.reviews-page .review-form,
.form-success-message,
.reviews-page .review-success-message,
.vision-section{
  box-shadow:var(--shadow-card);
}

/* photos get a touch more depth so they read as printed plates */
.about-image img,
.service-image img,
.vision-image img:not(.vision-stamp),
.portfolio-item{
  box-shadow:var(--shadow-photo);
}

/* interactive cards: gentle warm lift on hover */
.service-card,
.why-card,
.founder-card{
  transition:border-color .25s ease, box-shadow .3s ease, transform .3s ease;
}
.service-card-link:hover .service-card,
.why-card:hover,
.founder-card:hover{
  border-color:var(--rust);
  box-shadow:var(--shadow-lifted);
  transform:translateY(-4px);
}
.portfolio-item{transition:box-shadow .3s ease, transform .3s ease;}
.portfolio-item:hover{box-shadow:var(--shadow-lifted);transform:translateY(-4px);}

/* keep static cards' shadow on hover (override earlier resets) */
.testimonial-card:hover,
.reviews-page .review-card:hover{box-shadow:var(--shadow-card);transform:none;}

/* dark pill buttons gain quiet depth */
.cta-button,
.submit-btn,
.survey-submit-btn{box-shadow:0 3px 12px rgba(42,26,22,.16);}
.cta-button:hover,
.submit-btn:hover,
.survey-submit-btn:hover{box-shadow:0 6px 18px rgba(42,26,22,.22);}
.hero-buttons .cta-button{box-shadow:0 6px 20px rgba(26,16,18,.38);}

/* reduced-motion: keep depth, drop the movement */
@media (prefers-reduced-motion:reduce){
  .service-card-link:hover .service-card,
  .why-card:hover,.founder-card:hover,.portfolio-item:hover{transform:none;}
}

/* ============================================================
   RECESSED BANDS — subtle inset wells that cradle the raised cards.
   Shadow is pinned to the top/bottom inner edges (negative spread)
   so the band's center stays clean paper, reading as "sunk in".
   ============================================================ */
.portfolio-teaser,
.testimonials-section,
.cta-section,
.reviews-page .review-form-section{
  box-shadow:inset 0 12px 22px -12px rgba(42,26,22,.20),
             inset 0 -12px 22px -12px rgba(42,26,22,.16);
}
.page-header{
  box-shadow:inset 0 -12px 22px -14px rgba(42,26,22,.14);
}

/* ============================================================
   HOME REDESIGN 2026 — editorial sections (no cards)
   Numbered chapters, almanac index for services, image-led
   work feature, open-column why-us. Appended last so it layers
   cleanly over the base rules. New class names only — the
   why-us.php page (.why-card / .why-grid) is untouched.
   ============================================================ */

/* section number + divider */
.al-num{font-family:var(--serif);font-weight:400;font-size:clamp(22px,3vw,30px);color:var(--rust);line-height:1;margin:0 0 6px;}
.al-divider{display:flex;align-items:center;justify-content:center;gap:14px;margin:20px auto 0;}
.al-divider .al-rule{display:block;width:56px;height:1px;background:var(--rust);opacity:.5;}
.al-divider .al-diamond{color:var(--rust);font-size:10px;line-height:1;transform:rotate(45deg);}
.al-textlink{display:inline-block;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--rust);transition:color .2s ease;}
.al-textlink:hover{color:var(--ink);}

/* SERVICES — almanac index (replaces the card grid) */
.svc-index{max-width:var(--maxw);margin:0 auto;}
.svc-row{display:grid;grid-template-columns:auto 1fr auto;gap:26px;align-items:baseline;padding:26px 8px;border-top:1px solid var(--ink-faint);text-align:left;transition:padding-left .25s ease;}
.svc-row:last-child{border-bottom:1px solid var(--ink-faint);}
.svc-row:hover{padding-left:20px;}
.svc-rownum{font-family:var(--serif);font-size:20px;line-height:1.2;color:var(--rust);}
.svc-rowbody{min-width:0;}
.svc-rowtitle{display:block;font-family:var(--serif);font-size:clamp(22px,2.6vw,28px);line-height:1.12;color:var(--ink);transition:color .2s ease;}
.svc-rowdesc{display:block;font-family:var(--body-serif);font-size:15.5px;line-height:1.6;color:var(--ink-med);margin-top:7px;max-width:560px;}
.svc-rowlink{align-self:center;white-space:nowrap;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--rust);}
.svc-row:hover .svc-rowtitle{color:var(--rust);}

/* PORTFOLIO — image-led work feature (replaces the 3-up grid) */
.work-feature{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;}
.work-lead img{width:100%;border:1px solid var(--ink-faint);border-radius:var(--r-card);box-shadow:var(--shadow-photo);}
.work-lead-caption{font-family:var(--body-serif);font-style:italic;font-size:14px;color:var(--ink-soft);margin:12px 0 0;}
.work-text .section-subtitle{margin-bottom:6px;}
.work-text h2{margin-top:0;}
.work-lede{font-family:var(--body-serif);font-size:16px;line-height:1.7;color:var(--ink-med);margin:0 0 26px;}
.work-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:24px;}
.work-thumb{display:block;}
.work-thumb img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--ink-faint);border-radius:var(--r-sm);transition:transform .4s ease;}
.work-thumb:hover img{transform:scale(1.04);}
.work-thumb span{display:block;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--rust);margin-top:9px;}

/* WHY US — open editorial columns (replaces the card grid) */
.why-teaser{position:relative;overflow:hidden;}
.al-bigword{position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);font-family:var(--serif);font-size:clamp(120px,22vw,260px);line-height:1;letter-spacing:-.03em;white-space:nowrap;color:var(--ink);opacity:.04;pointer-events:none;z-index:0;}
.why-teaser .section-header,.why-teaser .why-columns,.why-teaser .text-center{position:relative;z-index:1;}
.why-columns{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);}
.why-col{padding:6px 30px;text-align:left;}
.why-col + .why-col{border-left:1px solid var(--ink-faint);}
.why-col-rule{display:block;width:30px;height:1px;background:var(--rust);margin:0 0 16px;}
.why-col h3{font-size:23px;margin:0 0 12px;color:var(--ink);}
.why-col p{font-family:var(--body-serif);font-size:15.5px;line-height:1.7;color:var(--ink-med);margin:0;}

/* responsive for the new editorial sections */
@media (max-width:980px){
  .work-feature{grid-template-columns:1fr;gap:30px;}
  .why-columns{grid-template-columns:1fr;}
  .why-col{padding:24px 0;}
  .why-col + .why-col{border-left:none;border-top:1px solid var(--ink-faint);}
}
@media (max-width:600px){
  .svc-row{grid-template-columns:auto 1fr;gap:12px 16px;}
  .svc-rowlink{grid-column:2;justify-self:start;align-self:auto;margin-top:6px;}
}


/* CTA band sits directly above the dark footer, so its lower inset recess
   (a dark shadow) gets visually swallowed by the dark footer below and only
   the top edge reads as recessed. Strengthen the bottom inset on .cta-section
   so the lower edge reads as shadowed, matching the top. Appended last to win
   over the shared RECESSED BANDS rule by source order. */
.cta-section{
  box-shadow:inset 0 12px 22px -12px rgba(42,26,22,.20),
             inset 0 -16px 26px -12px rgba(42,26,22,.34);
}