:root{--ink:#24205e;--navy:#25206b;--mint:#8cd6c2;--paper:#faf9f5;--line:#e0e0da;--muted:#646471;--sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--serif:Georgia,"Times New Roman",serif;color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.55;scroll-behavior:smooth;scroll-padding-top:90px}
*{box-sizing:border-box}
body{margin:0;background:var(--paper)}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer;border:0}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:3px solid #159a7d;outline-offset:5px}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p{margin:0}
h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.05em;line-height:1.05}
h2{font-size:clamp(2.1rem,3.6vw,3.3rem)}
em{font-weight:400}
h3{font-size:1.1rem;line-height:1.35}

.skip{position:fixed;left:20px;top:-80px;background:#fff;padding:12px;z-index:99}
.skip:focus{top:12px}

.site-header{height:88px;padding:0 max(4.7vw,20px);display:flex;align-items:center;gap:32px;background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}
.brand img{border-radius:50%;width:42px;height:42px}
.brand span{display:flex;flex-direction:column;line-height:1}
.brand small{font-size:.68rem;letter-spacing:.24em;font-weight:700;margin-bottom:5px;color:var(--muted)}
.brand strong{font:400 1.55rem/1 var(--serif);letter-spacing:-.04em}
.site-header nav{display:flex;gap:28px;margin:auto;font-size:.88rem}
.site-header nav a{padding:12px 0}
.site-header nav a:hover{color:#16896f}

.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;padding:15px 22px;font-size:.93rem;font-weight:600;line-height:1.4;border-radius:6px;min-height:48px;transition:background .2s,transform .2s}
.button:hover{transform:translateY(-2px)}
.mint{background:var(--mint);color:#162d31}
.mint:hover{background:#aaead9}
.dark{background:var(--navy);color:#fff}
.dark:hover{background:#373086}

.hero{background:var(--navy);color:#faf7ed;overflow:hidden}
.hero-inner{max-width:1320px;margin:auto;padding:70px 5.2% 60px;display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
.eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.16em;line-height:1.5;text-transform:uppercase}
.hero .eyebrow{color:#b2e5d8;display:flex;align-items:center;gap:12px}
.small-line{height:1px;width:30px;background:currentColor}
.hero h1{font-size:clamp(2.5rem,4.4vw,3.7rem);margin:22px 0 20px;letter-spacing:-.05em;line-height:1.08}
.hero h1 em{color:var(--mint);font-style:normal}
.hero-description{max-width:420px;font-size:1.03rem;color:#deddea;line-height:1.7;margin-bottom:28px}
.hero-meta{font-size:.82rem;color:#d2d0e6;margin-top:22px;line-height:1.8}
.hero-visual{border-radius:10px;overflow:hidden;box-shadow:12px 16px 0 #ffffff10,0 30px 60px #0f0b3d70}
.hero-visual img{width:100%;display:block}

.benefit-strip{display:flex;justify-content:space-around;gap:16px;padding:24px 5%;border-bottom:1px solid var(--line);background:#f0f0e8;font-size:.86rem;flex-wrap:wrap}
.benefit-strip span{display:flex;align-items:baseline;gap:10px;white-space:nowrap}
.benefit-strip b{font-size:.72rem;font-weight:500;color:#6a847e}

.section{max-width:1320px;margin:auto;padding:76px 5.2% 10px}
.section-top{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:44px;flex-wrap:wrap}
.section-top h2{margin-top:14px}
.section-top>p{font-size:.95rem;color:var(--muted);max-width:340px;padding-bottom:3px}

.method-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;padding-bottom:80px}
.method-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:26px 24px}
.method-card span{font-family:var(--serif);font-size:1.5rem;color:#8a8730}
.method-card h3{margin:16px 0 10px}
.method-card p{font-size:.9rem;color:var(--muted);line-height:1.6}

.how-section{max-width:1250px;margin:15px auto 80px;padding:58px 60px;display:grid;grid-template-columns:1fr 1.15fr;gap:70px;background:#e4eee8;border-radius:14px}
.how-heading h2{margin:16px 0 20px}
.how-heading>p:last-child{max-width:310px;color:#52695f;font-size:.95rem}
.steps article{display:flex;gap:22px;padding:0 0 26px;margin-bottom:24px;border-bottom:1px solid #c5d4cb}
.steps article:last-child{margin:0;padding:0;border:0}
.steps article>span{font-family:var(--serif);font-size:1.3rem;color:#668575;padding-top:2px}
.steps h3{margin-bottom:6px}
.steps p{color:#53635c;font-size:.9rem;margin-top:8px;line-height:1.6}

.about-section{max-width:1180px;margin:auto;display:grid;grid-template-columns:1fr 1.1fr;gap:90px;padding:10px 5.2% 85px}
.about-section h2{margin-top:16px}
.about-section>div>p:not(.eyebrow){margin-bottom:16px;color:var(--muted);font-size:1rem;line-height:1.7}
.about-section .educational-note{font-size:.78rem!important;margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}

.contact-section{background:var(--navy);color:var(--paper);padding:52px max(6.5vw,20px);display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}
.contact-section .eyebrow{color:var(--mint)}
.contact-section h2{font-size:2.3rem;margin:10px 0 12px}
.contact-section p:last-child{font-size:.9rem;color:#d2d0e2;max-width:460px}
.contact-email{font-size:clamp(1rem,1.7vw,1.5rem);white-space:nowrap;border-bottom:1px solid #8581aa;padding-bottom:9px;letter-spacing:-.02em}
.contact-email span{margin-left:14px;color:var(--mint)}

footer{padding:34px max(4.7vw,20px);display:flex;align-items:flex-start;justify-content:space-between;gap:28px;flex-wrap:wrap;border-top:1px solid var(--line)}
.footer-legal{display:flex;flex-direction:column;gap:8px;max-width:640px}
.footer-legal p{font-size:.78rem;color:var(--muted);line-height:1.6}
.footer-copyright{font-weight:650;color:var(--ink)!important}
.footer-tagline{font-weight:600;color:var(--ink)!important}
.footer-legal a{text-decoration:underline}
footer nav{display:flex;gap:20px;font-size:.8rem;flex-shrink:0}
footer nav a:hover{color:var(--ink)}

@media(max-width:880px){
  .hero-inner{grid-template-columns:1fr;padding-top:44px}
  .hero-visual{order:-1}
  .method-grid{grid-template-columns:1fr 1fr}
  .how-section{grid-template-columns:1fr;padding:40px 26px;gap:30px}
  .about-section{grid-template-columns:1fr;gap:20px}
  .site-header nav{display:none}
}
@media(max-width:520px){
  .method-grid{grid-template-columns:1fr}
  .benefit-strip{justify-content:flex-start;flex-direction:column;gap:10px}
}
