/* ===========================================================================
   Rigg Saunas — shared design system
   Architectural-studio identity. Restraint is the aesthetic.
   Palette: forest green + warm paper, one cedar accent. No shadows, no
   rounded corners, no gradients. Fraunces (display) + Montserrat (structural).
   Serif wordmark (Cormorant SC) kept as the logo.
   =========================================================================== */

:root{
  --forest:#22402E;
  --forest-deep:#16281D;
  --paper:#F4F1EA;
  --ink:#1A1A17;
  --cedar:#B5794A;
  --fog:#D8D4CA;
  --mist:#EAE7DE;
  --display:'Fraunces',Georgia,serif;
  --sans:'Montserrat',-apple-system,'Segoe UI',sans-serif;
  --word:'Cinzel',Georgia,serif;
  --mx:clamp(24px,6vw,90px);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:clamp(1.0625rem,.4vw + .95rem,1.125rem);
  font-weight:400;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}

/* layout ------------------------------------------------------------------ */
.wrap{width:100%;max-width:1440px;margin:0 auto;padding-left:var(--mx);padding-right:var(--mx)}
.g12{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(16px,2vw,34px)}
section{padding:clamp(72px,11vw,150px) 0}
.hair{border:0;border-top:1px solid var(--fog)}

/* type -------------------------------------------------------------------- */
.display{font-family:var(--display);font-weight:300;line-height:1.02;letter-spacing:-.01em;font-optical-sizing:auto}
.eyebrow{font-family:var(--sans);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.18em;color:var(--cedar)}
.eyebrow .dash{color:var(--ink);opacity:.4}
.body{max-width:62ch}
.muted{color:var(--ink);opacity:.66}

/* header ------------------------------------------------------------------ */
header{position:sticky;top:0;z-index:60;background:rgba(244,241,234,.86);backdrop-filter:saturate(1.3) blur(8px);border-bottom:1px solid var(--fog)}
.nav{display:flex;align-items:center;justify-content:space-between;height:74px}
.word{font-family:var(--word);color:var(--forest);font-weight:500;font-variant-caps:small-caps;font-size:1.45rem;line-height:1;letter-spacing:.06em}
.nav-links{display:flex;gap:clamp(20px,2.6vw,44px);align-items:center}
.nav-links a{font-family:var(--sans);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--ink);padding:4px 0;border-bottom:1px solid transparent;transition:border-color .2s}
.nav-links a:hover,.nav-links a.active{border-bottom-color:var(--cedar)}
.menu-btn{display:none;background:none;border:0;font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);cursor:pointer}

/* links + buttons --------------------------------------------------------- */
.tlink{font-family:var(--sans);font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--ink);border-bottom:1px solid var(--cedar);padding-bottom:3px;display:inline-block;transition:color .2s}
.tlink:hover{color:var(--cedar)}
.btn{font-family:var(--sans);font-size:.76rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--ink);border:1px solid var(--ink);padding:14px 26px;display:inline-block;background:none;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.btn:hover{background:var(--forest);border-color:var(--forest);color:var(--paper)}

/* HERO — split, image-led (homepage) -------------------------------------- */
.hero{display:grid;grid-template-columns:1fr 1fr;min-height:clamp(560px,82vh,880px)}
.hero-text{display:flex;flex-direction:column;justify-content:center;padding:clamp(48px,7vw,96px) clamp(32px,4vw,72px) clamp(48px,7vw,96px) var(--mx)}
.hero-text .eyebrow{margin-bottom:26px}
.hero-text h1{font-size:clamp(3.2rem,7vw,6.5rem);margin-bottom:30px;max-width:11ch}
.hero-text .body{margin-bottom:38px;max-width:44ch}
.hero-media{position:relative;overflow:hidden;background:var(--mist)}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center}

/* PAGE HERO — statement-first (inner pages) ------------------------------- */
.page-hero{padding:clamp(72px,10vw,150px) 0 clamp(36px,5vw,72px)}
.page-hero .eyebrow{margin-bottom:24px}
.page-hero h1{font-family:var(--display);font-weight:300;line-height:1.03;letter-spacing:-.01em;font-size:clamp(2.8rem,6vw,5.4rem);max-width:15ch;margin-bottom:30px}
.page-hero .body{margin-bottom:8px}

/* full-bleed image band --------------------------------------------------- */
.fullbleed{width:100%;height:clamp(320px,54vh,640px);overflow:hidden;background:var(--mist)}
.fullbleed img{width:100%;height:100%;object-fit:cover}

