@font-face{font-family:'Nunito';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/nunito-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Nunito';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/nunito-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Nunito';font-style:normal;font-weight:900;font-display:swap;src:url(/fonts/nunito-latin-900-normal.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/nunito-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/nunito-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/nunito-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Caveat';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/caveat-latin-600-normal.woff2) format('woff2')}
:root{
  --ink:#141414; --grey:#848386; --text-grey:#55545a; --white:#ffffff; --soft:#f3f2f2;
  --peach:#ffe9d8; --peach-deep:#fbcfa8; --orange:#ED6D00; --orange-text:#b04b00; --line:#e1dfdf;
  --display:'Nunito',system-ui,sans-serif; --body:'Nunito Sans',system-ui,sans-serif; --hand:'Caveat',cursive;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--white);color:var(--ink);font:400 18px/1.65 var(--body);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1120px;margin:0 auto;padding-inline:max(20px,env(safe-area-inset-left,0px))}
h1,h2,h3{font-family:var(--display);line-height:1.1;text-wrap:balance}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px}

.top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:18px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:900 17px/1 var(--display);letter-spacing:.08em}
.brand img{height:38px;width:auto}
.brand small{display:block;margin-top:5px;font:600 10px/1 var(--body);letter-spacing:.4em;color:#848386}
.call{display:flex;align-items:center;gap:18px;font:700 16px var(--display)}
.call span{color:var(--text-grey);font:400 15px var(--body)}
.btn{display:inline-block;background:var(--orange);color:var(--ink);font:800 17px/1 var(--display);padding:17px 26px;border-radius:16px;text-decoration:none;border:0;cursor:pointer}
.btn:hover{background:#ff8420}
.call .btn{padding:12px 18px;font-size:15px;border-radius:12px}

.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;padding-block:36px 72px}
.hero h1{font-size:clamp(36px,5.2vw,64px);font-weight:900;letter-spacing:-.015em}
.hero p.lead{font-size:21px;color:var(--text-grey);margin-top:22px;max-width:30em}
.cta{display:flex;align-items:center;gap:20px;margin-top:34px;flex-wrap:wrap}
.note{font:600 26px/1 var(--hand);color:var(--orange-text);display:flex;align-items:center;gap:8px;transform:rotate(-3deg)}
.note svg{width:44px;height:24px}
.hero .art{background:var(--peach);border-radius:44% 56% 52% 48% / 52% 46% 54% 48%;padding:28px 20px 12px}

h2.sec{font-size:clamp(28px,3.8vw,46px);font-weight:900;letter-spacing:-.01em}
.lead2{font-size:20px;color:var(--text-grey);margin-top:14px;max-width:34em}

.talk{background:var(--soft);border-radius:36px;padding:72px 56px}
.thread{display:grid;gap:14px;margin-top:44px;max-width:820px}
.msg{display:flex;gap:14px;align-items:flex-end;max-width:min(100%,620px)}
.msg.q{justify-self:start}
.msg.a{justify-self:end;flex-direction:row-reverse}
.who{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font:800 13px var(--display)}
.q .who{background:#fff;color:var(--text-grey);border:2px solid var(--line)}
.a .who{background:var(--ink)}
.a .who img{width:20px}
.bubble{padding:16px 22px;font-size:18px;line-height:1.5}
.q .bubble{background:#fff;border-radius:24px 24px 24px 6px;font-weight:600}
.a .bubble{background:var(--peach);border-radius:24px 24px 6px 24px}
.pair{display:grid;gap:10px;margin-top:6px}

.road{margin-top:52px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;position:relative;list-style:none;padding:0}
.road::before{content:"";position:absolute;left:28px;right:28px;top:27px;border-top:3px dashed var(--peach-deep)}
.road li{position:relative}
.road .n{position:relative;width:56px;height:56px;border-radius:50%;background:var(--orange);color:var(--ink);display:grid;place-items:center;font:900 22px var(--display);box-shadow:0 0 0 8px #fff}
.road h3{font-size:22px;font-weight:800;margin:18px 0 8px}
.road p{color:var(--text-grey);font-size:17px}

.fit{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px}
.fit>div{border-radius:28px;padding:36px}
.fit .yes{background:var(--peach)}
.fit .no{background:var(--soft)}
.fit h3{font-size:24px;font-weight:900;margin-bottom:18px}
.fit ul{list-style:none;padding:0;display:grid;gap:12px}
.fit li{padding-left:30px;position:relative}
.fit li::before{content:"";position:absolute;left:0;top:.35em;width:18px;height:18px;border-radius:50%;background:var(--orange)}
.fit li::after{content:"";position:absolute;left:6px;top:.55em;width:4px;height:8px;border:solid var(--ink);border-width:0 2.5px 2.5px 0;transform:rotate(40deg)}
.fit .no li::before{background:var(--grey)}
.fit .no li::after{border-color:#fff}

.you{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center;margin-top:0}
.avatar{width:150px;height:150px;border-radius:50%;background:var(--peach);display:grid;place-items:center}
.you h3{font-size:26px;font-weight:900}
.you p{color:var(--text-grey);margin-top:8px;max-width:36em}

.contact{background:var(--ink);color:#fff;border-radius:36px;padding:72px 56px}
.contact h2.sec{max-width:12em}
.letter{margin-top:36px;font:700 clamp(22px,2.8vw,32px)/2.1 var(--display);max-width:880px}
.letter input,.letter select{font:700 inherit;font-family:var(--display);font-size:inherit;color:var(--peach);background:transparent;border:0;border-bottom:3px solid var(--orange);padding:0 6px;width:min(100%,13em);border-radius:0;margin-inline:4px}
.letter select{width:auto;max-width:100%;color:var(--peach)}
.letter select option{color:#141414}
.letter input::placeholder{color:#8b8a8f;font-weight:600}
.letter input:focus,.letter select:focus{outline:none;border-bottom-color:#fff}
.chk{display:flex;gap:12px;align-items:flex-start;font:400 14px/1.5 var(--body);color:#c9c8cc;margin-top:18px;max-width:560px}
.chk input{width:20px;height:20px;margin-top:2px;accent-color:var(--orange);flex:none}
.send{margin-top:26px;display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.send .or{color:#c9c8cc;font-size:16px}
.opt{display:grid;gap:6px;margin-top:10px;max-width:420px;font:600 15px var(--body);color:#c9c8cc}
.opt input{font:400 17px var(--body);color:#fff;background:#1d1d1f;border:2px solid #4b4b50;border-radius:12px;padding:12px 14px;width:100%}
.opt input:focus{outline:none;border-color:var(--orange)}
.chk a{color:#fff}
.btn[disabled]{opacity:.6;cursor:default}
.ok{margin-top:18px;border-left:5px solid var(--orange);background:#222;padding:12px 16px;border-radius:6px;font-size:16px}
.ok.bad{border-left-color:#ff6a5f}

footer{color:var(--text-grey);font-size:14px;padding-block:32px}
footer .wrap{display:flex;gap:24px;justify-content:space-between;flex-wrap:wrap}
footer a{margin-right:18px}
footer a:hover{color:var(--ink)}
section{padding-block:72px 0}
section:first-of-type{padding-top:0}

.svc{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;margin-top:40px}
.svc-list{list-style:none;padding:36px;margin:0;background:var(--peach);border-radius:28px;display:grid;gap:14px;font-weight:600}
.svc-list li,.you-do li{padding-left:34px;position:relative}
.svc-list li::before,.you-do li::before{content:"";position:absolute;left:0;top:.3em;width:20px;height:20px;border-radius:50%;background:var(--orange)}
.svc-list li::after,.you-do li::after{content:"";position:absolute;left:7px;top:.5em;width:4px;height:9px;border:solid var(--ink);border-width:0 2.5px 2.5px 0;transform:rotate(40deg)}
.you-do{background:var(--ink);color:#fff;border-radius:28px;padding:36px}
.you-do h3{font-size:24px;font-weight:900;margin-bottom:18px}
.you-do ul{list-style:none;padding:0;display:grid;gap:14px}
.you-do li::before{background:var(--grey)}
.you-do li::after{border-color:#fff}
@media (max-width:900px){.svc{grid-template-columns:1fr}.svc-list,.you-do{padding:26px}}
@media (max-width:900px){
  .call span{display:none}
  .hero{grid-template-columns:1fr;padding-block:20px 48px}
  .hero .art{order:-1;max-width:420px;margin-inline:auto;padding:20px 14px 6px}
  .talk,.contact{padding:44px 22px;border-radius:26px}
  .road{grid-template-columns:1fr;gap:26px}
  .road::before{left:27px;right:auto;top:28px;bottom:28px;border-top:0;border-left:3px dashed var(--peach-deep)}
  .road li{padding-left:76px;min-height:56px}
  .road .n{position:absolute;left:0;top:0}
  .road h3{margin-top:0}
  .fit{grid-template-columns:1fr}
  .fit>div{padding:26px}
  .you{grid-template-columns:1fr;justify-items:start}
  .avatar{width:110px;height:110px}
  section{padding-block:52px 0}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.legal{max-width:780px;margin:0 auto;padding:24px max(20px,env(safe-area-inset-left,0px)) 72px}
.legal h1{font-size:clamp(32px,4.4vw,48px);font-weight:900;margin-bottom:28px}
.legal h2{font-size:22px;font-weight:800;margin:36px 0 10px}
.legal p,.legal li{color:var(--text-grey);margin-top:10px}
.legal ul{padding-left:22px}
.legal a{color:var(--orange-text)}
.legal .ph{color:var(--orange-text);font-weight:700}
.legal .upd{font-size:15px;margin-top:-14px}
.thanks{max-width:640px;margin:0 auto;padding:72px max(20px,env(safe-area-inset-left,0px));text-align:center}
.thanks h1{font-size:clamp(32px,4.4vw,48px);font-weight:900}
.thanks p{color:var(--text-grey);margin:16px 0 28px}
.hp{display:none}
.soon{margin-top:28px;max-width:560px;font-size:20px;line-height:1.6;color:#e6e5e9;border-left:5px solid var(--orange);padding-left:20px}
