:root{
  /*EDITMODE-BEGIN*/
  /*EDITMODE-END*/
  --bg:#F5F2EC;
  --bg-2:#ECE7DD;
  --ink:#0A0A0A;
  --ink-2:#1C1C1C;
  --muted:#6B6860;
  --line:#D9D3C6;
  --accent:oklch(0.88 0.18 118);
  --accent-ink:#0A0A0A;
  --danger:#C64B2B;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Noto Sans JP","Inter Tight",system-ui,sans-serif;
  background:var(--bg);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"palt";
  line-height:1.7;
}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;letter-spacing:.02em}
.eng{font-family:"Inter Tight",sans-serif;letter-spacing:-.02em}
.serif{font-family:"Noto Serif JP",serif}
.italic-skew{font-style:italic;transform:skewX(-8deg);display:inline-block}
a{color:inherit}
img{max-width:100%;display:block}
.container{max-width:1320px;margin:0 auto;padding:0 32px}
.rule{height:1px;background:var(--line);width:100%}
.rule-ink{height:1px;background:var(--ink);width:100%}

/* NAV */
nav.top{
  position:sticky;top:0;z-index:50;
  background:rgba(245,242,236,.85);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:26px;width:auto}
.brand .tag{font-size:11px;letter-spacing:.18em;color:var(--muted);border-left:1px solid var(--line);padding-left:12px}
.nav-links{display:flex;gap:28px;font-size:13px}
.nav-links a{text-decoration:none;color:var(--ink-2);padding:6px 0;position:relative}
.nav-links a:hover{color:var(--ink)}
.nav-cta{display:flex;gap:10px;align-items:center}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 22px;border-radius:0;
  font-size:13px;font-weight:700;letter-spacing:.04em;
  text-decoration:none;border:1px solid var(--ink);
  transition:transform .2s ease, background .2s ease, color .2s ease;
  cursor:pointer;
}
.btn-dark{background:var(--ink);color:var(--bg)}
.btn-dark:hover{background:var(--accent);color:var(--ink);border-color:var(--ink)}
.btn-ghost{background:transparent;color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--bg)}
.btn-accent{background:var(--accent);color:var(--ink);border-color:var(--ink)}
.btn-accent:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 0 var(--ink)}
.btn .arrow{transition:transform .2s}
.btn:hover .arrow{transform:translateX(3px)}

/* HERO */
.hero{
  padding:72px 0 40px;
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
}
.hero-grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:48px;
  align-items:end;
}
.hero-kicker{
  display:flex;align-items:center;gap:14px;
  font-size:11px;letter-spacing:.22em;color:var(--muted);
  margin-bottom:28px;
}
.hero-kicker .dot{width:6px;height:6px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 4px color-mix(in oklab, var(--accent) 30%, transparent)}
h1.hero-title{
  font-family:"Noto Sans JP";
  font-weight:900;
  font-size:clamp(44px, 6.2vw, 80px);
  line-height:1.2;
  letter-spacing:-.02em;
  margin:0 0 24px;
}
h1.hero-title .skew{
  display:inline-block;
  transform:skewX(-8deg);
  font-style:italic;
}
h1.hero-title .under{
  background:linear-gradient(var(--accent),var(--accent));
  background-repeat:no-repeat;
  background-size:100% .28em;
  background-position:0 88%;
  padding: 0 .08em;
}
.hero-lead{
  font-size:17px;
  color:var(--ink-2);
  max-width:560px;
  margin:0 0 32px;
  line-height:1.9;
}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:28px}
.hero-meta{
  display:flex;gap:24px;flex-wrap:wrap;
  font-size:12px;color:var(--muted);letter-spacing:.04em;
}
.hero-meta span::before{content:"●";color:var(--accent);margin-right:8px;font-size:10px}

/* Hero right: hand-holding-phone image */
.phone-wrap{
  position:relative;
  width:100%;
  max-width:460px;
  margin-left:auto;
  aspect-ratio: 1555 / 2317;
}
.phone-wrap img.hand{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  filter: drop-shadow(-18px 18px 0 var(--accent)) drop-shadow(0 40px 50px rgba(0,0,0,.25));
  transform-origin: 50% 90%;
  animation: phone-swing 2s cubic-bezier(.45,0,.55,1) 1 forwards;
}

