/* == Tokens == */
:root{
  --ink:var(--mw-text,#1e1e1e);
  --slate:var(--mw-primary,#4a5560);
  --cream:var(--mw-surface,#faf8f5);
  --sand:var(--mw-accent,#d9cbb3);
  --paper:color-mix(in srgb,var(--cream) 70%,#fff);
  --tint:color-mix(in srgb,var(--sand) 22%,var(--cream));
  --rule:color-mix(in srgb,var(--slate) 22%,var(--cream));
  --soft:color-mix(in srgb,var(--ink) 66%,var(--cream));
  --maxw:1200px;
}
html{scroll-behavior:smooth}
body{font-family:var(--mw-font-body);font-size:1.125rem;line-height:1.6;color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--mw-font-heading);font-weight:400;text-wrap:balance;letter-spacing:-0.005em}
a{color:var(--slate)}
:focus-visible{outline:2px solid var(--slate);outline-offset:3px}

/* == Wordmark == */
.wordmark{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--mw-font-heading);font-size:1.4rem;font-weight:500;letter-spacing:.01em;color:var(--ink);text-decoration:none;white-space:nowrap}
.wordmark svg{color:var(--slate);flex:none}
.wordmark em{font-style:italic;font-weight:400}

/* == Type helpers == */
.eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--soft);margin:0 0 1rem;font-weight:500}
.eyebrow.center{text-align:center}
.lead{font-size:1.25rem;line-height:1.55;color:var(--soft);max-width:34rem}
.prose p,.prose-p{max-width:38rem;color:var(--soft)}
.quiet-link{color:var(--slate);text-decoration:none;border-bottom:1px solid var(--rule);padding-bottom:2px;transition:border-color .18s}
.quiet-link:hover{border-color:var(--slate)}
.num{font-family:var(--mw-font-heading);font-size:1.5rem;color:var(--slate)}
.mw-sample-note{font-size:.9rem;color:var(--soft)}

/* == Sections == */
.mw-section{padding:clamp(4rem,9vw,8rem) 0}
.mw-section-in{max-width:var(--maxw);margin:0 auto;padding:0 clamp(1rem,4vw,2rem)}
.mw-section h2{font-size:clamp(2rem,4vw,3.25rem);line-height:1.1;margin:0 0 1.25rem}
.mw-section-band{background:var(--tint)}
.mw-section-lined{border-top:1px solid var(--rule)}
.split{display:grid;grid-template-columns:5fr 6fr;gap:clamp(2rem,6vw,6rem);align-items:start}

/* == First screen == */
.first{padding:clamp(2.5rem,6vw,5.5rem) 0 clamp(3rem,7vw,6rem)}
.first-in{max-width:var(--maxw);margin:0 auto;padding:0 clamp(1rem,4vw,2rem);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:center;min-height:min(78vh,720px)}
.first h1{font-size:clamp(2.75rem,6vw,5.25rem);line-height:1.04;font-weight:400;margin:0 0 1.5rem}
.first-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1.5rem;margin-top:2rem}
.mw-btn{font-family:var(--mw-font-body);letter-spacing:.02em}