/* STATEMENT --------------------------------------------------------------- */
.statement .display{font-size:clamp(2rem,4.4vw,3.9rem);font-weight:300;max-width:20ch}
.statement .sub{margin-top:34px}

/* prose / article --------------------------------------------------------- */
.prose{max-width:62ch}
.prose h2{font-family:var(--display);font-weight:300;font-size:clamp(1.7rem,3vw,2.6rem);line-height:1.1;margin:0 0 22px}
.prose h3{font-family:var(--sans);font-weight:600;font-size:.82rem;text-transform:uppercase;letter-spacing:.1em;color:var(--cedar);margin:40px 0 12px}
.prose p{margin-bottom:1.25em;color:var(--ink);opacity:.82}
.prose p:last-child{margin-bottom:0}
.prose ul{margin:0 0 1.25em;padding:0;list-style:none}
.prose li{position:relative;margin-bottom:.55em;padding-left:1.2em;color:var(--ink);opacity:.82}
.prose li::before{content:"—";position:absolute;left:0;color:var(--cedar)}
.prose .note{margin-top:2.5em;padding-top:1.4em;border-top:1px solid var(--fog);font-size:.9rem;opacity:.6;max-width:60ch}

/* FAQ / Q&A rows */
.faq-item{padding:clamp(26px,3vw,40px) 0;border-top:1px solid var(--fog)}
.faq-item:last-child{border-bottom:1px solid var(--fog)}
.faq-q{font-family:var(--display);font-weight:300;font-size:clamp(1.25rem,2.4vw,1.9rem);line-height:1.15;margin-bottom:16px;max-width:34ch}
.faq-a{max-width:64ch;color:var(--ink);opacity:.82}
.faq-a p{margin-bottom:1em}
.faq-a ul{margin:0 0 1em;padding:0;list-style:none}
.faq-a li{position:relative;margin-bottom:.5em;padding-left:1.2em}
.faq-a li::before{content:"—";position:absolute;left:0;color:var(--cedar)}

/* INDEX rows -------------------------------------------------------------- */
.index-row{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(16px,3vw,48px);align-items:baseline;padding:clamp(28px,3.4vw,44px) 0;border-top:1px solid var(--fog)}
.index-row:last-child{border-bottom:1px solid var(--fog)}
.index-row .n{font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.14em;color:var(--cedar);padding-top:.6em}
.index-row .name{font-family:var(--display);font-weight:300;font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.05}
.index-row .desc{display:block;max-width:46ch;color:var(--ink);opacity:.7;font-size:.98rem;margin-top:10px}
.index-row .go{align-self:center;font-size:1.6rem;color:var(--ink);transition:transform .25s,color .25s}
a.index-row:hover .go{transform:translateX(6px);color:var(--cedar)}

/* MATERIAL / split image + text ------------------------------------------ */
.material{align-items:center}
.material-media{grid-column:1 / span 7;aspect-ratio:16/10;overflow:hidden;background:var(--mist)}
.material-media img{width:100%;height:100%;object-fit:cover}
.material-text{grid-column:9 / span 4;align-self:center}
.material-text h2{font-family:var(--display);font-weight:300;font-size:clamp(1.7rem,3vw,2.6rem);line-height:1.08;margin-bottom:22px}
.material-text p{color:var(--ink);opacity:.72;font-size:.98rem;margin-bottom:16px}
/* reversed variant: text left, image right */
.material.rev .material-media{grid-column:6 / span 7}
.material.rev .material-text{grid-column:1 / span 4}

/* PROJECT — portfolio feature, image shown whole (portrait or landscape) - */
.project{align-items:center}
.project-media{grid-column:1 / span 6;background:var(--mist);overflow:hidden}
.project-media img{width:100%;height:auto}
.project-text{grid-column:8 / span 5;align-self:center}
.project-text .eyebrow{margin-bottom:22px}
.project-text h2{font-family:var(--display);font-weight:300;font-size:clamp(1.8rem,3.2vw,2.8rem);line-height:1.08;margin-bottom:14px;max-width:18ch}
.project-text .lead{color:var(--ink);opacity:.72;font-size:1rem;margin-bottom:26px;max-width:42ch}