.hero-stamp{
  position:absolute;right:-40px;top:40%;
  font-family:"Inter Tight";font-weight:800;font-size:12px;
  letter-spacing:.3em;color:var(--muted);
  writing-mode:vertical-rl;transform:rotate(180deg);
}

/* LOGO STRIP */
.strip{
  border-bottom:1px solid var(--line);
  padding:26px 0;
  background:var(--bg);
}
.strip-inner{
  display:flex;align-items:center;gap:32px;
  font-size:11px;color:var(--muted);letter-spacing:.18em;
  overflow:hidden;
}
.strip-label{flex-shrink:0;white-space:nowrap}
.strip-items{
  display:flex;gap:40px;
  font-family:"Inter Tight";font-weight:700;font-size:13px;
  color:var(--ink-2);letter-spacing:.02em;
  flex-wrap:wrap;
}
.strip-items span{display:inline-flex;align-items:center;gap:8px}
.strip-items span::before{content:"";width:6px;height:6px;background:var(--ink);border-radius:50%}

/* SECTION HEAD */
section{padding:120px 0;border-bottom:1px solid var(--line);position:relative}
.sec-head{display:grid;grid-template-columns: 1fr 1fr;gap:40px;align-items:end;margin-bottom:64px}
.sec-num{
  font-family:"Inter Tight";font-weight:800;font-size:13px;letter-spacing:.2em;
  color:var(--muted);
}
.sec-num::before{content:"";display:inline-block;width:28px;height:1px;background:var(--ink);vertical-align:middle;margin-right:14px}
.sec-title{
  font-size:clamp(36px,4.4vw,64px);
  font-weight:900;line-height:1.2;letter-spacing:-.02em;
  margin:14px 0 0;
}
.sec-title .skew{display:inline-block;transform:skewX(-8deg);font-style:italic}
.sec-desc{font-size:15px;color:var(--muted);line-height:1.9;max-width:440px;justify-self:end}

