:root {
  --ink:#112d28;
  --forest:#145a4b;
  --pine:#0e4138;
  --paper:#f1f5ef;
  --white:#fff;
  --mist:#e5eee7;
  --line:#cddbd1;
  --sun:#f4c85b;
  --coral:#ef745e;
  --copy:#526d64;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter,Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; }
a:focus-visible { outline:3px solid var(--sun); outline-offset:4px; border-radius:6px; }
.topline { display:flex; align-items:center; justify-content:space-between; gap:20px; max-width:1220px; margin:0 auto; padding:18px 28px; }
.brand { display:flex; align-items:center; gap:11px; color:var(--ink); font-size:14px; font-weight:900; letter-spacing:.12em; text-decoration:none; }
.brand img { width:43px; height:43px; border-radius:14px; }
.topline nav { display:flex; align-items:center; gap:19px; }
.topline nav a { color:#3d5c53; font-size:14px; font-weight:750; text-decoration:none; }
.topline nav a:hover { color:var(--forest); }
.language { display:grid; place-items:center; min-width:42px; min-height:42px; border:1px solid #adc2b5; border-radius:50%; color:var(--forest)!important; font:800 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace!important; letter-spacing:.08em; }
.guide-hero { position:relative; overflow:hidden; color:#fff; background:var(--pine); }
.guide-hero::before { content:""; position:absolute; left:-180px; top:-200px; width:560px; height:560px; border:1px solid #ffffff20; border-radius:50%; box-shadow:0 0 0 48px #ffffff09,0 0 0 96px #ffffff06; }
.guide-hero::after { content:""; position:absolute; right:-130px; bottom:-155px; width:420px; height:420px; border-radius:50%; background:var(--coral); opacity:.92; }
.hero-inner { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1fr) minmax(310px,.7fr); gap:70px; align-items:end; max-width:1220px; margin:0 auto; padding:78px 28px 74px; }
.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 20px; color:#b9d7c9; font-size:12px; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.eyebrow i { width:8px; height:8px; border-radius:50%; background:var(--sun); box-shadow:0 0 0 5px #f4c85b29; }
h1 { max-width:760px; margin:0; font-size:clamp(43px,6.1vw,78px); line-height:.96; letter-spacing:-.07em; }
h1 em { color:var(--sun); font-family:Georgia,serif; font-weight:400; }
.hero-copy { max-width:690px; margin:27px 0 0; color:#c7dbd2; font-size:19px; line-height:1.55; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:53px; border:0; border-radius:27px; padding:0 22px; font-size:15px; font-weight:850; text-align:center; text-decoration:none; transition:transform .18s ease,background .18s ease; }
.button:hover { transform:translateY(-2px); }
.button.primary { color:var(--ink); background:var(--sun); }
.button.secondary { color:#fff; border:1px solid #ffffff5c; background:#ffffff12; }
.hero-note { margin:15px 0 0; color:#a7c3b7; font-size:13px; line-height:1.5; }
.connection-figure { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:center; min-height:236px; padding:25px 19px; border:1px solid #ffffff32; border-radius:28px; background:#ffffff12; backdrop-filter:blur(10px); }
.connection-figure::before { content:""; position:absolute; left:31%; right:31%; top:50%; height:2px; background:repeating-linear-gradient(90deg,var(--sun) 0 8px,transparent 8px 15px); transform:translateY(-50%); }
.device { position:relative; z-index:1; display:grid; place-items:center; gap:9px; min-height:168px; border-radius:22px; color:#fff; background:#123d35; text-align:center; box-shadow:0 18px 36px #061e1935; }
.device i { display:grid; place-items:center; width:58px; height:58px; border-radius:18px; color:var(--pine); background:var(--sun); font-size:27px; font-style:normal; }
.device b { font-size:15px; }.device small { color:#bbd4c8; font-size:12px; }
.figure-link { position:absolute; left:50%; top:calc(50% - 12px); z-index:2; display:grid; place-items:center; width:48px; height:48px; border:2px solid var(--sun); border-radius:50%; color:var(--sun); background:var(--pine); font-size:19px; font-weight:900; transform:translateX(-50%); }
.truth { max-width:1220px; margin:0 auto; padding:52px 28px; }
.truth-card { display:grid; grid-template-columns:78px minmax(0,1fr); gap:21px; border:1px solid var(--line); border-radius:23px; padding:25px; background:var(--white); }
.truth-icon { display:grid; place-items:center; width:64px; height:64px; border-radius:21px; color:var(--forest); background:var(--mist); font-size:30px; }
.truth-card h2 { margin:0 0 7px; font-size:24px; letter-spacing:-.04em; }.truth-card p { max-width:820px; margin:0; color:var(--copy); font-size:16px; line-height:1.55; }
.steps { max-width:1220px; margin:0 auto; padding:30px 28px 90px; }
.section-heading { max-width:720px; margin-bottom:35px; }.section-heading .eyebrow { color:#52776b; }.section-heading h2 { margin:0; font-size:clamp(34px,4.2vw,58px); line-height:1; letter-spacing:-.065em; }.section-heading p { margin:18px 0 0; color:var(--copy); font-size:18px; line-height:1.55; }
.guide-steps { position:relative; display:grid; gap:18px; }.guide-steps::before { content:""; position:absolute; left:39px; top:39px; bottom:39px; width:2px; background:linear-gradient(var(--forest),#b9cfc1 82%,transparent); }
.step { position:relative; display:grid; grid-template-columns:80px minmax(0,1fr) minmax(220px,.42fr); gap:25px; align-items:start; border:1px solid var(--line); border-radius:25px; padding:27px 28px 27px 0; background:var(--white); }
.step-number { position:relative; z-index:1; display:grid; place-items:center; width:56px; height:56px; margin-left:12px; border:7px solid var(--paper); border-radius:50%; color:#fff; background:var(--forest); font:900 18px/1 ui-monospace,SFMono-Regular,Menlo,monospace; }
.step-copy h3 { margin:1px 0 10px; font-size:27px; line-height:1.1; letter-spacing:-.045em; }.step-copy>p { margin:0; color:var(--copy); font-size:16px; line-height:1.55; }
.action-list { display:grid; gap:9px; margin:17px 0 0; padding:0; list-style:none; }.action-list li { position:relative; padding-left:25px; color:#294b41; font-size:16px; font-weight:700; line-height:1.45; }.action-list li::before { content:"✓"; position:absolute; left:0; top:0; color:var(--forest); font-weight:900; }
.step-aside { min-height:100%; border-left:1px solid #dae5de; padding:5px 0 5px 24px; }.step-aside b { display:block; margin-bottom:8px; color:#2d5b4d; font-size:13px; letter-spacing:.08em; text-transform:uppercase; }.step-aside p { margin:0; color:#667d73; font-size:14px; line-height:1.5; }.step-aside strong { color:#23483d; }
.important { border-color:#e8d18e; background:#fffdf4; }.important .step-number { background:var(--coral); }.important .step-aside { border-color:#eadfb7; }
.after { display:grid; grid-template-columns:1fr 1fr; gap:18px; max-width:1220px; margin:0 auto; padding:0 28px 80px; }.after article { border-radius:24px; padding:28px; }.after h2 { margin:0 0 11px; font-size:25px; letter-spacing:-.045em; }.after p { margin:0; font-size:16px; line-height:1.55; }.automatic { color:#fff; background:var(--forest); }.automatic p { color:#c6dbd2; }.trouble { border:1px solid #e1cfc5; background:#fff7f3; }.trouble p { color:#6d625c; }.trouble a { color:#a14a39; font-weight:800; }
.final-cta { max-width:1164px; margin:0 auto 84px; overflow:hidden; border-radius:28px; padding:44px; color:#fff; background:linear-gradient(105deg,#145a4b,#177364); }.final-cta-inner { display:flex; align-items:center; justify-content:space-between; gap:30px; }.final-cta .eyebrow { margin-bottom:13px; color:#b9ded0; }.final-cta h2 { max-width:690px; margin:0; font-size:clamp(29px,3.6vw,47px); line-height:1; letter-spacing:-.06em; }.final-cta h2 em { color:var(--sun); font-family:Georgia,serif; font-weight:400; }.final-cta .button { flex:0 0 auto; }.cta-note { max-width:730px; margin:18px 0 0; color:#c7ded4; font-size:14px; line-height:1.5; }
.privacy-note { max-width:1220px; margin:0 auto; padding:0 28px 40px; color:#667b72; font-size:13px; line-height:1.55; }.privacy-note a { color:var(--forest); font-weight:800; }
footer { border-top:1px solid var(--line); padding:28px; color:#61786e; font-size:13px; }.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:18px; max-width:1164px; margin:0 auto; }.footer-inner a { color:var(--forest); font-weight:800; text-decoration:none; }
@media (max-width:820px) { .topline { padding:14px 20px; }.topline nav a:not(.language) { display:none; }.hero-inner { grid-template-columns:1fr; gap:33px; padding:55px 20px 52px; }.connection-figure { max-width:500px; width:100%; }.truth,.steps { padding-right:20px; padding-left:20px; }.step { grid-template-columns:68px minmax(0,1fr); padding:23px 21px 23px 0; }.step-aside { grid-column:2; border-top:1px solid #dae5de; border-left:0; margin-top:3px; padding:16px 0 0; }.after { grid-template-columns:1fr; padding-right:20px; padding-left:20px; }.final-cta { margin-right:20px; margin-left:20px; }.final-cta-inner { align-items:flex-start; flex-direction:column; }.footer-inner { align-items:flex-start; flex-direction:column; } }
@media (max-width:520px) { .brand { font-size:12px; }.brand img { width:38px; height:38px; }.hero-copy { font-size:17px; }.hero-actions { display:grid; }.button { width:100%; }.connection-figure { gap:15px; min-height:201px; padding:16px; }.device { min-height:145px; border-radius:18px; }.device i { width:50px; height:50px; font-size:23px; }.figure-link { width:42px; height:42px; }.truth-card { grid-template-columns:1fr; gap:12px; padding:21px; }.truth-icon { width:54px; height:54px; border-radius:17px; }.section-heading p { font-size:16px; }.guide-steps::before { left:27px; }.step { grid-template-columns:54px minmax(0,1fr); gap:12px; border-radius:20px; padding:20px 16px 20px 0; }.step-number { width:44px; height:44px; margin-left:5px; border-width:5px; font-size:15px; }.step-copy h3 { margin-top:1px; font-size:22px; }.step-copy>p,.action-list li { font-size:15px; }.step-aside { padding-top:13px; }.final-cta { margin-bottom:54px; padding:27px 22px; }.final-cta .button { width:100%; }.privacy-note { padding-right:20px; padding-left:20px; } }