/* ============================================================
   Arjun Gupta — SAT Prep & College Essay Coaching
   Collegiate editorial: Fraunces / Karla, Georgetown navy + brass
   ============================================================ */

/* === defensive base — injected by harden_css.py; do not hand-edit === */
*, *::before, *::after { box-sizing: border-box; min-width: 0; }
html { scroll-padding-top: calc(var(--nav-h, 72px) + 1rem); }
img, svg, video, iframe, canvas, table { display: block; max-width: 100%; }
p, li, h1, h2, h3, h4, blockquote, td, dd, dt { overflow-wrap: anywhere; }
form[style*="min-height"] { align-content: center; }
/* === end defensive base === */

:root{
  --ink:       #0C1F3D;
  --ink-deep:  #071528;
  --ink-soft:  #16305A;
  --brass:     #C6A253;
  --brass-hi:  #E3C77F;
  --brass-dim: #9E7F38;
  --paper:     #F8F5EE;
  --paper-2:   #F0EADC;
  --slate:     #5A6880;
  --line:      rgba(12,31,61,.13);
  --line-light:rgba(248,245,238,.18);

  --display: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --body:    'Karla', 'Helvetica Neue', system-ui, sans-serif;

  --nav-h: 68px;
  --wrap: 1180px;
  --r: 4px;
}

@media (max-width: 860px){ :root{ --nav-h: 60px; } }

/* ---------- base ---------- */

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:clamp(15px, 1.02vw, 17px);
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
}

/* paper grain — subtle, sits above the flat fills, never blocks clicks */
body::after{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  z-index:9;
  opacity:.5;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.055'/%3E%3C/svg%3E");
}

h1,h2,h3{ font-family:var(--display); font-weight:600; line-height:1.08; margin:0; font-variation-settings:'SOFT' 22,'WONK' 1; }
p{ margin:0; }
a{ color:inherit; }
img{ display:block; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(20px, 5vw, 44px); }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* clip-hidden rather than parked off-screen: a negative left would register
   as horizontal overflow. */
.skip{
  position:absolute; left:8px; top:8px; z-index:200;
  background:var(--ink); color:var(--paper); padding:12px 18px;
  font-size:14px; text-decoration:none; border-radius:var(--r);
  width:1px; height:1px; overflow:hidden; white-space:nowrap;
  clip:rect(0 0 0 0); clip-path:inset(50%);
}
.skip:focus{
  width:auto; height:auto; overflow:visible;
  clip:auto; clip-path:none;
}

:focus-visible{ outline:2px solid var(--brass); outline-offset:3px; }

/* ---------- buttons ---------- */

.btn{
  --btn-fs:15px;
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5em;
  padding:.92em 1.5em;
  font-family:var(--body);
  font-size:var(--btn-fs);
  font-weight:600;
  letter-spacing:.012em;
  line-height:1.15;
  text-decoration:none;
  border-radius:var(--r);
  border:1px solid transparent;
  cursor:pointer;
  transition:background-color .22s ease, color .22s ease, border-color .22s ease, transform .22s ease;
  text-align:center;
}
.btn--sm{ --btn-fs:13.5px; padding:.72em 1.15em; }

.btn--brass{ background:var(--brass); color:#12213A; border-color:var(--brass); }
.btn--brass:hover{ background:var(--brass-hi); border-color:var(--brass-hi); }

.btn--ink{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.btn--ink:hover{ background:var(--ink-soft); border-color:var(--ink-soft); }

.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--ink); background:rgba(12,31,61,.04); }

.btn--ghost-dark{ color:var(--paper); border-color:var(--line-light); }
.btn--ghost-dark:hover{ border-color:var(--brass); background:rgba(198,162,83,.12); }

@media (hover:hover){ .btn:hover{ transform:translateY(-1px); } }

/* ---------- nav ---------- */

.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(248,245,238,.9);
  backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--line);
}
.nav__inner{
  width:100%; max-width:var(--wrap); margin-inline:auto;
  padding-inline:clamp(20px, 5vw, 44px);
  height:var(--nav-h);
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}