/* == Product window == */
.window{background:#fff;border:1px solid var(--rule);border-radius:14px;box-shadow:0 1px 2px rgba(30,30,30,.04),0 24px 60px -24px rgba(74,85,96,.35);overflow:hidden}
.window-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.25rem 1rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--rule)}
.window-title{font-family:var(--mw-font-heading);font-size:1.35rem}
.window-meta{font-size:.8rem;color:var(--soft);align-self:center;letter-spacing:.04em}
.wrow{display:grid;grid-template-columns:.9fr 1.5fr 1.1fr .9fr .8fr;gap:.75rem;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid var(--rule);font-size:1rem}
.wcols{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--soft);background:var(--tint);padding:.7rem 1.5rem}
.window-foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;padding:1rem 1.5rem;font-size:.85rem;color:var(--soft)}
.chips{display:flex;gap:.4rem;flex-wrap:wrap}
.chips b{font-weight:500;border:1px solid var(--rule);border-radius:999px;padding:.1rem .7rem;color:var(--slate)}
.tag{display:inline-block;font-size:.78rem;font-weight:500;padding:.1rem .65rem;border-radius:999px;letter-spacing:.03em}
.tag-ok{background:color-mix(in srgb,var(--slate) 14%,#fff);color:#2f3a44}
.tag-warn{background:color-mix(in srgb,var(--sand) 55%,#fff);color:#4a3d22}
.tag-mute{background:#f0eeea;color:#5b5b5b}

/* == Offer ledger == */
.ledger{list-style:none;margin:clamp(3rem,6vw,5rem) 0 0;padding:0;border-top:1px solid var(--rule)}
.ledger li{display:grid;grid-template-columns:5rem 1fr;gap:1rem;padding:1.75rem 0;border-bottom:1px solid var(--rule)}
.ledger h3{font-size:1.6rem;margin:0 0 .25rem}
.ledger p{margin:0;color:var(--soft);max-width:40rem}

/* == Proof == */
.proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.photo{margin:0}
.photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 40%;border-radius:10px;display:block}
.quotes{margin-top:2rem;gap:1rem}
.mw-testimonial{border:1px solid var(--rule);background:#fff;border-radius:10px;padding:1.5rem;margin:0}

/* == Steps == */
.steps4{list-style:none;padding:0;margin:3rem 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}
.steps4 li{border-top:1px solid var(--slate);padding-top:1.25rem}
.steps4 h3{font-size:1.5rem;margin:.5rem 0}
.steps4 p{color:var(--soft);margin:0;font-size:1rem}
.steps4 .num{font-size:1rem;letter-spacing:.1em}

/* == Pricing == */
.price-card{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(2rem,5vw,5rem);border:1px solid var(--rule);background:#fff;border-radius:14px;padding:clamp(1.5rem,4vw,3.5rem);align-items:center}
.price-card h2{font-size:clamp(2.5rem,5vw,4rem)}
.ticks{list-style:none;margin:0 0 2rem;padding:0}
.ticks li{padding:.7rem 0;border-bottom:1px solid var(--rule);color:var(--soft)}

/* == Contact == */
.mw-form{max-width:36rem}

/* == Footer == */
.mw-footer{border-top:1px solid var(--rule);background:var(--tint);padding:clamp(3rem,6vw,5rem) 0 3rem}
.foot{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2.5rem;max-width:var(--maxw);margin:0 auto;padding:0 clamp(1rem,4vw,2rem)}
.foot h4{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--soft);margin:0 0 1rem;font-family:var(--mw-font-body);font-weight:500}
.foot a:not(.wordmark){display:block;color:var(--ink);text-decoration:none;padding:.2rem 0}
.foot a:not(.wordmark):hover{color:var(--slate);text-decoration:underline}
.foot-line{color:var(--soft);max-width:20rem;margin-top:1rem}

/* == Portal and owner == */
.signin-wrap{max-width:30rem;margin:0 auto;padding:clamp(2rem,8vw,6rem) 1rem}
.mw-page-head h1{font-family:var(--mw-font-heading);font-weight:400;font-size:2rem;margin:0}
.mw-page-head p{margin:.25rem 0 0;color:var(--soft);font-size:1rem}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem;margin-bottom:1.5rem}
.kpi{background:#fff;border:1px solid var(--rule);border-radius:10px;padding:1.1rem 1.25rem}
.kpi span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--soft)}
.kpi strong{font-family:var(--mw-font-heading);font-size:2rem;font-weight:400}
.count{font-size:.9rem;color:var(--soft)}
.mw-admin-side a[aria-current=page]{color:var(--slate);font-weight:600}
.mw-table{font-size:.95rem}
.grid-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;max-width:none}
.grid-form .mw-row-actions{grid-column:1/-1}

/* == Small screens == */
@media (max-width:960px){
  .first-in{grid-template-columns:1fr;min-height:0}
  .split,.proof-grid,.price-card{grid-template-columns:1fr}
  .steps4{grid-template-columns:1fr 1fr}
  .foot{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .wrow{grid-template-columns:1fr 1.4fr .8fr .8fr;padding:.9rem 1rem;font-size:.9rem}
  .wrow span:nth-child(3){display:none}
  .wcols,.window-head,.window-foot{padding-left:1rem;padding-right:1rem}
  .steps4,.foot{grid-template-columns:1fr}
  .ledger li{grid-template-columns:3rem 1fr}
  .photo img{aspect-ratio:1/1}
}
@media (max-width:640px){
  .mw-appbar,.mw-appbar-in,.mw-appbar-end{max-width:100%}
  .mw-appbar-in{flex-wrap:wrap}
  .mw-appbar-end{flex-wrap:wrap;gap:.5rem 1rem;max-width:100%}
  .mw-admin{grid-template-columns:minmax(0,1fr);max-width:100%}
  .mw-admin>*,.mw-admin-main,.mw-admin-side,.mw-panel,.mw-table-wrap{max-width:100%;min-width:0}
  .mw-table-wrap{overflow-wrap:anywhere}
  .mw-table th,.mw-table td{overflow-wrap:anywhere;white-space:normal}
  .mw-page-head{flex-wrap:wrap}
}