/* Shared FROG page system — quiet, practical, and readable. */
:root{
  --pond:#143725;
  --paper:#143725;
  --pale:#173d2a;
  --ink:#f3f5ed;
  --muted:#c9d4c5;
  --line:rgba(243,245,237,.18);
  --frog:#c9e2ad;
  --lime:#c9e2ad;
  --clay:#c9e2ad;
}

/* FROG speaks in one calm, lower-case voice. Do not alter what people type. */
body:has([data-frog-nav]) :is(h1,h2,h3,h4,h5,h6,p,a,button,summary,label,span,b,strong,small,li,dt,dd,figcaption,blockquote,legend,option){
  text-transform:lowercase!important;
}

body:has([data-frog-nav]){
  background:#143725!important;
  color:#f3f5ed!important;
  font-family:"IBM Plex Mono",monospace!important;
  overflow-x:hidden!important;
}
body:has([data-frog-nav]) main > section,
body:has([data-frog-nav]) > header,
body:has([data-frog-nav]) > section{
  background:#143725!important;
  color:#f3f5ed!important;
  border-top:1px solid rgba(243,245,237,.18);
}
body:has([data-frog-nav]) header,
body:has([data-frog-nav]) .hero{
  border-top:0;
}
body:has([data-frog-nav]) h1,
body:has([data-frog-nav]) h2,
body:has([data-frog-nav]) h3,
body:has([data-frog-nav]) p,
body:has([data-frog-nav]) li,
body:has([data-frog-nav]) label,
body:has([data-frog-nav]) .head p,
body:has([data-frog-nav]) .card p,
body:has([data-frog-nav]) .format p,
body:has([data-frog-nav]) .split p,
body:has([data-frog-nav]) .list div,
body:has([data-frog-nav]) .callout p{
  color:#f3f5ed!important;
}
body:has([data-frog-nav]) p,
body:has([data-frog-nav]) .head p,
body:has([data-frog-nav]) .card p,
body:has([data-frog-nav]) .format p,
body:has([data-frog-nav]) .split p,
body:has([data-frog-nav]) .callout p{
  color:#d4ddd0!important;
}
body:has([data-frog-nav]) .mono,
body:has([data-frog-nav]) .eyebrow,
body:has([data-frog-nav]) .list b,
body:has([data-frog-nav]) .principle b{
  color:#c9e2ad!important;
}
body:has([data-frog-nav]) .card,
body:has([data-frog-nav]) .format,
body:has([data-frog-nav]) .callout,
body:has([data-frog-nav]) .list div,
body:has([data-frog-nav]) .principle,
body:has([data-frog-nav]) .outbound-case,
body:has([data-frog-nav]) .outbound-quote-wrap,
body:has([data-frog-nav]) .pond-path,
body:has([data-frog-nav]) .pond-form-panel{
  background:#173d2a!important;
  color:#f3f5ed!important;
  border:1px solid rgba(243,245,237,.18)!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body:has([data-frog-nav]) .card.dark,
body:has([data-frog-nav]) .callout[style*="paper"]{
  background:#0d2b20!important;
}
body:has([data-frog-nav]) .btn,
body:has([data-frog-nav]) button:not(.frog-nav-menu-button),
body:has([data-frog-nav]) .searchbar{
  border-radius:0!important;
  box-shadow:none!important;
}
body:has([data-frog-nav]) .btn-green{
  background:#c9e2ad!important;
  color:#143725!important;
}
body:has([data-frog-nav]) .btn-dark{
  background:#0d2b20!important;
  border:1px solid rgba(243,245,237,.18)!important;
  color:#f3f5ed!important;
}
body:has([data-frog-nav]) .btn-light{
  background:transparent!important;
  border:1px solid rgba(243,245,237,.18)!important;
  color:#f3f5ed!important;
}
body:has([data-frog-nav]) .btn:hover,
body:has([data-frog-nav]) button:hover{transform:none!important;filter:brightness(1.08)}
body:has([data-frog-nav]) input,
body:has([data-frog-nav]) textarea,
body:has([data-frog-nav]) select{
  border-radius:0!important;
  border:1px solid rgba(243,245,237,.18)!important;
  background:#0d2b20!important;
  color:#f3f5ed!important;
}
@media(max-width:700px){
  body:has([data-frog-nav]) main > section,
  body:has([data-frog-nav]) > header,
  body:has([data-frog-nav]) > section{padding-block:56px!important}
  body:has([data-frog-nav]) .wrap{width:min(100% - 28px,var(--max,1180px))!important}
  body:has([data-frog-nav]) .hero h1{font-size:clamp(34px,11vw,52px)!important;line-height:1!important}
}
@media(max-width:1100px){
  body:has([data-frog-nav]) .grid,
  body:has([data-frog-nav]) .formats,
  body:has([data-frog-nav]) .split{
    grid-template-columns:1fr!important;
  }
  body:has([data-frog-nav]) .actions{
    align-items:stretch!important;
  }
  body:has([data-frog-nav]) .actions .btn{
    width:100%!important;
    max-width:100%!important;
    white-space:normal!important;
  }
}

/* Homepage type scale: deliberately restrained on every internal route. */
body:has([data-frog-nav]) .hero{
  min-height:0!important;
  padding:84px 0 72px!important;
}
body:has([data-frog-nav]) .hero h1{
  max-width:21ch!important;
  margin:20px 0 24px!important;
  font-size:clamp(34px,4vw,58px)!important;
  line-height:1.02!important;
  letter-spacing:-.03em!important;
}
body:has([data-frog-nav]) .hero p{
  max-width:52ch!important;
  font-size:18px!important;
  line-height:1.55!important;
}
body:has([data-frog-nav]) main > section,
body:has([data-frog-nav]) > section{
  padding-block:72px!important;
}
body:has([data-frog-nav]) .card,
body:has([data-frog-nav]) .format,
body:has([data-frog-nav]) .callout,
body:has([data-frog-nav]) .list div{
  min-height:0!important;
  padding:28px!important;
}
body:has([data-frog-nav]) .card h2,
body:has([data-frog-nav]) .card h3,
body:has([data-frog-nav]) .format h3{
  margin:12px 0!important;
  font-size:clamp(24px,2.4vw,32px)!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
}
body:has([data-frog-nav]) .split h2,
body:has([data-frog-nav]) .callout h2{
  margin:12px 0 18px!important;
  font-size:clamp(30px,3.6vw,48px)!important;
  line-height:1.04!important;
  letter-spacing:-.035em!important;
}
body:has([data-frog-nav]) .card p,
body:has([data-frog-nav]) .format p,
body:has([data-frog-nav]) .split p,
body:has([data-frog-nav]) .list div,
body:has([data-frog-nav]) .callout p{
  font-size:15px!important;
  line-height:1.6!important;
}
body:has([data-frog-nav]) .actions{
  margin-top:28px!important;
}
@media(max-width:700px){
  body:has([data-frog-nav]) .hero{padding:56px 0 50px!important}
  body:has([data-frog-nav]) .hero h1{font-size:clamp(32px,9vw,42px)!important}
  body:has([data-frog-nav]) .hero p{font-size:16px!important}
  body:has([data-frog-nav]) .card,
  body:has([data-frog-nav]) .format,
  body:has([data-frog-nav]) .callout,
  body:has([data-frog-nav]) .list div{padding:22px!important}
}