:root {
  --cream:#fcf8ed; --ink:#291b21; --muted:#624b53; --berry:#8c204c;
  --pink:#f2dce5; --lemon:#f5e69e; --line:#e5d7ce; --white:#fffdf7;
  --display:Georgia, "Times New Roman", serif; --body:"DM Sans", system-ui,sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font:16px/1.55 var(--body); }
a { color:inherit; text-underline-offset:.23em; }
a:focus-visible { outline:3px solid #416a32; outline-offset:5px; }
img { display:block; max-width:100%; }
p,figure,blockquote { margin:0; }
.wrap { width:min(100% - 96px, 1260px); margin-inline:auto; }
.skip { position:absolute; top:10px; left:10px; z-index:3; background:white; padding:10px; transform:translateY(-150%); }
.skip:focus { transform:none; }
.header { display:flex; align-items:center; justify-content:space-between; padding-block:23px; border-bottom:1px solid var(--line); }
.wordmark { font:900 clamp(29px,3vw,38px)/1 var(--display); color:var(--berry); text-decoration:none; letter-spacing:-.09em; white-space:nowrap; }
.wordmark span { color:#bc426d; }
nav { display:flex; gap:clamp(14px,3vw,35px); align-items:center; }
.header nav a { text-decoration:none; font-size:14px; font-weight:650; }
.nav-cta { padding:10px 16px; border:1px solid var(--berry); border-radius:99px; color:var(--berry); white-space:nowrap; }
.nav-cta:hover { background:var(--pink); }
.hero { display:grid; grid-template-columns:1fr 1.06fr; align-items:center; gap:clamp(24px,5vw,80px); padding-block:45px 64px; }
.label { color:var(--berry); font-size:12px; font-weight:750; letter-spacing:.11em; text-transform:uppercase; }
h1,h2,h3 { margin:0; font-family:var(--display); font-weight:500; letter-spacing:-.053em; }
h1 { font-size:clamp(48px,6.4vw,96px); line-height:.99; margin-block:15px 22px; }
h1 em { display:inline-block; color:var(--berry); }
.intro { max-width:29ch; font-size:clamp(17px,1.6vw,21px); line-height:1.5; color:var(--muted); }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:14px 20px; margin-top:25px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:12px; color:white; background:var(--berry); padding:14px 19px; border-radius:99px; font-size:14px; font-weight:750; text-decoration:none; }
.button:hover { background:#691435; }
.text-link { color:var(--berry); font-size:14px; font-weight:750; }
.fine { margin-top:12px; color:var(--muted); font-size:12px; }
.hero-visual { position:relative; isolation:isolate; min-height:450px; height:clamp(450px,43vw,625px); overflow:hidden; background:var(--lemon); border-radius:34% 34% 21px 21px / 18% 18% 21px 21px; }
.food { width:100%; height:100%; object-fit:cover; object-position:61% center; }
.hero-product { position:absolute; width:33%; min-width:130px; left:5%; bottom:5%; overflow:hidden; transform:rotate(-6deg); border:5px solid var(--white); border-radius:19px; box-shadow:0 16px 42px #2b112944; background:var(--cream); }
.hero-product img { width:100%; height:auto; }
.workflow { background:var(--lemon); padding-block:65px 66px; }
.section-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:30px; }
.section-head > p { max-width:30ch; color:var(--muted); }
h2 { font-size:clamp(40px,5.2vw,72px); line-height:1.04; }
.section-head h2,.founder h2 { margin-top:9px; }
.steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.step { overflow:hidden; background:var(--white); border-radius:20px; }
.step-visual {
  display:grid; place-items:center; overflow:hidden; aspect-ratio:1.13;
  background:radial-gradient(ellipse at 50% 20%,#f8dce7,#dda3bc);
}
.step-visual img { width:100%; height:100%; object-fit:cover; }
.shop .step-visual { background:#e2eacb; }
.cook .step-visual { background:radial-gradient(ellipse at 50% 10%,#dbe8c8,#a6be8a); padding-top:18px; }
.cook .step-visual img { width:54%; height:auto; align-self:start; border:4px solid var(--white); border-radius:15px; box-shadow:0 12px 30px #2933223b; }
.step-copy { padding:20px 23px 25px; }
h3 { font-size:clamp(25px,2.55vw,34px); line-height:1.08; }
.step-copy p,.founder > p:not(.label) { color:var(--muted); margin-top:10px; }
.showcase-action { margin-top:30px; text-align:center; }
.showcase-action .fine { margin-top:9px; }
.story { padding-block:74px; display:grid; grid-template-columns:minmax(0, .83fr) minmax(0, 1fr); gap:clamp(28px,8vw,120px); align-items:center; }
.founder-portrait { width:min(100%,385px); justify-self:end; padding:12px; background:var(--pink); border-radius:44% 44% 20px 20px; }
.founder-portrait img { width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:44% 44% 12px 12px; }
.founder > p:not(.label) { margin-block:14px; max-width:46ch; }
.testimonials { padding-block:55px 62px; background:var(--pink); }
.testimonials h2 { font-size:clamp(35px,4.4vw,58px); }
.quotes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:26px; }
.quotes figure { padding:10px clamp(15px,3vw,38px) 8px; border-left:1px solid #cfa7b6; }
.quotes figure:first-child { border-left:0; padding-left:0; }
.quotes blockquote { font:italic clamp(22px,2.7vw,34px)/1.2 var(--display); letter-spacing:-.035em; }
.quotes figcaption { font-size:13px; margin-top:13px; color:var(--berry); font-weight:700; }
.closing { background:var(--berry); color:var(--white); }
.closing-inner { display:flex; justify-content:space-between; align-items:center; gap:18px; padding-block:38px; }
.closing h2 { font-size:clamp(36px,4.5vw,58px); }
.closing .button { background:var(--lemon); color:var(--ink); flex-shrink:0; }
.closing .button:hover { background:var(--white); }
.footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:13px 26px; padding-block:23px; color:var(--muted); font-size:13px; }
.footer .wordmark { font-size:28px; }
.footer nav { gap:14px; }
@media(max-width:950px) {
  .wrap { width:calc(100% - 56px); }
  .hero { gap:23px; }
  .hero-visual { min-height:400px; }
  .actions { gap:10px 16px; }
}
@media(max-width:720px) {
  .wrap { width:calc(100% - 36px); }
  .header { padding-block:15px; }
  .nav-detail { display:none; }
  .hero { grid-template-columns:1fr; padding-block:30px 33px; }
  h1 { font-size:clamp(45px,10vw,72px); margin-block:10px 13px; }
  .desktop-break { display:none; }
  .hero-visual { min-height:0; height:clamp(320px,85vw,475px); }
  .hero-product { width:32%; min-width:104px; border-width:3px; }
  .section-head { display:block; }
  .section-head > p { margin-top:9px; }
  .workflow { padding-block:39px; }
  .steps { grid-template-columns:1fr; gap:14px; }
  .step { display:grid; grid-template-columns:minmax(0,1fr); }
  .step-visual { aspect-ratio:1.38; }
  .step-copy { padding:16px 18px 20px; }
  .step-copy p { font-size:15px; line-height:1.42; }
  .story { grid-template-columns:1fr; padding-block:42px; }
  .founder-portrait { width:min(76%,300px); justify-self:start; }
  .testimonials { padding-block:38px 43px; }
  .quotes { grid-template-columns:1fr; margin-top:17px; }
  .quotes figure,.quotes figure:first-child { padding:15px 0; border-left:0; border-top:1px solid #cfa7b6; }
  .quotes figcaption { margin-top:7px; }
  .closing-inner { align-items:start; flex-direction:column; padding-block:30px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Product features and social links */
@supports (background-clip:text) {
  h1 em {
    background:linear-gradient(100deg,#781d53 12%,#aa2857 60%,#ad443e 100%);
    background-clip:text;
    color:transparent;
  }
}
.feature-strip {
  display:flex;
  align-items:stretch;
  background:linear-gradient(102deg,#782044,#9d2558 55%,#87244a);
  color:#fff3b9;
}
.strip-window { min-width:0; flex:1; overflow:hidden; }
.strip-track { display:flex; width:100%; }
.strip-group {
  display:flex; justify-content:center; flex-wrap:wrap;
  gap:8px clamp(18px,3vw,44px); width:100%;
  margin:0; padding:13px 22px; list-style:none;
}
.strip-group li {
  display:flex; align-items:center; gap:clamp(10px,1.5vw,22px);
  font-size:13px; line-height:1.4; font-weight:750;
  letter-spacing:.06em; text-transform:uppercase;
}
.strip-group li::before {
  content:""; width:6px; height:6px; flex:none;
  border-radius:50%; background:currentColor;
}
.strip-copy { display:none; }
.strip-ready .strip-track { width:max-content; animation:feature-scroll 34s linear infinite; }
.strip-ready .strip-group { width:auto; min-width:100vw; flex:none; flex-wrap:nowrap; justify-content:space-around; }
.strip-ready .strip-group li { white-space:nowrap; }
.strip-ready .strip-copy { display:flex; }
.strip-paused .strip-track { animation-play-state:paused; }
.strip-toggle {
  border:0; border-left:1px solid #fff3b950; background:#651b3d;
  color:inherit; font:700 12px var(--body); min-width:65px; padding:0 10px;
  cursor:pointer;
}
.strip-toggle:hover { background:#51132e; }
.strip-toggle:focus-visible { outline:2px solid #fff3b9; outline-offset:-4px; }
@keyframes feature-scroll { to { transform:translateX(-50%); } }
.feature-section { padding-top:clamp(40px,6vw,76px); }
.feature-panel {
  padding:clamp(25px,5vw,67px);
  border-radius:27px;
  color:var(--white);
  background:
    radial-gradient(ellipse at 100% 0%,#762846 0%,transparent 51%),
    radial-gradient(ellipse at 0% 100%,#5e3047 0%,transparent 50%),
    #301c2b;
}
.feature-panel h2 { font-size:clamp(41px,5.8vw,76px); }
.feature-panel h2 em { color:#ffc9a7; }
@supports (background-clip:text) {
  .feature-panel h2 em {
    background:linear-gradient(100deg,#f4b1d0,#ffcf94);
    background-clip:text;
    color:transparent;
  }
}
.feature-grid {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:25px clamp(18px,3.3vw,45px); margin:clamp(25px,4vw,45px) 0 0;
}
.feature-grid div { border-top:1px solid #f1c8d76b; padding-top:14px; }
.feature-grid dt { font:500 clamp(21px,2.2vw,28px)/1.13 var(--display); letter-spacing:-.03em; }
.feature-grid dd { margin:8px 0 0; color:#f7e3ec; font-size:15px; line-height:1.48; }
.closing { background:radial-gradient(ellipse at 0% 100%,#9e3656,transparent 60%),linear-gradient(110deg,#84234a,#6b1944 70%,#7a2040); }
.footer .social-links { gap:8px; }
.social-links a {
  display:grid; place-items:center; width:42px; height:42px;
  border-radius:50%; background:var(--pink); color:var(--berry);
}
.social-links a:hover { background:var(--berry); color:var(--white); }
.social-links svg { width:21px; height:21px; }
@media(max-width:900px) {
  .feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:540px) {
  .feature-grid { grid-template-columns:1fr; gap:18px; }
  .feature-panel { border-radius:19px; }
}
@media(prefers-reduced-motion:reduce) {
  .strip-ready .strip-track { width:100%; animation:none; }
  .strip-ready .strip-group { width:100%; min-width:0; flex-wrap:wrap; justify-content:center; }
  .strip-ready .strip-copy,.strip-toggle { display:none; }
}

.concept-credit { background:#000; color:#fff; }
.concept-credit-inner { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:4px 13px; padding-block:13px; font-size:13px; }
.concept-credit a { font-weight:700; }
.concept-credit a:focus-visible { outline-color:#fff; }

@media (prefers-reduced-motion:no-preference) {
  .concept-credit-copy,.concept-credit-copy span { transition:color .18s ease; }
}
.concept-credit-copy:hover,.concept-credit-inner:focus-within .concept-credit-copy { color:#bc8cff; }
.concept-credit-copy:hover span,.concept-credit-inner:focus-within .concept-credit-copy span { color:#73b5ff; }
