:root{
  --ground:#F5F2EA;--paper:#FFFFFF;--ink:#17201B;--body:#454C46;--muted:#545B55;
  --line:#DCD6C8;--line-soft:#ECE7DA;--accent:#1E4A38;--accent-dark:#12301F;--accent-soft:#F1F5F1;
  --serif:'Newsreader',Georgia,serif;--sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --gutter:120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,p,ul{margin:0}
a{color:var(--accent)}a:hover{color:var(--accent-dark)}
img{max-width:100%}
.wrap{max-width:1440px;margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;background:#fff;padding:8px 12px;z-index:10}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

/* type */
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.display{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;line-height:1.08}
.h1{font-size:68px;line-height:1.04;letter-spacing:-.02em}
.h2{font-size:52px}
.h2s{font-size:44px;line-height:1.1}
.lead{font-size:20px;line-height:1.55;color:var(--body)}
.body{font-size:18px;line-height:1.6;color:var(--body)}
.small{font-size:14px;color:var(--muted)}
em.i{font-style:italic}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 26px;border-radius:6px;background:var(--accent);color:#fff;text-decoration:none;font-size:16px;font-weight:500;border:0;font-family:inherit;cursor:pointer}
.btn:hover{background:var(--accent-dark);color:#fff}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}
.btn-light{background:var(--ground);color:var(--ink)}
.btn-light:hover{background:#fff;color:var(--ink)}
.btn-sm{min-height:44px;padding:0 20px;font-size:15px}

/* header */
.site-header{border-bottom:1px solid var(--line)}
.site-header .wrap{height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand-text{display:flex;flex-direction:column;gap:2px}
.brand-name{font-family:var(--serif);font-size:24px;font-weight:500;letter-spacing:-.01em;line-height:1.1}
.brand-tag{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.nav{display:flex;align-items:center;gap:36px;font-size:15px}
.nav a:not(.btn){color:var(--ink);text-decoration:none}
.nav a:not(.btn):hover{text-decoration:underline}

/* hero */
.hero{padding-top:88px;padding-bottom:96px;display:grid;grid-template-columns:560px 1fr;gap:72px;align-items:center}
.hero-copy{display:flex;flex-direction:column;gap:28px}
.actions{display:flex;flex-wrap:wrap;gap:12px}

.inbox{background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:0 1px 0 var(--line),0 24px 48px -28px rgba(23,32,27,.35);overflow:hidden}
.inbox-head{height:52px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line-soft)}
.inbox-head strong{font-size:14px}
.inbox-head span{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.row{padding:14px 20px;display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--line-soft);background:#FBFAF6}
.row.unread{background:var(--paper)}
.dot{width:8px;height:8px;border-radius:4px;background:var(--line);flex-shrink:0}
.unread .dot{background:var(--accent)}
.row-text{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.row-text b{font-size:14px;font-weight:500}.unread .row-text b{font-weight:600}
.row-text span{font-size:13px;color:var(--muted)}
.tag{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap}
.tag-green{background:#E3EBE4;color:#1E4A38}.tag-sand{background:#ECE7DA;color:#4A4536}.tag-clay{background:#F6E4DA;color:#8F3A17}
.draft{padding:20px;display:flex;flex-direction:column;gap:14px}
.draft-label{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.draft-body{padding:16px 18px;border:1px solid var(--line-soft);border-radius:8px;background:#FBFAF6;font-size:14px;line-height:1.6;display:flex;flex-direction:column;gap:10px}
.draft-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.fake-btns{display:flex;gap:8px}
.fake-btn{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:6px;font-size:14px;font-weight:500;border:1px solid var(--line);background:#fff}
.fake-btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}

/* strip */
.strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.strip > div{padding:32px;display:flex;flex-direction:column;gap:8px;border-right:1px solid var(--line)}
.strip > div:first-child{padding-left:0}.strip > div:last-child{padding-right:0;border-right:0}
.strip h3{font-family:var(--serif);font-size:24px;font-weight:500}
.strip p{font-size:16px;color:var(--body)}

/* sections */
.section{padding-top:120px;padding-bottom:112px}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:64px;margin-bottom:56px}
.section-head h2{max-width:560px}
.section-head p{max-width:480px;font-size:18px;line-height:1.55;color:var(--body)}

.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.card{padding:28px;background:var(--paper);border:1px solid var(--line);border-radius:10px;display:flex;flex-direction:column;gap:14px}
.num{font-family:var(--serif);font-size:44px;line-height:1;color:var(--accent)}
.card h3{font-size:19px;font-weight:600}
.card p{font-size:15px;line-height:1.55;color:var(--body)}
.note{margin-top:24px;display:flex;align-items:center;gap:16px;padding:20px 24px;border:1px solid var(--line);border-radius:10px;font-size:17px}
.note svg{flex-shrink:0}

.band{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.split{display:grid;grid-template-columns:440px 1fr;gap:96px}
.split h2{margin-bottom:32px}
.ticks{list-style:none;padding:0}
.ticks li{padding:16px 0;border-top:1px solid var(--line);display:flex;gap:14px;align-items:baseline;font-size:17px}
.ticks li:last-child{border-bottom:1px solid var(--line)}
.ticks svg{flex-shrink:0;transform:translateY(2px)}
.compare{width:100%;border-collapse:collapse;font-size:16px}
.compare th,.compare td{text-align:left;vertical-align:top}
.compare thead th{padding:0 16px 14px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.compare thead th:first-child{padding-left:0}
.compare thead th.us{color:var(--accent);background:var(--accent-soft);border-radius:8px 8px 0 0}
.compare tbody th{padding:18px 16px 18px 0;border-top:1px solid var(--line);font-weight:600;width:28%}
.compare tbody td{padding:18px 16px;border-top:1px solid var(--line);color:var(--body)}
.compare tbody td.us{background:var(--accent-soft);color:var(--ink)}
.compare tbody tr:last-child > *{border-bottom:1px solid var(--line)}

.price{display:grid;grid-template-columns:440px 1fr;border:1px solid var(--ink);border-radius:10px;overflow:hidden;background:var(--paper)}
.price-main{padding:48px;background:var(--accent);color:var(--ground);display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.price-main .eyebrow{color:var(--ground)}
.price-figure{display:flex;align-items:baseline;gap:10px}
.price-figure b{font-family:var(--serif);font-weight:400;font-size:80px;line-height:1;letter-spacing:-.02em}
.price-main .btn{margin-top:20px}
.price-list{padding:48px 56px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 48px;align-content:center}
.price-list p{display:flex;gap:12px;font-size:16px}
.price-list svg{flex-shrink:0;margin-top:3px}

.trust{border-top:1px solid var(--line);padding-top:56px}
.trust h2{margin-bottom:40px}
.trust-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}
.trust-grid h3{font-size:18px;font-weight:600;margin-bottom:10px}
.trust-grid p{font-size:16px;line-height:1.55;color:var(--body)}

.about{display:grid;grid-template-columns:240px 1fr;gap:64px;padding:56px;background:var(--paper);border:1px solid var(--line);border-radius:10px}
.portrait{width:240px;height:280px;border-radius:8px;background:var(--line-soft);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:72px;color:var(--accent)}
.about-copy{display:flex;flex-direction:column;gap:20px}
.about-copy .body{max-width:760px}
.facts{display:flex;flex-wrap:wrap;gap:48px;margin-top:8px;padding-top:24px;border-top:1px solid var(--line)}
.facts div{display:flex;flex-direction:column;gap:4px}
.facts b{font-family:var(--serif);font-weight:400;font-size:40px;line-height:1;color:var(--accent)}
.facts span{font-size:15px;color:var(--body)}

.contact{background:var(--ink);color:var(--ground)}
.contact .wrap{padding-top:112px;padding-bottom:48px}
.contact-main{display:flex;justify-content:space-between;align-items:flex-end;gap:64px;margin-bottom:96px}
.contact-main h2{font-size:60px;line-height:1.05;letter-spacing:-.02em;margin-bottom:20px}
.contact-main p{font-size:19px;line-height:1.55;color:#C9CCC4;max-width:640px}
.contact-cta{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.contact a.mail{color:var(--ground);font-size:17px}
.site-footer{padding-top:28px;border-top:1px solid #3A443D;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:14px;color:#C9CCC4}
.site-footer a{color:#C9CCC4}.site-footer a:hover{color:#fff}

/* privacy page */
.doc{max-width:760px;margin:0 auto;padding:80px 24px 120px}
.doc h1{font-family:var(--serif);font-weight:400;font-size:52px;line-height:1.08;letter-spacing:-.015em;margin-bottom:12px}
.doc h2{font-family:var(--serif);font-weight:500;font-size:28px;margin:48px 0 14px}
.doc p,.doc li{font-size:17px;line-height:1.65;color:var(--body)}
.doc p + p{margin-top:14px}
.doc ul{padding-left:22px;margin-top:10px}
.doc li + li{margin-top:6px}
.doc table{width:100%;border-collapse:collapse;margin-top:14px;font-size:15px}
.doc th,.doc td{text-align:left;padding:10px 12px 10px 0;border-top:1px solid var(--line);vertical-align:top;color:var(--body)}
.doc th{color:var(--ink);font-weight:600}
.dark-footer{background:var(--ink)}
.dark-footer .wrap{padding-top:28px;padding-bottom:28px}
.dark-footer .site-footer{border-top:0;padding-top:0}

/* responsive */
@media (max-width:1200px){
  :root{--gutter:48px}
  .hero{grid-template-columns:1fr 1fr;gap:48px}
  .h1{font-size:56px}
  .split{grid-template-columns:1fr;gap:64px}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .price{grid-template-columns:1fr}
}
@media (max-width:860px){
  :root{--gutter:20px}
  .nav a:not(.btn){display:none}
  .site-header .wrap{height:72px}
  .brand-name{font-size:20px}
  .hero{grid-template-columns:1fr;padding-top:48px;padding-bottom:64px;gap:48px}
  .h1{font-size:42px}
  .h2{font-size:36px}.h2s{font-size:32px}
  .lead{font-size:18px}
  .strip{grid-template-columns:1fr}
  .strip > div,.strip > div:first-child,.strip > div:last-child{padding:24px 0;border-right:0;border-bottom:1px solid var(--line)}
  .strip > div:last-child{border-bottom:0}
  .section{padding-top:72px;padding-bottom:72px}
  .section-head{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:32px}
  .steps{grid-template-columns:1fr}
  .note{align-items:flex-start;font-size:16px}
  .compare{font-size:14px}
  .compare thead th,.compare tbody td{padding-left:10px;padding-right:10px}
  .compare tbody th{width:30%}
  .price-main,.price-list{padding:32px 24px}
  .price-figure b{font-size:60px}
  .price-list{grid-template-columns:1fr}
  .trust-grid{grid-template-columns:1fr;gap:28px}
  .about{grid-template-columns:1fr;padding:28px;gap:28px}
  .portrait{width:120px;height:120px;font-size:44px}
  .facts b{font-size:32px}
  .contact .wrap{padding-top:72px}
  .contact-main{flex-direction:column;align-items:flex-start;gap:32px;margin-bottom:64px}
  .contact-main h2{font-size:40px}
  .doc{padding-top:48px}.doc h1{font-size:38px}
  .row{padding:12px 16px}.tag{display:none}
}