.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; }
.brand__mark{
  flex:0 0 auto;
  width:36px; height:36px;
  display:grid; place-items:center;
  background:var(--ink); color:var(--brass-hi);
  font-family:var(--display); font-weight:700; font-size:14px;
  letter-spacing:.04em;
  border-radius:3px;
}
.brand__text{ display:flex; flex-direction:column; line-height:1.15; }
.brand__text strong{
  font-family:var(--display); font-weight:600; font-size:16.5px;
  letter-spacing:-.01em;
}
.brand__text em{
  font-style:normal; font-size:10.5px; letter-spacing:.15em;
  text-transform:uppercase; color:var(--slate); font-weight:600;
}

.nav__menu{ display:flex; align-items:center; gap:clamp(14px, 2vw, 26px); }
.nav__menu a{
  font-size:14px; font-weight:500; text-decoration:none; color:var(--ink);
  padding:4px 0; position:relative;
}
.nav__menu a:not(.btn)::after{
  content:""; position:absolute; left:0; right:0; bottom:0;
  height:1.5px; background:var(--brass);
  transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.nav__menu a:not(.btn):hover::after{ transform:scaleX(1); }

.nav__toggle{
  display:none;
  width:42px; height:42px;
  background:transparent; border:1px solid var(--line); border-radius:var(--r);
  cursor:pointer;
  align-items:center; justify-content:center;
}
.nav__bars, .nav__bars::before, .nav__bars::after{
  display:block; width:17px; height:1.6px; background:var(--ink);
  transition:transform .25s ease, opacity .2s ease;
}
.nav__bars{ position:relative; }
.nav__bars::before, .nav__bars::after{ content:""; position:absolute; left:0; }
.nav__bars::before{ top:-5.5px; }
.nav__bars::after{ top:5.5px; }
.nav__toggle[aria-expanded="true"] .nav__bars{ background:transparent; }
.nav__toggle[aria-expanded="true"] .nav__bars::before{ transform:translateY(5.5px) rotate(45deg); }
.nav__toggle[aria-expanded="true"] .nav__bars::after{ transform:translateY(-5.5px) rotate(-45deg); }

@media (max-width: 860px){
  .nav__toggle{ display:flex; }
  /* hidden by default — a class must opt it open (never rely on [hidden]) */
  .nav__menu{
    display:none;
    position:absolute; left:0; right:0; top:var(--nav-h);
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--paper);
    border-bottom:1px solid var(--line);
    padding:6px clamp(20px, 5vw, 44px) 18px;
    box-shadow:0 18px 40px -22px rgba(7,21,40,.4);
  }
  .nav__menu.is-open{ display:flex; }
  .nav__menu a{ padding:13px 0; border-bottom:1px solid var(--line); font-size:15px; }
  .nav__menu a:not(.btn)::after{ display:none; }
  .nav__cta{ margin-top:14px; border-bottom:0; }
}

/* ============================================================
   HERO — must fit the first viewport whole, desktop and mobile.
   container-type + cqi sizes type to the hero's own width, so the
   headline shrinks on a phone instead of pushing the CTAs past the fold.
   ============================================================ */

.hero{
  container-type:inline-size;
  position:relative;
  min-height:calc(100svh - var(--nav-h));
  display:flex; align-items:center;
  background:
    radial-gradient(120% 90% at 88% 8%, rgba(198,162,83,.13), transparent 58%),
    radial-gradient(90% 70% at 0% 100%, rgba(22,48,90,.07), transparent 60%),
    var(--paper);
  border-bottom:1px solid var(--line);
  overflow-x:clip;                 /* scoped: lets the corner rules bleed on purpose */
  padding-block:clamp(20px, 4cqi, 56px);
}

/* corner rules — quiet collegiate framing */
.hero::before, .hero::after{
  content:""; position:absolute; width:64px; height:64px; pointer-events:none;
  border:1px solid rgba(198,162,83,.5);
}
.hero::before{ top:26px; left:26px; border-right:0; border-bottom:0; }
.hero::after{ bottom:26px; right:26px; border-left:0; border-top:0; }
@media (max-width: 860px){ .hero::before, .hero::after{ display:none; } }