/* IMMERSIVE — full-bleed forest ------------------------------------------ */
.immersive{background:var(--forest);color:var(--paper)}
.immersive .eyebrow{color:#C9A87F;margin-bottom:28px}
.immersive .display{font-size:clamp(2.2rem,5vw,4.4rem);font-weight:300;max-width:16ch;color:var(--paper)}
.immersive .foot{margin-top:38px;color:rgba(244,241,234,.7);max-width:52ch;font-size:1rem}

/* PROCESS ----------------------------------------------------------------- */
.proc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--fog);border:1px solid var(--fog);margin-top:8px}
.proc{background:var(--paper);padding:clamp(22px,2.4vw,34px) clamp(18px,1.8vw,26px);min-height:150px}
.proc .n{font-family:var(--display);font-weight:300;font-size:1.6rem;color:var(--cedar)}
.proc h4{font-family:var(--sans);font-weight:600;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;margin:14px 0 8px}
.proc p{font-size:.86rem;color:var(--ink);opacity:.66;line-height:1.55}

/* SPECS / schedule -------------------------------------------------------- */
.sched{margin-top:8px;border-top:1px solid var(--ink)}
.sched-row{display:grid;grid-template-columns:.5fr 1.5fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--fog);align-items:baseline}
.sched-row dt{font-family:var(--sans);font-weight:600;font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink);opacity:.55}
.sched-row dd{font-family:var(--sans);font-size:.98rem;color:var(--ink)}

/* CONTACT ----------------------------------------------------------------- */
.contact .display{font-size:clamp(1.9rem,4vw,3.4rem);font-weight:300;max-width:16ch;margin-bottom:30px}
.contact .email{font-family:var(--display);font-weight:300;font-size:clamp(1.4rem,3vw,2.2rem);color:var(--forest);border-bottom:1px solid var(--cedar);padding-bottom:4px;display:inline-block}

/* FORM — minimal ---------------------------------------------------------- */
.form{max-width:580px}
.field{margin-bottom:26px}
.field label{display:block;font-family:var(--sans);font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--ink);opacity:.6;margin-bottom:9px}
.field input,.field select,.field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--fog);padding:10px 0;font-family:var(--sans);font-size:1rem;color:var(--ink);line-height:1.5}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-bottom-color:var(--cedar)}
.field select{appearance:none;-webkit-appearance:none;cursor:pointer}
.hp{position:absolute;left:-9999px}

/* FOOTER ------------------------------------------------------------------ */
footer{background:var(--forest-deep);color:var(--paper);padding:clamp(56px,7vw,90px) 0 44px}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:36px}
.foot-word{font-family:var(--word);font-weight:500;font-variant-caps:small-caps;font-size:1.55rem;letter-spacing:.06em;color:var(--paper);margin-bottom:18px}
.foot-grid h4{font-family:var(--sans);font-weight:600;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:#C9A87F;margin-bottom:16px}
.foot-grid a,.foot-grid p{color:rgba(244,241,234,.82);font-size:.92rem;display:block;margin-bottom:9px}
.foot-grid a:hover{color:var(--cedar)}
.foot-intro{color:rgba(244,241,234,.6)!important;max-width:32ch;font-size:.92rem}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:clamp(44px,6vw,70px);padding-top:24px;border-top:1px solid rgba(244,241,234,.16);font-size:.76rem;color:rgba(244,241,234,.5);letter-spacing:.04em}

/* responsive -------------------------------------------------------------- */
@media(max-width:960px){
  .hero{grid-template-columns:1fr;min-height:0}
  .hero-media{order:-1;aspect-ratio:16/11}
  .hero-text{padding:clamp(40px,8vw,64px) var(--mx)}
  .material-media,.material.rev .material-media{grid-column:1 / -1}
  .material-text,.material.rev .material-text{grid-column:1 / -1;margin-top:30px}
  .project-media{grid-column:1 / -1;max-width:480px}
  .project-text{grid-column:1 / -1;margin-top:30px}
  .proc-grid{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
  .nav-links{display:none}
  .nav-links.open{display:flex;position:absolute;top:74px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:18px;background:var(--paper);border-bottom:1px solid var(--fog);padding:24px var(--mx)}
  .menu-btn{display:block}
}
@media(max-width:560px){
  .index-row{grid-template-columns:auto 1fr;gap:16px}
  .index-row .go{display:none}
  .proc-grid{grid-template-columns:1fr}
  .sched-row{grid-template-columns:1fr;gap:4px}
  .foot-grid{grid-template-columns:1fr}
}
