
:root{
  --ink:#2e5867;
  --deep:#244955;
  --sky:#8fd8e9;
  --pink:#f19cc0;
  --yellow:#ffd16b;
  --cream:#fff9e9;
  --paper:#fbfeff;
  --line:rgba(46,88,103,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}
img{display:block;width:100%}
button,input,textarea,select{font:inherit}

.brand-cap{
  position:fixed;left:28px;top:24px;z-index:60;
  background:#fff;border:1px solid var(--line);padding:.75rem 1rem;border-radius:999px;
  font:700 1.05rem Georgia,serif;box-shadow:0 12px 30px rgba(46,88,103,.08)
}
.brand-cap small{font:700 .52rem Arial;letter-spacing:.18em;color:#6ca9ba;margin-left:.5rem}
.edge-nav{
  position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:55;
  display:flex;flex-direction:column;gap:.35rem
}
.edge-nav a{
  writing-mode:vertical-rl;transform:rotate(180deg);
  min-height:98px;padding:.8rem .65rem;background:#fff;border:1px solid var(--line);
  border-radius:18px 0 0 18px;font-size:.7rem;font-weight:800;letter-spacing:.08em
}
.edge-nav a:nth-child(1){background:#dff6fb}
.edge-nav a:nth-child(2){background:#ffe5f0}
.edge-nav a:nth-child(3){background:#fff2bf}
.edge-nav a:nth-child(4){background:#e8f7e4}
.edge-nav a:nth-child(5){background:#f1e8ff}
.edge-nav a:nth-child(6){background:#fff}
.edge-nav a.active{box-shadow:inset 5px 0 0 var(--deep)}
.mobile-dock{display:none}

.hero{
  min-height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;
  background:linear-gradient(135deg,#eefaff,#fff1f7 55%,#fff8df)
}
.hero-copy{padding:10vw 8vw 7vw 7vw}
.kicker{font-size:.67rem;letter-spacing:.2em;font-weight:800;color:#d26796}
h1,h2,h3{font-family:Georgia,serif;letter-spacing:-.035em}
h1{font-size:clamp(4rem,8vw,8rem);line-height:.88;margin:.7rem 0 1.4rem}
.hero-copy>p{max-width:590px;color:#617e89;font-size:1.05rem}
.hero-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.8rem}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.9rem 1.1rem;border:1px solid var(--deep);font-weight:800;cursor:pointer;border-radius:999px}
.btn.primary{background:var(--deep);color:#fff}.btn.primary:hover{background:#d26796;border-color:#d26796}
.hero-art{padding:4vw 7vw 4vw 2vw}
.hero-art img{border-radius:50%;box-shadow:0 45px 100px rgba(63,125,146,.15)}
.color-track{
  display:grid;grid-template-columns:repeat(5,1fr);height:16px
}
.color-track span:nth-child(1){background:#8fd8e9}.color-track span:nth-child(2){background:#f19cc0}.color-track span:nth-child(3){background:#ffd16b}.color-track span:nth-child(4){background:#9edb94}.color-track span:nth-child(5){background:#c6a8e8}
.section{padding:7vw 7vw 7vw 6vw}
.section.soft{background:#f2fbfd}
.section-head{display:grid;grid-template-columns:.75fr 1.25fr;gap:4vw;align-items:end;margin-bottom:3rem}
.section-head h2{font-size:clamp(2.8rem,5vw,5.4rem);line-height:.94;margin:.4rem 0}
.section-head p{color:#67828c;max-width:620px;margin:0}
.flavor-orbit{
  display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center
}
.orbit-visual{
  min-height:520px;position:relative;border-radius:50%;
  background:radial-gradient(circle,#fff 0 24%,#fff6 25% 26%,transparent 27%),linear-gradient(135deg,#e4f8fd,#fff0f6);
  border:1px solid var(--line)
}
.orbit-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:150px;height:150px;border-radius:50%;display:grid;place-items:center;
  background:var(--deep);color:#fff;text-align:center;font-weight:900;padding:1rem
}
.flavor-dot{
  position:absolute;width:120px;height:120px;border-radius:50%;display:grid;place-items:center;text-align:center;
  padding:1rem;font-weight:800;border:8px solid #fff;box-shadow:0 12px 30px rgba(0,0,0,.08)
}
.fd1{left:10%;top:20%;background:#f19cc0}.fd2{right:10%;top:14%;background:#ffd16b}.fd3{right:12%;bottom:12%;background:#8fd8e9}.fd4{left:12%;bottom:10%;background:#9edb94}
.flavor-copy h2{font-size:clamp(3rem,5vw,5rem);line-height:.94}
.flavor-copy p{color:#67818c}
.randomizer{
  margin-top:1.5rem;border:1px solid var(--line);background:#fff;border-radius:28px;padding:1.4rem
}
.randomizer output{display:block;font:700 2rem Georgia;color:#d26796;margin:.7rem 0}
.randomizer button{border:0;background:var(--yellow);color:var(--deep);padding:.8rem 1rem;border-radius:999px;font-weight:800;cursor:pointer}
.cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1rem
}
.card{
  border:1px solid var(--line);background:#fff;border-radius:32px;overflow:hidden
}
.card img{aspect-ratio:1/1;object-fit:cover}
.card-copy{padding:1.2rem}.card-copy h3{font-size:1.5rem;margin:.2rem 0}.card-copy p{color:#6b828b;margin:.4rem 0}.card-copy strong{color:#d26796}
.mix-lab{
  display:grid;grid-template-columns:.9fr 1.1fr;background:var(--deep);color:#fff
}
.mix-copy{padding:7vw 6vw}.mix-copy .kicker{color:#ffc6df}.mix-copy h2{font-size:clamp(3rem,5vw,5.2rem);line-height:.92}.mix-copy p{color:#c9d9df}
.mix-ui{margin:5vw;background:#fff;color:var(--deep);border-radius:34px;padding:2rem}
.mix-step{margin-bottom:1.4rem}.mix-step>span{display:block;font-size:.7rem;letter-spacing:.12em;font-weight:800;margin-bottom:.55rem}
.choice-row{display:flex;gap:.45rem;flex-wrap:wrap}.choice-row button{border:1px solid var(--line);background:#fff;padding:.7rem .85rem;border-radius:999px;cursor:pointer}.choice-row button.active{background:#8fd8e9;border-color:#8fd8e9;color:#234955}
.mix-result{border-top:1px solid var(--line);padding-top:1.2rem;display:grid;grid-template-columns:1fr auto;gap:1rem}.mix-result output{font-weight:800}.mix-result strong{font:700 1.9rem Georgia;color:#d26796}
.season-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.season-card{border:1px solid var(--line);background:#fff;border-radius:28px;padding:1.4rem}
.season-card b{font-size:.7rem;color:#d26796}.season-card h3{font-size:1.4rem;margin:.7rem 0}.season-card p{color:#6c828b}
.footer{padding:3rem 8vw 3rem 6vw;border-top:1px solid var(--line);display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:2rem}.footer h4{margin:0 0 .8rem;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase}.footer a,.footer p{display:block;font-size:.8rem;color:#68818b;margin:.25rem 0}
.page-hero{padding:10vw 8vw 5vw 6vw;background:linear-gradient(135deg,#e9f9fd,#fff0f6);border-bottom:1px solid var(--line)}.page-hero h1{font-size:clamp(3.5rem,7vw,7rem)}
.catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.catalog-card{border:1px solid var(--line);background:#fff;border-radius:24px;padding:1.3rem}.catalog-card h3{margin:.2rem 0}.catalog-card p{color:#6a818b}.catalog-card strong{color:#d26796}.catalog-card.hidden{display:none}
.filters{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem}.filters button{border:1px solid var(--line);background:#fff;padding:.6rem .8rem;border-radius:999px;cursor:pointer}.filters button.active{background:var(--deep);color:#fff}
.form-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:5vw;padding:6vw 8vw 6vw 6vw}.form-info h2{font-size:clamp(2.8rem,5vw,5rem);line-height:.95}.form-info p{color:#69818a}.form{display:grid;gap:1rem}.field label{display:block;font-size:.7rem;letter-spacing:.12em;font-weight:800;margin-bottom:.35rem}.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);background:#fff;padding:.9rem;border-radius:16px}.status{min-height:1.3em;color:#d26796;font-weight:800}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center}.story-grid img{border-radius:50%;border:1px solid var(--line)}.story-grid h2{font-size:clamp(2.8rem,5vw,5rem);line-height:.95}.story-grid p{color:#69818a}
@media(max-width:980px){
  .edge-nav{display:none}.mobile-dock{display:flex;position:fixed;left:.7rem;right:.7rem;bottom:.7rem;z-index:70;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.35rem;box-shadow:0 12px 40px rgba(0,0,0,.12);overflow:auto}
  .mobile-dock a{flex:1;min-width:72px;text-align:center;padding:.6rem .4rem;border-radius:999px;font-size:.64rem;font-weight:800}.mobile-dock a.active{background:var(--deep);color:#fff}
  .brand-cap{position:absolute;left:20px;top:18px}
  .hero,.flavor-orbit,.mix-lab,.story-grid,.form-layout{grid-template-columns:1fr}.hero-copy{padding:16vw 5vw 5vw}.hero-art{padding:0 5vw 10vw}
  .section-head{grid-template-columns:1fr}.cards,.catalog-grid{grid-template-columns:1fr 1fr}.season-grid{grid-template-columns:1fr 1fr}.mix-copy{padding-bottom:2vw}.mix-ui{margin-top:0}
  .footer{padding-bottom:7rem}
}
@media(max-width:620px){
  .brand-cap{font-size:.92rem}.brand-cap small{display:none}
  .hero-copy{padding:28vw 20px 5vw}.hero-art{padding:0 20px 12vw}h1{font-size:clamp(3.4rem,17vw,5.1rem)}
  .section,.page-hero,.form-layout{padding-left:20px;padding-right:20px}.cards,.catalog-grid,.season-grid{grid-template-columns:1fr}
  .orbit-visual{min-height:430px}.flavor-dot{width:95px;height:95px;font-size:.72rem}.orbit-center{width:125px;height:125px;font-size:.8rem}
  .mix-copy{padding:14vw 20px 4vw}.mix-ui{margin:0 20px 14vw}.footer{grid-template-columns:1fr;padding-left:20px;padding-right:20px}
}