.hero__grid{
  width:100%; max-width:var(--wrap); margin-inline:auto;
  padding-inline:clamp(20px, 5vw, 44px);
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,340px);
  align-items:center;
  gap:clamp(28px, 5cqi, 68px);
}

.hero__copy{
  display:flex; flex-direction:column;
  gap:clamp(13px, 2.1cqi, 24px);
}

.eyebrow{
  font-size:clamp(10px, 1.65cqi, 12px);
  letter-spacing:.2em; text-transform:uppercase; font-weight:700;
  color:var(--brass-dim);
  text-wrap:balance;   /* keeps "MAJOR" off a line of its own on a phone */
}

.hero__title{
  font-size:clamp(1.75rem, 8.4cqi, 4.4rem);
  font-variation-settings:'SOFT' 20,'WONK' 1;
  font-weight:600;
  letter-spacing:-.021em;
  text-wrap:balance;
}
.hero__title em{
  font-style:italic; font-weight:600;
  color:var(--ink-soft);
  font-variation-settings:'SOFT' 60,'WONK' 1;
  position:relative;
}
.hero__title em::after{
  content:""; position:absolute; left:0; right:0; bottom:.06em;
  height:.055em; background:var(--brass); opacity:.85;
}

.hero__sub{
  font-size:clamp(14px, 1.95cqi, 17.5px);
  color:var(--slate);
  max-width:44ch;
  line-height:1.62;
}

.hero__cta{ display:flex; flex-wrap:wrap; gap:11px; }

.proof{
  list-style:none; margin:0; padding:clamp(12px,1.7cqi,18px) 0 0;
  border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:clamp(16px, 3.4cqi, 40px);
}
.proof li{ display:flex; flex-direction:column; gap:1px; }
.proof b{
  font-family:var(--display); font-weight:700;
  font-size:clamp(23px, 4.1cqi, 40px);
  line-height:1; color:var(--ink);
  font-variant-numeric:tabular-nums lining-nums;
  letter-spacing:-.02em;
}
.proof span{
  font-size:clamp(9px, 1.35cqi, 11px);
  letter-spacing:.155em; text-transform:uppercase;
  color:var(--slate); font-weight:600;
}

/* portrait */
.hero__portrait{ margin:0; display:flex; flex-direction:column; gap:14px; }
.portrait__frame{
  position:relative;
  border:1px solid var(--line);
  padding:9px;
  background:rgba(255,255,255,.55);
}
.portrait__frame::after{
  content:""; position:absolute; inset:0;
  border:1px solid rgba(198,162,83,.42);
  transform:translate(9px,9px);
  pointer-events:none;
}
.portrait__frame img{ width:100%; height:auto; }
.hero__portrait figcaption{ display:flex; flex-direction:column; gap:2px; }
.hero__portrait figcaption strong{
  font-family:var(--display); font-size:16px; font-weight:600;
}
.hero__portrait figcaption span{ font-size:11.5px; color:var(--slate); line-height:1.4; }

@media (max-width: 860px){
  .hero__grid{ grid-template-columns:1fr; }
  /* the portrait becomes a compact identity chip above the headline,
     so the headline + CTAs + proof still clear the fold on a phone */
  .hero__portrait{
    order:-1;
    flex-direction:row; align-items:center; gap:13px;
  }
  .portrait__frame{ flex:0 0 auto; width:64px; padding:4px; }
  .portrait__frame::after{ transform:translate(4px,4px); }
}

/* ============================================================
   APPROACH
   ============================================================ */

.sect-label{
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  font-weight:700; color:var(--brass-dim);
}
.sect-label--light{ color:var(--brass-hi); }

.sect-title{
  font-size:clamp(1.65rem, 3.4vw, 2.7rem);
  letter-spacing:-.02em;
  margin-top:14px;
  max-width:19ch;
  text-wrap:balance;
}
.sect-title--light{ color:var(--paper); }

.approach{ padding-block:clamp(64px, 9vw, 120px); background:var(--paper); }