/* PROBLEMS */
.problems{background:var(--ink);color:var(--bg);border-bottom:none}
.problems .sec-num{color:#9B978F}
.problems .sec-num::before{background:var(--bg)}
.problems .sec-desc{color:#BFB9AD}
.problem-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:#2A2A2A;border:1px solid #2A2A2A;
}
.problem{
  background:var(--ink);padding:36px 30px;
  display:flex;flex-direction:column;gap:16px;min-height:260px;
}
.problem-num{
  font-family:"Inter Tight";font-weight:800;font-size:11px;color:#6B6860;letter-spacing:.2em;
}
.problem-q{font-size:20px;font-weight:700;line-height:1.5;color:#fff}
.problem-q .hi{background:linear-gradient(var(--accent),var(--accent));background-repeat:no-repeat;background-size:100% .22em;background-position:0 90%;color:var(--accent);color:#fff;padding:0 .1em}
.problem-note{font-size:13px;color:#9B978F;margin-top:auto;line-height:1.7}

/* FEATURES */
.feat-main{
  display:grid;grid-template-columns: 1.1fr .9fr;gap:64px;
  border-top:1px solid var(--line);
  padding-top:56px;
}
.feat-list{display:flex;flex-direction:column}
.feat-item{
  display:grid;grid-template-columns: 80px 1fr auto;gap:24px;
  padding:28px 0;border-bottom:1px solid var(--line);
  cursor:default;transition:padding .25s ease;
  align-items:start;
}
.feat-item:last-child{border-bottom:none}
.feat-n{font-family:"Inter Tight";font-weight:800;font-size:14px;color:var(--muted);letter-spacing:.1em;padding-top:4px}
.feat-h{font-size:22px;font-weight:800;line-height:1.4;letter-spacing:-.01em}
.feat-d{font-size:13px;color:var(--muted);margin-top:6px;line-height:1.8}
.feat-plus{
  width:36px;height:36px;border:1px solid var(--ink);display:grid;place-items:center;
  font-family:"Inter Tight";font-weight:600;font-size:18px;
  transition:background .2s, color .2s;
}
.feat-item[data-active="true"] .feat-plus{background:var(--ink);color:var(--bg)}

.feat-phone-wrap{
  position:sticky;top:96px;align-self:start;
  aspect-ratio: 1555 / 2317;
  max-height:640px;
  margin:0 auto;
}
.feat-phone-wrap img.hand{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  filter: drop-shadow(-18px 18px 0 var(--accent)) drop-shadow(0 40px 50px rgba(0,0,0,.25));
  transform-origin: 50% 90%;
  animation: phone-swing 2s cubic-bezier(.45,0,.55,1) 1 forwards;
  animation-play-state: paused;
}
.feat-phone-wrap img.hand.in-view{
  animation-play-state: running;
}

/* RESERVATION UI MOCK */
.ui-showcase{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:stretch;
}
.ui-shot{
  margin:0;
  display:flex;flex-direction:column;
  background:var(--bg);
  border:1px solid var(--ink);
}
.ui-shot-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 18px;border-bottom:1px solid var(--line);
  font-size:10.5px;letter-spacing:.2em;color:var(--muted);
}
.ui-shot-media{
  position:relative;
  padding:36px 36px 0;
  background:transparent;
  overflow:hidden;
  display:flex;justify-content:center;
}
.ui-shot-media img{
  position:relative;z-index:1;
  width:min(78%, 320px);
  height:auto;display:block;
  border-radius:34px;
  border:10px solid #0A0A0A;
  box-shadow:
    inset 0 0 0 1px #2A2A2A,
    0 30px 50px -20px rgba(0,0,0,.5),
    0 0 0 1px rgba(0,0,0,.08);
  margin-bottom:-40px;
  background:#fff;
}
.ui-shot-cap{
  padding:56px 32px 32px;
  display:flex;flex-direction:column;gap:10px;
  border-top:1px solid var(--line);
  margin-top:auto;
}
.ui-shot-h{
  font-size:20px;font-weight:800;letter-spacing:-.01em;line-height:1.5;
}
.ui-shot-d{
  font-size:13px;line-height:1.9;color:var(--muted);
}

/* legacy res-mock (retained for potential reuse) */
.res-mock{
  background:#FCFAF5;color:var(--ink);
  border:1px solid #2A2A2A;
  padding:0;overflow:hidden;
  margin-top:auto;
}
.res-head{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:12px}
.res-head .dot{width:10px;height:10px;border-radius:50%;background:var(--accent);border:1px solid var(--ink)}
.res-grid{display:grid;grid-template-columns: 60px repeat(5,1fr);font-size:11px}
.res-grid > div{padding:8px 6px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);text-align:center;min-height:30px;display:flex;align-items:center;justify-content:center}
.res-grid .day{font-weight:700;background:#F5F2EC}
.res-grid .time{font-family:"JetBrains Mono";color:var(--muted)}
.res-grid .slot.free{color:var(--ink);font-weight:700}
.res-grid .slot.booked{background:var(--ink);color:var(--bg)}
.res-grid .slot.hold{background:var(--accent);color:var(--ink);font-weight:700}
.res-grid .slot.x{color:#C64B2B}

/* COMPARISON */
.comparison{background:var(--bg-2)}
.cmp-outer{border:2px solid var(--ink);overflow:hidden}
.cmp-table{width:100%;table-layout:fixed;border-collapse:collapse}
.col-label{width:25%}
.col-rizasta{width:29%}
.col-other{width:23%}

/* Header */
.cmp-th-label{
  background:var(--bg);
  border-right:1px solid var(--line);
  padding:20px 16px;
}
.cmp-th-rizasta{
  background:var(--accent);
  border-left:2px solid var(--ink);
  border-right:2px solid var(--ink);
  border-bottom:2px solid var(--ink);
  padding:20px 12px 18px;
  text-align:center;
  vertical-align:bottom;
  position:relative;
}
.cmp-th-rizasta::before{
  content:'';position:absolute;top:0;left:0;right:0;height:5px;
  background:var(--ink);
}
.cmp-th-other{
  background:var(--bg);
  border-right:1px solid var(--line);
  border-bottom:2px solid var(--ink);
  padding:20px 12px 18px;
  text-align:center;
  vertical-align:bottom;
}
.cmp-badge{
  display:block;
  background:var(--ink);color:var(--bg);
  font-size:9px;font-weight:800;letter-spacing:.12em;
  padding:4px 0;margin-bottom:10px;
  text-transform:uppercase;
  font-family:'JetBrains Mono',monospace;
}
.cmp-co-name{
  display:block;font-size:18px;font-weight:900;
  letter-spacing:-.02em;color:var(--ink);
  line-height:1;
}
.cmp-th-other .cmp-co-name{font-size:16px;color:var(--muted)}

/* Body */
.cmp-row td{vertical-align:middle;text-align:center;border-bottom:1px solid var(--line)}
.cmp-row:last-child td{border-bottom:none}
.cmp-label{
  text-align:left!important;
  font-size:24px;font-weight:700;
  color:var(--ink);letter-spacing:.02em;
  background:var(--bg);
  border-right:1px solid var(--line);
  padding:22px 14px 22px 20px;
}
.cmp-cell-rizasta{
  background:var(--accent);
  border-left:2px solid var(--ink);
  border-right:2px solid var(--ink);
  padding:22px 12px;
}
.cmp-cell-other{
  background:var(--bg);
  border-right:1px solid var(--line);
  padding:22px 12px;
}
.cmp-row-alt .cmp-label,.cmp-row-alt .cmp-cell-other{background:var(--bg-2)}
.cmp-row-alt .cmp-cell-rizasta{background:var(--accent)}

/* Values */
.cmp-num{
  display:inline;
  font-size:20px;font-weight:900;
  letter-spacing:-.03em;color:var(--ink);
  font-family:'Inter Tight',sans-serif;
}
.cmp-unit{font-size:11px;font-weight:500;color:var(--ink);margin-left:1px}
.cmp-highlight{color:var(--ink)}
.cmp-dim{color:#000!important;font-weight:500!important}
.cmp-subnote{display:block;font-size:10px;color:var(--muted);margin-top:4px;letter-spacing:.04em}

/* Pills for LINE連携 */
.cmp-pill{
  display:inline-block;
  font-size:11px;font-weight:700;
  padding:5px 10px;
  letter-spacing:.02em;
}
.cmp-pill-yes{
  background:var(--ink);color:var(--accent);
}
.cmp-pill-no{
  background:transparent;color:#000;
  border:1px solid var(--ink);
}

.cmp-disclaimer{font-size:12px;color:var(--muted);margin:20px 0 0;line-height:1.8}

@media(max-width:600px){
  .cmp-th-rizasta,.cmp-th-other{padding:14px 6px 12px}
  .cmp-co-name{font-size:14px}
  .cmp-th-other .cmp-co-name{font-size:13px}
  .cmp-badge{font-size:8px;margin-bottom:7px}
  .cmp-label{padding:16px 8px 16px 12px;font-size:16px}
  .cmp-cell-rizasta,.cmp-cell-other{padding:16px 6px}
  .cmp-num{font-size:14px}
  .cmp-unit{font-size:10px}
  .cmp-pill{font-size:10px;padding:4px 6px}
}

/* PRICING */
.pricing{background:var(--bg-2)}
.price-grid{
  display:grid;grid-template-columns: 1fr 1fr;gap:40px;
}
.price-card{
  background:var(--bg);border:1px solid var(--ink);
  padding:44px;
  position:relative;
}
.price-card.main{
  background:var(--ink);color:var(--bg);
}
.price-card .label{
  font-family:"Inter Tight";font-weight:700;font-size:11px;letter-spacing:.22em;color:var(--muted);margin-bottom:12px;
  display:flex;justify-content:space-between;align-items:center;
}
.price-card.main .label{color:#9B978F}
.price-card .label .badge{
  background:var(--accent);color:var(--ink);padding:4px 10px;font-size:10px;letter-spacing:.16em;
}
.price-card .title{font-size:28px;font-weight:900;letter-spacing:-.01em;margin-bottom:28px}
.price-card .amount{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.price-card .jpy{font-family:"Inter Tight";font-size:13px;font-weight:700;color:var(--muted)}
.price-card.main .jpy{color:#9B978F}
.price-card .num{
  font-family:"Inter Tight";font-weight:800;font-size:clamp(56px,7vw,96px);
  letter-spacing:-.04em;line-height:1;
}
.price-card .per{font-size:13px;color:var(--muted);margin-bottom:28px}
.price-card.main .per{color:#BFB9AD}
.price-card ul{list-style:none;padding:0;margin:0 0 28px;border-top:1px solid var(--line);}
.price-card.main ul{border-top:1px solid #2A2A2A}
.price-card li{
  display:grid;grid-template-columns: 1fr auto;gap:12px;
  padding:14px 0;border-bottom:1px solid var(--line);font-size:13.5px;
}
.price-card.main li{border-bottom:1px solid #2A2A2A}
.price-card li .v{font-family:"Inter Tight";font-weight:700;color:var(--ink)}
.price-card.main li .v{color:var(--accent)}
.price-note{font-size:11px;color:var(--muted);margin-top:20px;line-height:1.8}

/* TIMELINE */
.timeline{background:var(--bg);}
.tl-strip{
  display:grid;grid-template-columns:repeat(4,1fr);
  border:1px solid var(--ink);
}
.tl-step{
  padding:34px 28px;border-right:1px solid var(--ink);
  position:relative;min-height:240px;
  display:flex;flex-direction:column;gap:12px;
}
.tl-step:last-child{border-right:none;background:var(--ink);color:var(--bg)}
.tl-day{font-family:"Inter Tight";font-weight:800;font-size:12px;letter-spacing:.2em;color:var(--muted)}
.tl-step:last-child .tl-day{color:var(--accent)}
.tl-big{font-family:"Inter Tight";font-weight:800;font-size:56px;letter-spacing:-.04em;line-height:1}
.tl-h{font-size:17px;font-weight:800;margin-top:8px}
.tl-d{font-size:12.5px;color:var(--muted);line-height:1.8}
.tl-step:last-child .tl-d{color:#BFB9AD}
.tl-arrow{
  position:absolute;top:50%;right:-13px;transform:translateY(-50%);
  width:24px;height:24px;background:var(--bg);border:1px solid var(--ink);
  display:grid;place-items:center;z-index:2;font-family:"Inter Tight";font-weight:700;
}
.tl-step:last-child .tl-arrow{display:none}

/* FAQ */
.faq-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line);padding:24px 0;cursor:pointer}
.faq-q{
  display:grid;grid-template-columns: 48px 1fr 32px;gap:16px;
  align-items:center;font-size:17px;font-weight:700;
}
.faq-q .qmark{font-family:"Inter Tight";font-weight:800;color:var(--muted)}
.faq-toggle{width:32px;height:32px;border:1px solid var(--ink);display:grid;place-items:center;transition:transform .25s}
.faq-item[data-open="true"] .faq-toggle{background:var(--ink);color:var(--bg);transform:rotate(45deg)}
.faq-a{
  display:grid;grid-template-columns: 48px 1fr 32px;gap:16px;
  font-size:14px;color:var(--muted);line-height:1.9;
  max-height:0;overflow:hidden;transition:max-height .35s ease, padding-top .3s;
}
.faq-item[data-open="true"] .faq-a{max-height:400px;padding-top:14px}
.faq-a .amark{font-family:"Inter Tight";font-weight:800;color:var(--accent-ink);background:var(--accent);width:28px;height:28px;display:grid;place-items:center;font-size:13px}

/* CTA BIG */
.cta-big{
  background:var(--ink);color:var(--bg);
  padding:120px 0;border-bottom:none;overflow:hidden;position:relative;
}
.cta-big h2{
  font-size:clamp(48px,7vw,120px);
  font-weight:900;line-height:1.2;letter-spacing:-.02em;margin:0;
}
.cta-big h2 .skew{display:inline-block;transform:skewX(-8deg);font-style:italic}
.cta-big .under{background:linear-gradient(var(--accent),var(--accent));background-repeat:no-repeat;background-size:100% .28em;background-position:0 88%;padding:0 .08em;color:var(--bg)}
.cta-row{
  display:grid;grid-template-columns: 1.3fr .7fr;gap:48px;align-items:end;
  margin-top:56px;
}
.cta-lead{font-size:15.5px;color:#BFB9AD;line-height:1.95;max-width:620px}
.cta-actions{display:flex;flex-direction:column;gap:12px}
.cta-actions .btn{justify-content:center;padding:18px 24px;font-size:14px}
.cta-actions .btn-accent{border-color:var(--accent)}

/* FOOTER */
footer{background:var(--bg-2);padding:56px 0 28px;font-size:12px;color:var(--muted)}
.foot-top{display:flex;justify-content:space-between;align-items:start;gap:40px;padding-bottom:32px;border-bottom:1px solid var(--line)}
.foot-brand img{height:22px;margin-bottom:12px}
.foot-brand p{max-width:420px;line-height:1.8}
.foot-links{display:grid;grid-template-columns:repeat(3,auto);gap:40px;font-size:12px}
.foot-col h4{font-size:11px;letter-spacing:.2em;color:var(--ink);margin:0 0 14px;font-weight:800}
.foot-col a{display:block;color:var(--muted);text-decoration:none;margin:6px 0}
.foot-col a:hover{color:var(--ink)}
.foot-bottom{display:flex;justify-content:space-between;padding-top:24px;font-family:"JetBrains Mono";font-size:10.5px;letter-spacing:.08em}

/* Tweaks panel */
.tweaks{
  position:fixed;bottom:20px;right:20px;
  background:var(--ink);color:var(--bg);
  padding:18px;width:260px;z-index:100;
  font-size:12px;display:none;
  box-shadow: -6px -6px 0 0 var(--accent);
}
.tweaks.open{display:block}
.tweaks h5{margin:0 0 14px;font-size:11px;letter-spacing:.22em;color:#9B978F}
.tweak-row{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.tw-swatch{width:28px;height:28px;border:1px solid #2A2A2A;cursor:pointer;position:relative}
.tw-swatch[data-sel="true"]::after{content:"";position:absolute;inset:-3px;border:1px solid #fff}
.tweaks label{display:block;font-size:10px;letter-spacing:.12em;color:#9B978F;margin:10px 0 6px}

@media (max-width:960px){
  .sec-head,.feat-main,.price-grid,.cta-row{grid-template-columns:1fr}
  .ui-showcase{grid-template-columns:1fr;gap:32px}
  .problem-grid{grid-template-columns:1fr}
  .problem{min-height:0}
  .problem-note{margin-top:0}
  .tl-strip{grid-template-columns:1fr 1fr}
  .tl-step{border-right:none;border-bottom:1px solid var(--ink)}
  .foot-top{flex-direction:column}
  .foot-links{grid-template-columns:repeat(2,auto)}
  .hero-stamp{display:none}
  .feat-main{position:relative;min-height:680px;align-items:stretch}
  .feat-phone-wrap{
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    overflow:hidden;
    max-height:none;
  }
  .feat-phone-wrap img.hand{
    position:absolute;
    right:-15%;
    bottom:0;
    width:85%;
    height:auto;
    max-width:none;
    opacity:.8;
    filter:saturate(.85) drop-shadow(-10px 10px 0 var(--accent));
    transform-origin:50% 90%;
  }
  .feat-list{
    position:relative;
    z-index:2;
    /* padding-bottom:180px; */
    background:linear-gradient(180deg, var(--bg) 0%, color-mix(in oklab, var(--bg) 80%, transparent) 60%, transparent 100%);
  }
  .nav-links{display:none}

  /* Hero: phone becomes background layer */
  .hero{padding:48px 0 40px;overflow:hidden}
  .hero-grid{
    grid-template-columns:1fr;
    gap:0;
    position:relative;
    min-height:720px;
    align-items:stretch;
  }
  .hero-phone-col{
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    overflow:hidden;
  }
  .phone-wrap{
    position:absolute;
    right:-24%;
    top:40%;
    width:90%;
    max-width:none;
    margin:0;
    opacity:.8;
    filter:saturate(.85);
  }
  .phone-wrap img.hand{
    filter: drop-shadow(-10px 10px 0 var(--accent));
    transform:rotate(8deg);
  }
  .hero-grid > div:first-child{
    position:relative;
    z-index:2;
    background:linear-gradient(180deg, var(--bg) 0%, color-mix(in oklab, var(--bg) 80%, transparent) 55%, transparent 100%);
    padding-bottom:320px;
  }
  h1.hero-title{font-size:clamp(40px,11vw,72px)}
  .hero-lead{font-size:15px}
  .hero-meta{font-size:11px;gap:14px}
  .hero-ctas .btn{padding:14px 18px;font-size:12px}
}

@media (max-width:600px){
  .container{padding:0 20px}
  .phone-wrap{right:-30%;top:44%;width:100%}
  section{padding:80px 0}
  .nav-cta .btn-ghost{display:none}
  .brand .tag{display:none}
  .price-card{padding:28px}
  .res-grid{font-size:10px}
}

/* PHONE SWING ANIMATION */
@keyframes phone-swing {
  0%, 100% { transform: rotate(4deg); }
  50%       { transform: rotate(-2deg); }
}

/* MODAL */
.modal-overlay{
  position:fixed;inset:0;z-index:200;
  background:rgba(10,10,10,.55);
  backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;pointer-events:none;
  transition:opacity .25s ease;
}
.modal-overlay.open{opacity:1;pointer-events:auto}
.modal-box{
  background:var(--bg);
  border:1px solid var(--ink);
  width:100%;max-width:540px;
  max-height:92vh;
  overflow-y:auto;
  position:relative;
  box-shadow:10px 10px 0 0 var(--accent);
}
.modal-close{
  position:absolute;top:16px;right:16px;z-index:1;
  width:36px;height:36px;
  border:1px solid var(--ink);background:transparent;color:var(--ink);
  font-size:16px;cursor:pointer;
  display:grid;place-items:center;
  transition:background .2s,color .2s;
}
.modal-close:hover{background:var(--ink);color:var(--bg)}
.modal-inner{padding:48px 40px 40px}
.modal-title{font-size:26px;font-weight:900;letter-spacing:-.02em;margin:8px 0 8px}
.modal-lead{font-size:12.5px;color:var(--muted);line-height:1.8;margin:0 0 28px}

.form-group{margin-bottom:18px}
.form-label{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;margin-bottom:7px}
.req{display:inline-block;font-size:10px;background:var(--ink);color:var(--bg);padding:2px 6px;margin-left:6px;letter-spacing:.08em}
.opt{display:inline-block;font-size:10px;background:var(--line);color:var(--muted);padding:2px 6px;margin-left:6px;letter-spacing:.08em}
.form-input{
  width:100%;padding:11px 13px;
  border:1px solid var(--ink);background:var(--bg);color:var(--ink);
  font-family:inherit;font-size:14px;outline:none;
  transition:border-color .15s,box-shadow .15s;
  appearance:none;border-radius:0;
}
.form-input:focus{border-color:var(--accent);box-shadow:3px 3px 0 0 var(--accent)}
textarea.form-input{resize:vertical;min-height:110px}
.cf-turnstile{margin:20px auto;display:flex;justify-content:center}
.form-privacy{margin-top:6px;display:flex;justify-content:center}
.check-label{display:flex;align-items:flex-start;gap:10px;font-size:13px;cursor:pointer;line-height:1.7}
.check-label input[type="checkbox"]{margin-top:3px;flex-shrink:0;accent-color:var(--ink);width:15px;height:15px;cursor:pointer}
.check-label a{color:var(--ink);font-weight:700}
.form-submit{width:100%;justify-content:center;padding:15px;font-size:14px;margin-top:20px}
.form-submit:disabled{opacity:.5;cursor:not-allowed;transform:none!important;box-shadow:none!important}

.modal-thanks{
  padding:64px 40px;
  flex-direction:column;align-items:center;
  gap:20px;text-align:center;
}
.modal-thanks:not([hidden]){display:flex}
.thanks-icon{
  width:60px;height:60px;
  background:var(--accent);border:1px solid var(--ink);
  display:grid;place-items:center;
  font-size:26px;font-weight:900;
}
.thanks-msg{font-size:16px;line-height:2;font-weight:500;margin:4px 0 8px}

@media(max-width:600px){
  .modal-inner{padding:48px 24px 32px}
  .modal-thanks{padding:48px 24px}
}