/* ============================================================
   NAYLOR & CO. — DESIGN TOKENS
   Single source of truth. The website and, later, every client
   proposal import this one file. Change a value here and it
   changes everywhere.
   Palette and typeface locked per nc-brand-format.
   ============================================================ */

/* Manrope is self-hosted. No third-party font request, which means no visitor
   IP is transmitted to Google and the site sets no cookies at all. That is what
   lets the privacy policy say what it says. Do not swap this back to a CDN. */
@font-face{
  font-family:'Manrope';
  font-style:normal;
  font-weight:300 800;
  font-display:swap;
  src:url('/assets/fonts/manrope-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,
    U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Manrope';
  font-style:normal;
  font-weight:300 800;
  font-display:swap;
  src:url('/assets/fonts/manrope-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,
    U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,
    U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  /* --- Locked brand palette --- */
  --nc-green:      #2C4A3E;   /* Bottle Green */
  --nc-brass:      #C5A55A;   /* Aged Brass   */
  --nc-parchment:  #F3EDE3;   /* Parchment    */
  --nc-ink:        #1A1A1A;   /* Ink Black    */

  /* --- Derived, for range. Never invent new hues. --- */
  --nc-paper:      #FAF7F1;   /* parchment, lifted */
  --nc-green-deep: #1E332B;
  --nc-ink-soft:   #5C574E;
  --nc-ink-faint:  #8C857A;
  --nc-rule:       #DED5C6;
  --nc-rule-soft:  #EBE3D6;

  /* --- Type --- */
  --nc-face: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --nc-w-light: 300;
  --nc-w-body:  400;
  --nc-w-head:  500;   /* locked: headings are 500 */
  --nc-w-mid:   600;

  /* --- Measure and rhythm --- */
  --nc-measure: 34rem;
  --nc-gutter:  clamp(24px, 6vw, 64px);

  /* --- Components --- */
  --nc-radius: 0;       /* locked: buttons are square */
  --nc-rule-w: 1px;
}

*{ box-sizing: border-box; }

body{
  margin: 0;
  background: var(--nc-paper);
  color: var(--nc-ink);
  font-family: var(--nc-face);
  font-weight: var(--nc-w-body);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,h2,h3,h4{
  font-weight: var(--nc-w-head);
  letter-spacing: -0.015em;
  line-height: 1.12;
  margin: 0;
}

a{ color: var(--nc-green); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover{ color: var(--nc-ink); }
a:focus-visible{ outline: 2px solid var(--nc-green); outline-offset: 3px; }

img{ max-width: 100%; height: auto; display: block; }

.nc-btn{
  display: inline-block;
  border-radius: var(--nc-radius);
  border: 1px solid var(--nc-green);
  background: var(--nc-green);
  color: var(--nc-parchment);
  font-weight: var(--nc-w-mid);
  font-size: 15px;
  letter-spacing: 0.01em;
  padding: 13px 26px;
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}
.nc-btn:hover{ background: var(--nc-green-deep); color: var(--nc-parchment); }

.nc-rule{ border: 0; border-top: var(--nc-rule-w) solid var(--nc-rule); margin: 0; }
.nc-rule--brass{ border-top-color: var(--nc-brass); }

@media (prefers-reduced-motion: reduce){
  *{ transition: none !important; animation: none !important; }
}

/* ============================================================
   SHARED PAGE CHROME
   Nav and footer are duplicated in each HTML file because there
   is no build step. That is fine at four pages. If the site
   reaches ten, add a tiny generator rather than keep copying.
   ============================================================ */

.shell{max-width:1140px;margin:0 auto;padding:0 var(--nc-gutter)}
.measure{max-width:var(--nc-measure)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--nc-ink-faint);margin:0 0 18px}

.nav{display:flex;align-items:baseline;justify-content:space-between;gap:24px;
  padding:26px 0 22px;border-bottom:1px solid var(--nc-rule);flex-wrap:wrap}
.nav .mark{font-size:13px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--nc-green);text-decoration:none}
.nav .mark:hover{color:var(--nc-ink)}
.nav ul{display:flex;gap:26px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav a{font-size:15px;color:var(--nc-ink-soft);text-decoration:none;padding:4px 0;
  display:inline-block}
.nav a:hover,.nav a[aria-current="page"]{color:var(--nc-green)}
.nav a[aria-current="page"]{border-bottom:2px solid var(--nc-brass)}

.pagehead{padding:clamp(56px,9vh,96px) 0 clamp(40px,6vh,64px)}
.pagehead h1{font-size:clamp(34px,5.6vw,56px);font-weight:800;letter-spacing:-.028em;
  line-height:1.06;margin:0;max-width:18ch;text-wrap:balance}
.pagehead .standfirst{font-size:clamp(18px,2.2vw,21px);line-height:1.55;color:var(--nc-ink-soft);
  max-width:38rem;margin:22px 0 0;font-weight:300}

.band{padding:clamp(52px,8vh,88px) 0;border-top:1px solid var(--nc-rule)}
h2{font-size:clamp(26px,3.6vw,38px);font-weight:600;letter-spacing:-.02em;line-height:1.15;
  margin:0 0 24px;max-width:20ch;text-wrap:balance}
h3{font-size:21px;font-weight:500;letter-spacing:-.01em;margin:0 0 10px}
.band p{font-size:18px;line-height:1.62;margin:0 0 20px;max-width:var(--nc-measure)}
.band p:last-child{margin-bottom:0}

.stage{display:grid;grid-template-columns:64px 1fr;gap:22px;padding:30px 0;
  border-bottom:1px solid var(--nc-rule)}
.stage:last-child{border-bottom:0}
.stage-n{font-family:inherit;font-size:14px;font-weight:600;color:var(--nc-brass);
  letter-spacing:.08em;padding-top:5px}
.stage p{font-size:17px;line-height:1.6;color:var(--nc-ink-soft);max-width:50ch}

.filter{padding-left:20px;border-left:2px solid var(--nc-brass);max-width:34rem}
.filter p{font-size:17px;line-height:1.6;margin:0}

.held{border:1px dashed var(--nc-rule);padding:20px 22px;max-width:38rem;
  background:var(--nc-parchment)}
.held p{font-size:15px;line-height:1.55;color:var(--nc-ink-faint);margin:0}

.cta{padding:clamp(56px,9vh,96px) 0 clamp(64px,11vh,110px);border-top:1px solid var(--nc-rule)}
.cta .lead{font-size:19px;line-height:1.6;max-width:38rem;margin:0 0 30px;color:var(--nc-ink-soft)}

footer{border-top:1px solid var(--nc-rule);padding:28px 0 40px;font-size:13px;
  line-height:1.55;color:var(--nc-ink-faint)}
footer .wordmark{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--nc-green);margin:0 0 16px}
footer .legal{margin:0 0 12px;max-width:62ch}
footer .colophon{margin:0;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
footer a{color:var(--nc-ink-soft)}
footer a:hover{color:var(--nc-green)}

@media(max-width:640px){
  .stage{grid-template-columns:1fr;gap:6px}
  .stage-n{padding-top:0}
  .nav{padding-bottom:16px}
}

/* --- tier cards --- */
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1px;
  background:var(--nc-rule);border:1px solid var(--nc-rule);margin-top:34px}
.tier{background:var(--nc-paper);padding:28px 26px;display:flex;flex-direction:column;gap:14px}
.tier.featured{background:var(--nc-parchment)}
.tier .badge{font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--nc-brass);margin:0}
.tier h3{margin:0;font-size:22px}
.tier .price{font-size:17px;font-weight:600;color:var(--nc-green);margin:0;letter-spacing:-.01em}
.tier p{font-size:16px;line-height:1.55;color:var(--nc-ink-soft);margin:0;max-width:none}
.tier .act{margin-top:auto;padding-top:8px}

/* --- notes list --- */
.notes{display:grid;gap:0;margin-top:26px;border-top:1px solid var(--nc-rule)}
.note{padding:20px 0;border-bottom:1px solid var(--nc-rule)}
.note h4{margin:0 0 7px;font-size:17px;font-weight:600;letter-spacing:-.005em}
.note p{margin:0;font-size:16px;line-height:1.55;color:var(--nc-ink-soft);max-width:52ch}

/* --- form --- */
.form{margin-top:8px;max-width:36rem;display:grid;gap:20px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:grid;gap:7px}
.field label{font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--nc-ink-soft)}
.field input,.field select,.field textarea{
  font-family:var(--nc-face);font-size:16px;color:var(--nc-ink);
  background:var(--nc-paper);border:1px solid var(--nc-rule);border-radius:0;
  padding:11px 12px;min-height:44px;width:100%}