.pull{
  margin:26px 0 0;
  border-left:2px solid var(--brass);
  padding-left:clamp(18px, 3vw, 34px);
}
.pull p{
  font-family:var(--display);
  font-size:clamp(1.4rem, 3.3vw, 2.45rem);
  line-height:1.16; letter-spacing:-.018em;
  font-variation-settings:'SOFT' 26,'WONK' 1;
  text-wrap:balance;
  /* em, not ch on the blockquote — ch there resolves against the parent's
     body font and collapses this to a ~220px column. */
  max-width:21em;
}
.pull em{ font-style:italic; color:var(--ink-soft); }

.approach__body{
  margin-top:clamp(26px, 4vw, 40px);
  columns:2; column-gap:clamp(28px, 4vw, 54px);
  max-width:74ch;
  color:var(--slate);
}
.approach__body p{ break-inside:avoid; }
.approach__body p + p{ margin-top:1em; }
.approach__body em{ color:var(--ink); font-style:italic; }
@media (max-width: 760px){ .approach__body{ columns:1; } }

.steps{
  list-style:none; margin:clamp(42px, 6vw, 68px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr));
  gap:clamp(22px, 3vw, 38px);
  border-top:1px solid var(--line);
  padding-top:clamp(28px, 4vw, 44px);
}
.steps li{ display:flex; flex-direction:column; gap:9px; }
.steps__n{
  font-family:var(--display); font-size:13px; font-weight:700;
  width:30px; height:30px; display:grid; place-items:center;
  border:1px solid var(--brass); border-radius:50%;
  color:var(--brass-dim);
}
.steps h3{ font-size:1.16rem; letter-spacing:-.01em; }
.steps p{ font-size:14.5px; color:var(--slate); line-height:1.6; }

/* ============================================================
   TUTORING
   ============================================================ */

.tutoring{
  padding-block:clamp(64px, 9vw, 120px);
  background:var(--paper-2);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.cards{
  margin-top:clamp(34px, 5vw, 54px);
  display:grid; grid-template-columns:repeat(auto-fit, minmax(272px,1fr));
  gap:clamp(16px, 2vw, 24px);
}
/* four services — 2x2 reads better than a 3-up with one orphan */
@media (min-width: 900px){ .cards{ grid-template-columns:repeat(2, 1fr); } }
.card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:clamp(24px, 3vw, 34px);
  display:flex; flex-direction:column; gap:11px;
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
@media (hover:hover){
  .card:hover{
    border-color:rgba(198,162,83,.62);
    transform:translateY(-3px);
    box-shadow:0 22px 44px -30px rgba(7,21,40,.55);
  }
}
.card__kicker{
  font-size:10px; letter-spacing:.19em; text-transform:uppercase;
  font-weight:700; color:var(--brass-dim);
}
.card h3{ font-size:1.32rem; letter-spacing:-.015em; }
.card > p:not(.card__kicker):not(.card__meta){ font-size:14.5px; color:var(--slate); line-height:1.62; }
.card__meta{
  margin-top:auto; padding-top:12px;
  font-size:11.5px; letter-spacing:.09em; text-transform:uppercase;
  color:var(--slate); font-weight:600;
  border-top:1px solid var(--line);
}
.card__link{
  font-size:13.5px; font-weight:700; text-decoration:none;
  color:var(--ink); display:inline-flex; gap:.45em; align-items:center;
}
.card__link span{ transition:transform .25s ease; }
.card__link:hover span{ transform:translateX(4px); }

.price-note{
  margin-top:clamp(30px, 4vw, 44px);
  padding:clamp(22px, 3vw, 30px);
  background:var(--paper);
  border:1px solid var(--line);
  border-left:3px solid var(--brass);
  border-radius:var(--r);
  display:flex; flex-wrap:wrap; align-items:center; gap:18px 26px;
  justify-content:space-between;
}
.price-note p{
  flex:1 1 340px;
  font-size:15px; color:var(--slate); line-height:1.65; max-width:62ch;
}
.price-note .btn{ flex:0 0 auto; }
.price-note strong{ color:var(--ink); }

/* ============================================================
   RESULTS
   ============================================================ */

.results{
  padding-block:clamp(64px, 9vw, 118px);
  background:
    radial-gradient(80% 120% at 15% 0%, rgba(198,162,83,.16), transparent 55%),
    var(--ink);
  color:var(--paper);
}

.scoreboard{
  margin-top:clamp(36px, 5vw, 56px);
  display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr));
  gap:2px;
  background:var(--line-light);
  border:1px solid var(--line-light);
}
.score{
  background:var(--ink);
  padding:clamp(26px, 3.4vw, 40px) clamp(20px, 2.6vw, 30px);
  display:flex; flex-direction:column; gap:7px;
}
.score b{
  font-family:var(--display); font-weight:700;
  font-size:clamp(2.6rem, 6vw, 4.1rem); line-height:.94;
  color:var(--brass-hi);
  font-variant-numeric:tabular-nums lining-nums;
  letter-spacing:-.025em;
}
.score span{
  font-size:11.5px; letter-spacing:.17em; text-transform:uppercase;
  color:rgba(248,245,238,.66); font-weight:600;
}

