:root{
  --paper:#f6f3ee;
  --paper2:#f2efe9;
  --ink:#1b2126;
  --muted:#5a6671;
  --line:#e3ddd3;
  --accent:#2e5966;
  --radius:18px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background:
    radial-gradient(1100px 520px at 16% -10%, rgba(46,89,102,.12), rgba(46,89,102,0) 60%),
    radial-gradient(900px 520px at 100% 0%, rgba(122,107,90,.10), rgba(122,107,90,0) 55%),
    linear-gradient(180deg, var(--paper), var(--paper2));
}
a{color:inherit}
.wrap{width:min(1120px, calc(100% - 40px)); margin:0 auto}
.narrow{width:min(780px, calc(100% - 40px)); margin:0 auto}

.top{
  background: rgba(246,243,238,.78);
  border-bottom:1px solid rgba(227,221,211,.75);
  backdrop-filter: blur(8px);
}
.top .wrap{padding:14px 0}
.topbar{
  background: rgba(246,243,238,.78);
  border-bottom:1px solid rgba(227,221,211,.75);
  backdrop-filter: blur(8px);
}
.topbar .wrap{
  padding:14px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.top .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.topnav{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}
.topnav a{
  text-decoration:none;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid transparent;
}
.topnav a[aria-current="page"],
.topnav a:hover{
  border-color: rgba(46,89,102,.25);
  background: rgba(255,255,255,.7);
}
.brand{text-decoration:none; display:inline-flex; align-items:center}
.brand__logo{height:72px;width:auto;display:block}

.hero{padding:28px 0 10px}
.hero__grid{
  display:grid;
  grid-template-columns: 1.12fr .88fr;
  gap:28px;
  align-items:start;
}
@media (max-width: 900px){
  .hero__grid{grid-template-columns:1fr; gap:18px}
  .brand__logo{height:72px;width:auto;display:block}
}

.eyebrow{
  margin:0 0 10px;
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
}
h1{
  font-family: "Source Serif 4", serif;
  font-weight:500;
  font-size: clamp(34px, 4vw, 54px);
  line-height:1.06;
  margin:0 0 14px;
}
.sublead{
  font-size:17px;
  line-height:1.62;
  margin:0 0 12px;
  color:#242c33;
}
.bullets{
  margin:14px 0 18px;
  padding-left:18px;
  color:var(--muted);
  line-height:1.65;
}
.bullets li{margin:6px 0}
.promise{
  border-left:3px solid rgba(46,89,102,.45);
  padding-left:14px;
  margin: 12px 0 18px;
}
.promise p{margin:6px 0; color:var(--muted); line-height:1.55}

.form-card{
  background: rgba(255,255,255,.72);
  border:1px solid rgba(227,221,211,.92);
  border-radius: var(--radius);
  padding:16px;
  box-shadow: 0 18px 46px rgba(0,0,0,.06);
}
.form-card__k{
  margin:0 0 6px;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
}
.micro{font-size:13px; line-height:1.55; color:var(--muted); margin:12px 0 0}
.micro--tight{margin-top:8px}

.field{display:block; margin-top:12px}
.field span{display:block; font-size:12px; color:var(--muted); margin:0 0 6px}
.field em{font-style:normal; color:#7a8792}

input, select{
  width:100%;
  padding:12px 12px;
  border-radius: 14px;
  border:1px solid rgba(27,33,38,.16);
  background: rgba(255,255,255,.8);
  font-size:14px;
  outline:none;
}
input:focus, select:focus{
  border-color: rgba(46,89,102,.55);
  box-shadow: 0 0 0 4px rgba(46,89,102,.12);
}

.cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  margin-top:14px;
  padding:12px 14px;
  border-radius: 14px;
  background: var(--accent);
  color: var(--paper);
  text-decoration:none;
  font-weight:600;
  border:1px solid rgba(46,89,102,.15);
}
.cta--ghost{
  width:auto;
  background: transparent;
  color: var(--accent);
  border:1px solid rgba(46,89,102,.35);
}
.cta-row{margin-top:18px; display:flex; justify-content:flex-start}

.next{margin-top:14px; border-top:1px solid rgba(227,221,211,.9); padding-top:12px}
.next__k{
  margin:0 0 8px;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
}
.next ul{margin:0; padding-left:18px; color:var(--muted); line-height:1.65}
.next li{margin:6px 0}


.hero-photo, .hero-product{
  margin:0;
  border-radius: 20px;
  overflow:hidden;
  border:1px solid rgba(227,221,211,.92);
  box-shadow: 0 18px 46px rgba(0,0,0,.06);
  background: rgba(255,255,255,.6);
}
.hero-photo img{width:100%; height:auto; display:block}
.hero-product{padding:18px; display:flex; justify-content:center; align-items:center}
.hero-product img{width:320px; max-width:90%; height:auto; filter: drop-shadow(0 18px 36px rgba(0,0,0,.10))}

.section{padding:34px 0}
.section--shade{
  background: rgba(255,255,255,.34);
  border-top:1px solid rgba(227,221,211,.7);
  border-bottom:1px solid rgba(227,221,211,.7);
}
.big{font-size:20px; line-height:1.5; margin:0 0 10px}
p{margin:0 0 12px; line-height:1.7; color:#232b32}
.note{
  border-left:3px solid rgba(46,89,102,.45);
  padding-left:14px;
  color:var(--muted);
}
.out{color:var(--accent); text-decoration:underline}
.soft-rule{
  border:none;
  border-top:1px solid rgba(0,0,0,.08);
  margin:26px 0;
}
.footer{
  padding:24px 0 34px;
  border-top:1px solid rgba(227,221,211,.75);
  background: rgba(255,255,255,.18);
}
.footer__logo{height:46px; width:auto; display:block}
.legal{margin:10px 0 0; color:var(--muted); font-size:13px}
.legal a{text-decoration:none}
.legal a:hover{text-decoration:underline}
.legal span{margin:0 10px; color:rgba(90,102,113,.55)}

.thanks{
  font-family: "Source Serif 4", serif;
  font-weight:500;
  font-size: clamp(34px, 4vw, 50px);
  line-height:1.06;
  margin:0 0 14px;
}

.hero__form{
  align-self:start;
}
.hero__form .form-card{
  margin-top:0;
}

.copyright{
  margin-top:12px;
  font-size:13px;
  color: rgba(27,33,38,.55);
}

.hero__media{
  display:flex;
  flex-direction:column;
  gap:16px;
  align-self:start;
}
.hero__form .form-card{
  margin-top:0;
}


/* Page-wide two-column layout: essay left, image+form right */
.layout{
  display:grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap:28px;
  align-items:start;
}

.content{
  min-width:0;
}

.aside{
  display:flex;
  flex-direction:column;
  gap:16px;
  align-self:start;
}

.hero-photo img{
  width:100%;
  height:auto;
  border-radius:16px;
  display:block;
  box-shadow: 0 10px 26px rgba(27,33,38,.10);
}

/* Reduce section-block look: keep everything in one reading flow */
.hero{padding:26px 0 28px;}
.rule{margin:22px 0; border:0; border-top:1px solid rgba(227,221,211,.75);}

.content h2{
  margin:22px 0 8px;
  font-size:18px;
  letter-spacing:.02em;
}

.content p{max-width: 72ch;}

@media (max-width: 980px){
  .layout{grid-template-columns:1fr; gap:18px;}
  .aside{order:2}
  .content{order:1}
  .brand__logo{height:58px}
}

.header-divider, .site-header hr, hr.header-divider{ display:none !important; }

.site-header .logo img{
  height:auto;
  max-width:160px;
}
@media (max-width: 720px){
  .site-header .logo img{ max-width:140px; }
}

.cta-inline-wrap{ margin: 14px 0 24px; }
.cta-inline{
  display:inline-block;
  padding: 12px 16px;
  border-radius: 999px;
  background: var(--accent, #2f5660);
  color: #fff;
  text-decoration:none;
  font-weight: 600;
  font-size: 14px;
}
.cta-inline--ghost{
  background: transparent;
  color: var(--accent);
  border: 1px solid rgba(46,89,102,.35);
}
.cta-inline--disabled{
  background: rgba(46,89,102,.15);
  color: rgba(27,33,38,.55);
  border: 1px solid rgba(46,89,102,.2);
  cursor:not-allowed;
  opacity:.8;
}
.cta-inline-note{
  margin-top:8px;
  font-size: 13px;
  color: rgba(27,33,38,.65);
}
.cta-sentence{ margin-top: 14px; }

.skip-link{ display:none !important; }

/* Logo sizing override (smaller as requested) */
.site-header .logo img,
header .logo img,
.logo img{
  max-width: 110px !important;
}
@media (max-width: 720px){
  .site-header .logo img,
  header .logo img,
  .logo img{
    max-width: 95px !important;
  }
}

/* Section headings: quieter, like the kicker tone */
main h2, .content h2, .left-col h2{
  color: rgba(27,33,38,.55) !important;
  font-weight: 600;
}

/* Cookie banner */
.cookie-banner{
  display:none;
  position: fixed;
  left: 14px;
  right: 14px;
  bottom: 14px;
  z-index: 9999;
}
.cookie-banner__inner{
  max-width: 980px;
  margin: 0 auto;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(227,221,211,.92);
  border-radius: 16px;
  padding: 14px 14px;
  box-shadow: 0 18px 46px rgba(0,0,0,.10);
  display:flex;
  gap: 14px;
  align-items: flex-start;
  justify-content: space-between;
}
.cookie-banner__copy p{ margin: 0 0 6px; color:#232b32; line-height:1.55; }
.cookie-banner__links a{ color: var(--accent); text-decoration: underline; }
.cookie-banner__actions{ display:flex; gap:10px; align-items:center; }
.cookie-btn{
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(46,89,102,.15);
  background: var(--accent);
  color: var(--paper);
  font-weight: 600;
  cursor:pointer;
}
.cookie-btn--ghost{
  background: transparent;
  color: var(--accent);
  border: 1px solid rgba(46,89,102,.35);
}
@media (max-width: 720px){
  .cookie-banner__inner{ flex-direction: column; }
  .cookie-banner__actions{ width:100%; justify-content:flex-end; }
}

/* Storefront */
.shop-hero,
.product-hero{
  display:grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap:24px;
  align-items:center;
}
.shop-hero{
  grid-template-areas:
    "intro image"
    "support image";
}
.shop-hero__intro{grid-area:intro;}
.shop-hero__support{grid-area:support;}
.shop-hero .hero-product{grid-area:image;}
.shop-layout{
  display:flex;
  flex-direction:column;
}
.shop-justification{
  margin:0 0 10px;
  font-size:14px;
  color:rgba(27,33,38,.65);
}
.shop-reason,
.shop-gentle{
  margin:0 0 12px;
  color:#232b32;
}
.shop-gentle{
  color:rgba(27,33,38,.7);
}
.cta-support{
  margin:6px 0 0;
  font-size:12px;
  font-weight:400;
  color:rgba(27,33,38,.6);
}
.product-card .cta-support{
  margin-top:2px;
}
.stock-module{
  margin-top:16px;
  padding:16px;
  border-radius:16px;
  background: rgba(255,255,255,.6);
  border:1px solid rgba(227,221,211,.9);
}
.stock-module h2{
  margin:0 0 8px;
  font-size:18px;
}
.section-head{margin-bottom:18px}
.product-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:18px;
}
.product-card{
  padding:16px;
  border-radius:18px;
  border:1px solid rgba(227,221,211,.9);
  background: rgba(255,255,255,.75);
  box-shadow: 0 12px 32px rgba(0,0,0,.05);
  display:flex;
  flex-direction:column;
  gap:10px;
}
.product-thumb{
  width:100%;
  border-radius:14px;
  border:1px solid rgba(227,221,211,.85);
  background: rgba(255,255,255,.7);
  padding:10px;
  object-fit:contain;
}
.product-link{
  display:block;
  text-decoration:none;
}
.product-card h3{margin:0; font-size:18px}
.product-price{
  margin:0;
  color:rgba(27,33,38,.65);
  font-weight:600;
}
.product-copy{
  margin:0;
  color:#232b32;
  line-height:1.6;
}
.product-status{
  margin:0;
  margin-top:auto;
  font-size:13px;
  color:rgba(27,33,38,.65);
  text-transform:uppercase;
  letter-spacing:.08em;
}
.product-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.product-actions .cta-inline{
  font-size:13px;
}
.form-confirmation{
  margin-top:10px;
  font-size:13px;
  color:var(--accent);
}
@media (max-width: 960px){
  .shop-hero,
  .product-hero{
    grid-template-columns:1fr;
  }
}
@media (min-width: 768px){
  .shop-products{order:2;}
  .shop-access{order:3;}
}
@media (max-width: 767px){
  .shop-hero{
    grid-template-columns:1fr;
    grid-template-areas:
      "intro"
      "image"
      "support";
    gap:0;
  }
  .shop-hero__intro h1{
    margin-bottom:0;
  }
  .shop-hero__intro{
    margin-bottom:12px;
  }
  .shop-justification{
    margin-bottom:10px;
  }
  .hero-product{
    padding:14px;
    margin-bottom:22px;
  }
  .hero-product img{
    width:100%;
    max-width:280px;
    min-height:180px;
  }
  .shop-hero__support .sublead{
    margin-bottom:12px;
  }
  .shop-access.section{
    padding-top:18px;
  }
}