*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#1c1f26;background:#fafaf8;-webkit-font-smoothing:antialiased}
a{color:inherit}
.top{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:16px clamp(18px,5vw,64px);background:rgba(250,250,248,.88);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid #ecebe6}
.brand{font-weight:700;letter-spacing:.2px;text-decoration:none}
nav a{margin-left:22px;text-decoration:none;color:#555b66;font-size:15px}
nav a:hover{color:var(--accent)}
main{max-width:1080px;margin:0 auto;padding:0 clamp(18px,5vw,40px)}
.hero{padding:clamp(56px,11vw,140px) 0 clamp(40px,7vw,90px)}
.eyebrow{margin:0 0 14px;color:var(--accent);font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase}
h1{margin:0 0 18px;font-size:clamp(34px,6.4vw,64px);line-height:1.08;letter-spacing:-.02em;max-width:18ch}
.lead{max-width:56ch;color:#4a505b;font-size:clamp(17px,2.2vw,20px);margin:0 0 28px}
.btn{display:inline-block;padding:12px 22px;border:0;border-radius:999px;background:var(--accent);color:#fff;font:600 15px/1 inherit;text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.15)}
section{padding:clamp(36px,6vw,72px) 0;border-top:1px solid #ecebe6}
h2{margin:0 0 26px;font-size:clamp(24px,3.4vw,34px);letter-spacing:-.01em}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:26px}
.card h3{margin:14px 0 4px;font-size:18px}
.card p{margin:0;color:#5b616c;font-size:15px}
.thumb{aspect-ratio:4/3;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent2));position:relative;overflow:hidden;transition:transform .25s}
.card:hover .thumb{transform:scale(1.02)}
.thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 20% 10%,rgba(255,255,255,.35),transparent 55%)}
.c2 .thumb{background:linear-gradient(200deg,var(--accent2),#2b2f3a)}
.c3 .thumb{background:linear-gradient(45deg,#2b2f3a,var(--accent))}
.c4 .thumb{background:linear-gradient(160deg,var(--accent),#e9e4d8)}
.c5 .thumb{background:linear-gradient(315deg,var(--accent2),var(--accent))}
.c6 .thumb{background:linear-gradient(95deg,#cfd6dd,var(--accent2))}
.about p{max-width:62ch;color:#3f4550}
.facts{list-style:none;display:flex;flex-wrap:wrap;gap:34px;margin:30px 0 0;padding:0}
.facts strong{display:block;font-size:30px;letter-spacing:-.02em}
.facts span{color:#5b616c;font-size:14px}
form{display:grid;gap:14px;max-width:520px}
label{display:grid;gap:6px;font-size:14px;color:#4a505b}
input,textarea{width:100%;padding:11px 13px;border:1px solid #d9d7cf;border-radius:10px;background:#fff;font:inherit;color:inherit}
input:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
#form-status{min-height:1.4em;margin:0;font-size:14px;color:#3f6b4f}
.foot{display:flex;justify-content:space-between;max-width:1080px;margin:0 auto;padding:30px clamp(18px,5vw,40px) 50px;color:#6b717c;font-size:14px;border-top:1px solid #ecebe6}
@media (max-width:560px){nav a{margin-left:14px}}
@media (prefers-color-scheme:dark){
  body{background:#101216;color:#e8eaee}
  .top{background:rgba(16,18,22,.86);border-bottom-color:#232730}
  nav a,.lead,.about p,.card p,.facts span,.foot,label{color:#a9afbb}
  section,.foot{border-top-color:#232730}
  input,textarea{background:#171a20;border-color:#2b303a;color:#e8eaee}
}