.admits{ margin-top:clamp(38px, 5vw, 58px); }
.admits__label{
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  font-weight:700; color:rgba(248,245,238,.55);
}
.admits__list{
  list-style:none; margin:16px 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:10px 12px;
}
.admits__list li{
  font-family:var(--display); font-size:clamp(1rem, 1.9vw, 1.35rem);
  font-weight:600; letter-spacing:-.012em;
  padding:9px 17px;
  border:1px solid var(--line-light);
  border-radius:999px;
  color:rgba(248,245,238,.86);
}
.admits__list .is-chosen{
  border-color:var(--brass); color:var(--brass-hi);
  background:rgba(198,162,83,.1);
}
.admits__list em{
  font-style:italic; font-size:.72em; opacity:.85; font-weight:400;
}
.admits__foot{
  margin-top:20px; font-size:15px; max-width:52ch;
  color:rgba(248,245,238,.7); line-height:1.62;
}

/* ============================================================
   ABOUT
   ============================================================ */

.about{ padding-block:clamp(64px, 9vw, 120px); background:var(--paper); }
.about__grid{
  display:grid; grid-template-columns:minmax(0,380px) minmax(0,1fr);
  gap:clamp(30px, 5vw, 72px);
  align-items:center;
}
@media (max-width: 900px){
  .about__grid{ grid-template-columns:1fr; }
  .about__photo{ max-width:300px; }
}

.about__photo{
  margin:0; position:relative;
  border:1px solid var(--line); padding:10px;
  background:rgba(255,255,255,.6);
}
.about__photo::after{
  content:""; position:absolute; inset:0;
  border:1px solid rgba(198,162,83,.4);
  transform:translate(11px,11px); pointer-events:none;
}
.about__photo img{ width:100%; height:auto; }

.about__copy{ display:flex; flex-direction:column; gap:13px; }
.about__copy .sect-title{ margin-top:10px; margin-bottom:4px; }
.about__copy p{ color:var(--slate); font-size:15.5px; line-height:1.7; max-width:56ch; }
.about__copy strong{ color:var(--ink); font-weight:700; }
.about__sign{
  font-family:var(--display); font-style:italic; font-weight:600;
  font-size:1.5rem !important; color:var(--ink) !important;
  margin-top:6px; font-variation-settings:'SOFT' 60,'WONK' 1;
}
.about__cta{ display:flex; flex-wrap:wrap; gap:11px; margin-top:10px; }
.about__cta .btn--ghost-dark{ color:var(--ink); border-color:var(--line); }
.about__cta .btn--ghost-dark:hover{ border-color:var(--ink); background:rgba(12,31,61,.04); }

/* ============================================================
   FINAL CTA
   ============================================================ */