.field textarea{min-height:110px;resize:vertical;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:2px solid var(--nc-green);outline-offset:-1px;border-color:var(--nc-green)}
.hint{font-size:14px;line-height:1.5;color:var(--nc-ink-faint);font-style:italic;margin:0;max-width:44ch}
.consent{display:flex;gap:11px;align-items:flex-start}
.consent input{width:auto;min-height:0;margin-top:4px}
.consent label{font-weight:400;font-size:15px;color:var(--nc-ink-soft);line-height:1.5}
@media(max-width:560px){.row{grid-template-columns:1fr}}

/* --- FAQ --- */
.qa{border-top:1px solid var(--nc-rule);margin-top:30px}
.qa details{border-bottom:1px solid var(--nc-rule)}
.qa summary{cursor:pointer;list-style:none;padding:20px 0;font-size:18px;font-weight:600;
  letter-spacing:-.008em;display:flex;justify-content:space-between;gap:20px;align-items:baseline}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";color:var(--nc-brass);font-weight:400;font-size:22px;line-height:1;flex:none}
.qa details[open] summary::after{content:"–"}
.qa summary:hover{color:var(--nc-green)}
.qa summary:focus-visible{outline:2px solid var(--nc-green);outline-offset:2px}
.qa .a{padding:0 0 22px;max-width:52ch}
.qa .a p{font-size:17px;line-height:1.6;color:var(--nc-ink-soft);margin:0 0 14px}
.qa .a p:last-child{margin-bottom:0}

/* --- Naylor Standard --- */
.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:34px;margin-top:30px}
.pillar h3{margin:0 0 10px}
.pillar p{font-size:16.5px;line-height:1.58;color:var(--nc-ink-soft);margin:0;max-width:44ch}
.setpiece{padding-left:20px;border-left:1px solid var(--nc-rule);max-width:52ch}
.setpiece p{font-size:16.5px;line-height:1.6;color:var(--nc-ink-soft)}
.aside{font-size:19px;line-height:1.5;font-weight:500;letter-spacing:-.012em;color:var(--nc-green);
  max-width:34rem;padding-left:20px;border-left:2px solid var(--nc-brass);margin:30px 0 0}
.creds{font-size:13.5px;color:var(--nc-ink-faint);margin:26px 0 0}
