@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/font-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/font-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/font-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Onest';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/font-3.ttf) format('truetype');
}
@font-face {
  font-family: 'Onest';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/font-4.ttf) format('truetype');
}


/* Layout: one watercolor lake. Sky and name on top, living water below, then quiet paper cards floating on pale water. */
:root{
  --sky-top:#AEBDC8; --sky-mid:#CFD8DD; --sky-low:#EDE6DD; --cloud-warm:#C9A892; --cloud-cool:#F4F2EE; --water-deep:#93A5B1;
  --bg:#F2ECE5; --mist:#F3EDE6; --card:#FBF8F3; --line:#E3D7CC; --ink:#3E3A3A; --soft:#6B5A53;
  --accent:#9C5446; --on-accent:#FFFFFF; --blush:#E8D5C7; --sand:#D9B99A;
  --disp:"Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;
  --body:"Onest", "Segoe UI", system-ui, -apple-system, sans-serif;
  color-scheme:light;
}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}

.lake{position:relative;min-height:clamp(600px,86vh,820px);overflow:hidden;isolation:isolate}
.lake canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:-1;touch-action:pan-y}
.lake-in{position:relative;max-width:1120px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));padding-block:28px 0;display:flex;flex-direction:column;gap:clamp(44px,8vh,90px);pointer-events:none}
.lake-in a,.lake-in button{pointer-events:auto}
.top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.mark{font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.nav{display:flex;gap:22px;flex-wrap:wrap;font-size:14px}
.nav a{text-decoration:none;opacity:.85}
.nav a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.hello{display:flex;flex-direction:column;gap:16px;max-width:680px}
h1{font-family:var(--disp);font-weight:400;font-size:clamp(46px,8vw,92px);line-height:.98;letter-spacing:.01em;margin:0;text-wrap:balance}
.role{font-size:clamp(14px,2vw,17px);letter-spacing:.08em;text-transform:uppercase;margin:0}
.sub{font-family:var(--disp);font-style:italic;font-size:clamp(19px,2.4vw,24px);line-height:1.3;margin:0;max-width:34ch}
.acts{display:flex;gap:14px 22px;align-items:center;flex-wrap:wrap;margin-top:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;border-radius:999px;background:var(--accent);color:var(--on-accent);font:500 16px/1 var(--body);text-decoration:none;border:0;cursor:pointer;box-shadow:0 10px 28px -14px rgba(60,30,20,.55)}
.btn:hover{filter:brightness(1.06)}
.link{font-size:15px;text-underline-offset:4px}
.hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);font-family:var(--disp);font-style:italic;font-size:19px;opacity:.75;transition:opacity 1.2s;pointer-events:none;white-space:nowrap;margin:0}
.hint.gone{opacity:0}

main{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:clamp(56px,9vw,110px) 130px;display:flex;flex-direction:column;gap:clamp(56px,8vw,96px);background:var(--bg);position:relative;isolation:isolate}
#paper{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:-1;pointer-events:none}
.lake::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;background:linear-gradient(180deg,transparent,var(--bg));pointer-events:none}
section{max-width:1040px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:22px}
.eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);margin:0}
h2{font-family:var(--disp);font-weight:400;font-size:clamp(34px,5vw,52px);line-height:1.05;margin:0;text-wrap:balance}
.lead{color:var(--soft);max-width:60ch;margin:0}

.chips{display:flex;flex-wrap:wrap;gap:12px;list-style:none;padding:0;margin:0}
.chips li{padding:14px 22px;border-radius:16px;background:var(--card);border:1px solid var(--line);font-size:17px}

.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none;padding:0;margin:0;counter-reset:s}
.steps li{display:flex;flex-direction:column;gap:8px;padding-top:18px;border-top:1px solid var(--line);min-width:0}
.steps li::before{counter-increment:s;content:counter(s);font-family:var(--disp);font-variant-numeric:lining-nums;font-size:44px;line-height:1;color:var(--accent)}