.cta{
  padding-block:clamp(64px, 8vw, 106px);
  background:
    radial-gradient(90% 130% at 85% 100%, rgba(198,162,83,.17), transparent 58%),
    var(--ink-deep);
  color:var(--paper);
  text-align:center;
}
.cta__inner{ display:flex; flex-direction:column; align-items:center; gap:15px; }
.cta h2{
  font-size:clamp(1.7rem, 3.8vw, 3rem);
  letter-spacing:-.022em; max-width:19ch; text-wrap:balance;
  color:var(--paper);
}
.cta__sub{
  font-size:16px; color:rgba(248,245,238,.72); max-width:50ch; line-height:1.65;
}
.cta__row{ display:flex; flex-wrap:wrap; gap:11px; justify-content:center; margin-top:8px; }
.cta__fine{
  margin-top:8px; font-size:11.5px; letter-spacing:.15em;
  text-transform:uppercase; color:rgba(248,245,238,.44); font-weight:600;
}

/* ============================================================
   FOOTER
   ============================================================ */

.foot{ background:var(--ink); color:var(--paper); padding-block:clamp(38px, 5vw, 56px); }
.foot__inner{
  display:flex; flex-wrap:wrap; gap:26px 40px;
  align-items:center; justify-content:space-between;
}
.foot__brand{ display:flex; align-items:center; gap:12px; }
.foot__brand .brand__mark{ background:var(--brass); color:var(--ink); }
.foot__brand div{ display:flex; flex-direction:column; line-height:1.3; }
.foot__brand strong{ font-family:var(--display); font-size:16.5px; font-weight:600; }
.foot__brand span{ font-size:12px; color:rgba(248,245,238,.6); }

.foot__links{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px 22px; }
.foot__links a{ font-size:13.5px; color:rgba(248,245,238,.78); text-decoration:none; }
.foot__links a:hover{ color:var(--brass-hi); }

.foot__contact{ display:flex; flex-direction:column; gap:2px; }
.foot__contact a{
  font-family:var(--display); font-size:1.2rem; font-weight:600;
  text-decoration:none; color:var(--brass-hi);
}
.foot__contact span{ font-size:11.5px; color:rgba(248,245,238,.55); letter-spacing:.05em; }

/* ============================================================
   CONTACT PAGE
   ============================================================ */

.chead{
  padding-block:clamp(46px, 7vw, 84px) clamp(30px, 4vw, 44px);
  background:
    radial-gradient(100% 90% at 90% 0%, rgba(198,162,83,.14), transparent 60%),
    var(--paper);
  border-bottom:1px solid var(--line);
}
.chead__title{
  font-size:clamp(1.9rem, 5vw, 3.3rem);
  letter-spacing:-.023em; margin-top:14px; max-width:16ch;
  text-wrap:balance;
}
.chead__sub{
  margin-top:16px; max-width:56ch;
  font-size:16px; color:var(--slate); line-height:1.68;
}
.chead__quick{ display:flex; flex-wrap:wrap; gap:11px; margin-top:24px; }

.cbody{ padding-block:clamp(44px, 6vw, 76px); background:var(--paper-2); scroll-margin-top:var(--nav-h); }
.cbody__grid{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,318px);
  gap:clamp(26px, 4vw, 52px);
  align-items:start;              /* form card keeps its own height */
}
@media (max-width: 900px){ .cbody__grid{ grid-template-columns:1fr; } }

.form-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-top:3px solid var(--brass);
  border-radius:var(--r);
  padding:clamp(24px, 3.4vw, 40px);
}
.form-card__title{ font-size:clamp(1.4rem, 2.6vw, 1.9rem); letter-spacing:-.018em; }
.form-card__note{ margin-top:9px; font-size:14px; color:var(--slate); }

#estimate-form{ margin-top:clamp(22px, 3vw, 30px); display:grid; gap:17px; }

.field{ display:flex; flex-direction:column; gap:7px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:17px; }
@media (max-width: 560px){ .field-row{ grid-template-columns:1fr; } }

