:root{
  color-scheme:light;
  --ink:#132033;--mut:#51606F;--paper:#F7F5F0;--card:#FFFFFF;
  --brand:#21479E;--brand-dark:#183576;--tint:#E8EDF8;
  --line:#D9D6CD;--amber:#F2B134;--ok:#1C7A55;--no:#A23B2A;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --serif:Georgia,'Times New Roman',serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}
.wrap{max-width:68rem;margin:0 auto;padding:0 16px}
@media (min-width:48rem){.wrap{padding:0 2rem}}
a{color:var(--brand)}
a:focus-visible,summary:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:2px}
h1,h2,h3{line-height:1.15;text-wrap:balance}
h1,h2{font-family:var(--serif);font-weight:700;letter-spacing:-.01em}
h1{font-size:clamp(2.2rem,6vw,3.7rem);margin:0 0 .4em}
h2{font-size:clamp(1.6rem,3.5vw,2.2rem);margin:0 0 .5em}
h3{font-size:1.1rem;margin:0 0 .3em}
p{margin:0 0 1em}
small,.note{font-size:.88rem;color:var(--mut)}
section{padding:3.5rem 0;border-top:1px solid var(--line)}
.lead{font-size:1.15rem;max-width:38rem}

.top{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:1rem;padding-bottom:1rem}
.logo{font-weight:700;color:var(--ink);text-decoration:none}
.top a.lang{font-weight:600;text-decoration:none;padding:.5rem 0}

.hero{display:grid;gap:2.5rem;align-items:center;padding:2rem 0 4rem}
@media (min-width:56rem){.hero{grid-template-columns:1.15fr .85fr}}
.cta{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.4rem 0 1rem}
.btn{display:inline-block;padding:.8em 1.3em;border-radius:6px;border:2px solid var(--brand);background:var(--brand);color:#fff;font-weight:600;text-align:center;text-decoration:none;transition:background .15s,border-color .15s}
.btn:hover{background:var(--brand-dark);border-color:var(--brand-dark)}
.btn.alt{background:transparent;color:var(--brand)}
.btn.alt:hover{background:var(--tint);border-color:var(--brand)}

.mail{background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 30px -18px rgba(19,32,51,.45);min-width:0}
.mail header{padding:.9rem 1.1rem;border-bottom:1px solid var(--line);font-size:.9rem}
.mail header b{display:block;font-size:1rem}
.mail dl{margin:0;padding:1rem 1.1rem}
.mail dt{font-size:.8rem;color:var(--mut);margin-top:.7rem}
.mail dt:first-child{margin-top:0}
.mail dd{margin:0;font:600 .88rem/1.4 var(--mono);overflow-wrap:anywhere}
.mail footer{padding:.8rem 1.1rem;background:var(--tint);border-radius:0 0 8px 8px;font-size:.88rem}

.steps{list-style:none;counter-reset:s;margin:1.5rem 0 0;padding:0;display:grid;gap:1.5rem}
@media (min-width:48rem){.steps{grid-template-columns:repeat(4,1fr)}}
.steps li{counter-increment:s;border-top:3px solid var(--brand);padding-top:.8rem}
.steps li::before{content:counter(s);display:block;font:700 1.6rem/1 var(--serif);color:var(--brand);margin-bottom:.5rem}
.steps time{display:block;font-size:.85rem;color:var(--mut)}

.feats{display:grid;gap:1.5rem 2rem;margin-top:1.5rem}
@media (min-width:40rem){.feats{grid-template-columns:repeat(2,1fr)}}
@media (min-width:60rem){.feats{grid-template-columns:repeat(3,1fr)}}
.feats p{margin:0;color:var(--mut);font-size:.97rem}

.plans{display:grid;gap:1rem;margin-top:1.5rem}
@media (min-width:52rem){.plans{grid-template-columns:repeat(3,1fr)}}
.plan{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:1.4rem}
.plan .price{font:700 2.1rem/1.1 var(--serif);margin:.2rem 0 .1rem}
.plan .price span{font:400 1rem var(--serif);color:var(--mut)}
.plan .disk{font-weight:600;margin:.8rem 0 .2rem}
.plan .for{color:var(--mut);font-size:.95rem;flex:1}
.plan .btn{display:block;margin-top:.5rem}

.compare{width:100%;border-collapse:collapse;margin-top:1.2rem;background:var(--card);border:1px solid var(--line)}
.compare th,.compare td{padding:.7rem .9rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);font-size:.95rem}
.compare thead th{background:var(--ink);color:#fff}
.compare tbody th{font-weight:600}
.compare tr:last-child>*{border-bottom:0}
@media (max-width:40rem){
  .compare thead{position:absolute;left:-9999px}
  .compare tr{display:block;padding:.7rem .9rem;border-bottom:1px solid var(--line)}
  .compare tr:last-child{border-bottom:0}
  .compare th,.compare td{display:block;padding:.1rem 0;border:0}
  .compare td::before{content:attr(data-l) ": ";color:var(--mut)}
}

.fit{display:grid;gap:2rem;margin-top:1.2rem}
@media (min-width:48rem){.fit{grid-template-columns:1fr 1fr}}
.fit ul{margin:0;padding:0;list-style:none}
.fit li{position:relative;padding:0 0 .7rem 1.6rem}
.fit li::before{position:absolute;left:0;top:0;font-weight:700}
.fit .yes li::before{content:"✓";color:var(--ok)}
.fit .nope li::before{content:"✕";color:var(--no)}

details{border-top:1px solid var(--line);padding:.9rem 0}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-weight:600}
details p{margin:.6rem 0 0;max-width:46rem}

.final{text-align:center}
.final .cta{justify-content:center}
.site-foot{color:var(--mut);font-size:.87rem;padding-top:2rem;padding-bottom:3rem;border-top:1px solid var(--line)}