.paper{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:clamp(22px,4vw,40px)}
.fmt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}
.fmt .paper{display:flex;flex-direction:column;gap:10px;min-width:0}
.fmt h3{font-family:var(--disp);font-weight:500;font-size:28px;line-height:1.1;margin:0}
.fmt p{margin:0;color:var(--soft)}
.fmt .q{font-family:var(--disp);font-style:italic;font-size:21px;line-height:1.25;color:var(--ink)}
.inc-t{font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin-top:6px!important}
.inc{margin:0;padding-left:18px;color:var(--soft);font-size:15px;display:flex;flex-direction:column;gap:4px}
.more{border-top:1px solid var(--line);padding-top:10px;margin-top:4px}
.more summary{cursor:pointer;font-weight:500;color:var(--accent);list-style:none;display:flex;align-items:center;gap:8px;min-height:32px}
.more summary::-webkit-details-marker{display:none}
.more summary::after{content:"+";font-size:20px;line-height:1;transition:transform .2s}
.more[open] summary::after{transform:rotate(45deg)}
.more-in{display:flex;flex-direction:column;gap:8px;padding-top:6px;font-size:15px}
.more-in p{margin:0}
.tag{align-self:flex-start;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;border-radius:999px;background:var(--blush);color:var(--ink)}
.fmt .price{margin-top:auto;padding-top:14px;font-family:var(--disp);font-variant-numeric:lining-nums;font-size:30px;color:var(--ink)}

.about{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:start}
.portrait{aspect-ratio:4/5;width:100%;max-width:100%;height:auto;object-fit:cover;object-position:50% 30%;display:block;border-radius:22px;border:1px solid var(--line);box-shadow:0 24px 50px -30px rgba(80,50,40,.45);
  background:radial-gradient(120% 80% at 30% 20%,var(--sky-mid),transparent 60%),radial-gradient(100% 70% at 80% 90%,var(--sand),transparent 70%),var(--mist)}
.about-text{display:flex;flex-direction:column;gap:18px;min-width:0}
.about-text .lead + .lead{margin-top:-6px}
dl{margin:8px 0 0;display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr)}
dt,dd{margin:0;padding:14px 0;border-top:1px solid var(--line)}
dt{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);padding-right:16px}
dd ul{margin:0;padding-left:18px}

.final{display:flex;flex-direction:column;gap:26px}
.contacts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ct{display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:16px;background:var(--bg);border:1px solid var(--line);min-width:0}
.ct-name{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}
.ct-val{font-size:18px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;user-select:all}
.ct-go{margin-top:8px;min-height:46px;padding:0 18px;font-size:15px;width:100%}
.ct-go[aria-disabled="true"]{opacity:.45;pointer-events:none}
.final h2{font-size:clamp(34px,4.6vw,48px)}
.final p{margin:8px 0 0;color:var(--soft)}
footer{max-width:1040px;margin:0 auto;width:100%;color:var(--soft);font-size:14px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:24px;border-top:1px solid var(--line)}

.float{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:20;min-height:48px;padding:0 22px;font-size:15px}

@media (max-width:760px){
  .nav{display:none}
  .steps,.fmt{grid-template-columns:minmax(0,1fr)}
  .about{grid-template-columns:minmax(0,1fr)}
  .portrait{max-width:340px}
  dl{grid-template-columns:minmax(0,1fr)}
  dt{padding-bottom:4px}
  dd{border-top:0;padding-top:0}
  .contacts{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion: reduce){ .hint{display:none} }

html{scroll-behavior:smooth;scroll-padding-top:24px}img{max-width:100%}a,button{-webkit-tap-highlight-color:transparent}.nav a{display:inline-flex;align-items:center;min-height:44px}.more summary{min-height:44px}.hint{z-index:1}.btn{transition:filter .2s,box-shadow .2s}.contacts .ct-val{font-size:17px}.contacts .ct-go{padding-inline:10px;font-size:14px}.skip{position:fixed;top:12px;left:12px;transform:translateY(-180%);z-index:30;background:var(--card);padding:12px 18px;border-radius:10px}.skip:focus{transform:none}footer a{min-height:44px;display:inline-flex;align-items:center;text-underline-offset:4px}section{scroll-margin-top:24px}.lake-in{padding-top:max(24px,env(safe-area-inset-top,0px))}.about picture{display:block;min-width:0}.ct-val{line-height:1.6}.lake{background:linear-gradient(#aebdc8,#cfd8dd 36%,#ede6dd 56%,#93a5b1)}@media(max-width:760px){.hello{gap:20px}.lake-in{gap:58px}.acts{gap:18px}.hello .btn{padding-inline:24px;font-size:15px}.role{font-size:12px;letter-spacing:.06em}.sub{max-width:27ch}.fmt .paper{padding:28px}.contacts .ct-val{font-size:19px}.contacts .ct-go{font-size:15px}.about picture{max-width:340px}.hint{bottom:28px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}.hint{display:none}}