.field label{
  font-size:11.5px; letter-spacing:.14em; text-transform:uppercase;
  font-weight:700; color:var(--ink);
}
.field input, .field textarea{
  font-family:var(--body); font-size:15.5px; color:var(--ink);
  background:var(--paper-2);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:13px 14px;
  width:100%;
  transition:border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.field textarea{ resize:vertical; min-height:120px; line-height:1.6; }
.field input::placeholder, .field textarea::placeholder{ color:rgba(90,104,128,.62); }
.field input:focus, .field textarea:focus{
  outline:none;
  background:#fff;
  border-color:var(--brass);
  box-shadow:0 0 0 3px rgba(198,162,83,.18);
}
.field input:user-invalid, .field textarea:user-invalid{ border-color:#B4462F; }

.form-submit{ justify-self:start; margin-top:3px; }
.form-submit[disabled]{ opacity:1; cursor:default; transform:none; }

.turnstile-box{ margin-top:2px; }

.form-status{
  margin-top:2px;
  padding:15px 17px;
  border-radius:var(--r);
  font-size:15px; line-height:1.55;
  border:1px solid var(--line);
  background:var(--paper-2);
}
.form-status.is-ok{
  border-color:rgba(37,110,73,.4);
  background:rgba(37,110,73,.09);
  color:#1E5638;
}
.form-status.is-err{
  border-color:rgba(180,70,47,.42);
  background:rgba(180,70,47,.08);
  color:#8E3320;
}
.form-status a{ color:inherit; font-weight:700; }

.cside{ display:flex; flex-direction:column; gap:20px; }
.cside__block{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:22px;
}
.cside__block--proof{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.cside__label{
  font-size:10.5px; letter-spacing:.19em; text-transform:uppercase;
  font-weight:700; color:var(--brass-dim);
}
.cside__block--proof .cside__label{ color:var(--brass-hi); }
.cside__phone{
  display:inline-block; margin-top:9px;
  font-family:var(--display); font-size:1.62rem; font-weight:700;
  letter-spacing:-.02em; text-decoration:none; color:var(--ink);
}
.cside__phone:hover{ color:var(--brass-dim); }
.cside__meta{ margin-top:6px; font-size:13px; color:var(--slate); line-height:1.5; }
.cside__block--proof .cside__meta{ color:rgba(248,245,238,.6); }
.cside__text{ margin-top:9px; font-size:14.5px; color:var(--slate); line-height:1.62; }
.cside__list{
  list-style:none; margin:11px 0 0; padding:0;
  display:flex; flex-direction:column; gap:7px;
}
.cside__list li{
  font-size:14.5px; color:var(--slate);
  padding-left:16px; position:relative;
}
.cside__list li::before{
  content:""; position:absolute; left:0; top:.62em;
  width:5px; height:5px; background:var(--brass); border-radius:50%;
}
.cside__scores{
  margin-top:10px; font-size:14px; color:rgba(248,245,238,.78); line-height:1.6;
}
.cside__scores b{
  font-family:var(--display); font-size:1.18rem; font-weight:700;
  color:var(--brass-hi); font-variant-numeric:tabular-nums lining-nums;
}

/* ============================================================
   SCROLL REVEAL — below the fold only (never on hero/header)
   ============================================================ */

.reveal{
  opacity:0; transform:translateY(18px);
  transition:opacity .72s cubic-bezier(.22,.61,.36,1), transform .72s cubic-bezier(.22,.61,.36,1);
}
.reveal.is-in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}
@media (scripting: none){
  .reveal{ opacity:1; transform:none; }
}

/* === site credit (injected by credit_footer.py); do not hand-edit === */
.site-credit {
  margin: 2.25rem 0 0;
  padding-inline: 1.25rem;
  font-size: .73rem;
  line-height: 1.5;
  letter-spacing: .06em;
  text-align: center;
  opacity: .65;
}
.site-credit a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(128, 128, 128, .5);
  border-bottom: 1px solid color-mix(in srgb, currentColor 45%, transparent);
  transition: border-bottom-color .25s ease;
}
.site-credit a:hover,
.site-credit a:focus-visible { border-bottom-color: currentColor; }
@media (prefers-reduced-motion: reduce) {
  .site-credit a { transition: none; }
}
/* === end site credit === */