/* The Blofield Nest - public site
   Palette: pastel woodland. Dusty pink, pale sage, soft fern, bark brown.
   The yellow from the original swatch is deliberately gone; bark replaces it. */
:root{
  --blossom:#D6A99D; --blossom-deep:#B8806F; --blossom-soft:#F4E6E1;
  --sage:#D6DAC8;    --sage-soft:#EDEFE6;
  --fern:#9CAFAA;    --fern-deep:#55706A;  --fern-soft:#E4EBE9;
  --bark:#8B6F5C;    --bark-deep:#6B5243;  --bark-soft:#EFE6DF;
  --paper:#FFFFFF; --chalk:#FBF8F4; --mist:#E8E0D6;
  --ink:#352C24; --ink-2:#5B4F45; --ink-3:#8A7C6E;
  --display:"Fraunces","Iowan Old Style",Georgia,serif;
  --body:"Nunito Sans","Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --paper:#241E1A; --chalk:#1B1613; --mist:#3B332C;
  --ink:#F2EBE4; --ink-2:#CDC2B7; --ink-3:#9B8E82;
  --blossom-soft:#3A2A26; --sage-soft:#2A2E26; --fern-soft:#223029; --bark-soft:#2E251F;
  --blossom-deep:#E0B3A6; --fern-deep:#9CBDB4; --bark-deep:#C6A288;
}}
:root[data-theme="dark"]{
  --paper:#241E1A; --chalk:#1B1613; --mist:#3B332C;
  --ink:#F2EBE4; --ink-2:#CDC2B7; --ink-3:#9B8E82;
  --blossom-soft:#3A2A26; --sage-soft:#2A2E26; --fern-soft:#223029; --bark-soft:#2E251F;
  --blossom-deep:#E0B3A6; --fern-deep:#9CBDB4; --bark-deep:#C6A288;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--chalk); color:var(--ink); font-family:var(--body);
     font-size:17px; line-height:1.62; padding-inline:20px}
h1,h2,h3,h4{font-family:var(--display); margin:0; line-height:1.1; text-wrap:balance; font-weight:600}
h1{font-size:clamp(36px,5.4vw,60px)}
h2{font-size:clamp(26px,3.4vw,40px)}
h3{font-size:21px}
p{margin:0}
a{color:inherit}
img,svg{max-width:100%}
.wrap{max-width:1060px; margin:0 auto}
.eyebrow{font-weight:800; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--fern-deep)}
.dim{color:var(--ink-3)}
.lead{font-size:19px; color:var(--ink-2); max-width:40ch}

/* brand */
.logo{display:inline-flex; align-items:center; gap:10px; text-decoration:none;
      font-family:var(--display); font-weight:600; font-size:21px; color:var(--ink)}
.logo .mark{width:36px; height:36px; flex:none}
.logo span{color:var(--bark-deep)}

/* nav */
nav{display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding-block:18px; border-bottom:1px solid var(--mist); flex-wrap:wrap}
nav .links{display:flex; gap:22px; font-weight:700; font-size:15px; color:var(--ink-2)}
nav .links a{text-decoration:none; padding-block:4px; border-bottom:2px solid transparent}
nav .links a[aria-current="page"]{border-bottom-color:var(--blossom); color:var(--ink)}
@media (max-width:760px){ nav .links{display:none} }

.btn{display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:16px;
     padding:11px 20px; border-radius:999px; text-decoration:none; border:1.5px solid transparent; cursor:pointer}
.btn.primary{background:var(--bark-deep); color:#fff}
.btn.ghost{border-color:var(--mist); color:var(--ink); background:var(--paper)}
.btn:hover{filter:brightness(1.08)}
.btn:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:3px solid var(--blossom); outline-offset:2px}

/* hero */
.hero{display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; padding-block:56px 44px}
.hero .cta{display:flex; gap:12px; flex-wrap:wrap; margin-top:26px}
@media (max-width:880px){ .hero{grid-template-columns:1fr; gap:30px; padding-block:38px 30px} }

.card{background:var(--paper); border:1px solid var(--mist); border-radius:20px; padding:26px}
.tint-blossom{background:var(--blossom-soft)} .tint-sage{background:var(--sage-soft)}
.tint-fern{background:var(--fern-soft)} .tint-bark{background:var(--bark-soft)}

.strip{display:flex; flex-wrap:wrap; gap:10px 28px; padding:16px 22px; border-radius:16px;
       background:var(--sage-soft); font-size:15px; color:var(--ink-2)}
.strip b{color:var(--ink)}

section{padding-block:44px}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:26px}
.grid2{display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:26px}
@media (max-width:860px){ .grid3,.grid2{grid-template-columns:1fr} }

.day{list-style:none; padding:0; margin:26px 0 0; border-left:2px solid var(--sage)}
.day li{position:relative; padding:0 0 26px 26px}
.day li::before{content:""; position:absolute; left:-7px; top:7px; width:12px; height:12px;
                border-radius:50%; background:var(--blossom); border:2px solid var(--chalk)}
.day time{font-weight:800; font-size:14px; color:var(--fern-deep); letter-spacing:.04em}

table{width:100%; border-collapse:collapse; margin-top:22px; font-size:16px}
th,td{text-align:left; padding:12px 10px; border-bottom:1px solid var(--mist)}
th{font-weight:800; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3)}
.scroll{overflow-x:auto}

details{border-bottom:1px solid var(--mist); padding-block:14px}
details summary{cursor:pointer; font-weight:800; font-size:17px; list-style:none}
details summary::-webkit-details-marker{display:none}
details summary::before{content:"+ "; color:var(--blossom-deep); font-weight:800}
details[open] summary::before{content:"\2212 "}
details p{margin-top:10px; color:var(--ink-2)}

form .field{margin-bottom:16px}
label{display:block; font-weight:800; font-size:14px; margin-bottom:6px}
input,textarea,select{width:100%; font:inherit; color:var(--ink); background:var(--paper);
  border:1.5px solid var(--mist); border-radius:12px; padding:11px 13px}
textarea{min-height:120px; resize:vertical}

footer{border-top:1px solid var(--mist); margin-top:40px; padding-block:30px 44px;
       display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:14.5px; color:var(--ink-3)}
footer a{text-decoration:none}
footer .cols{display:flex; gap:28px; flex-wrap:wrap}
.note{font-size:14px; color:var(--ink-3); margin-top:12px}