:root{
  --case:#cf321f;
  --gollaju-tomato:#cf321f;
  --gollaju-mustard:#ffc531;
  --gollaju-soda:#245cc2;
  --gollaju-ink:#24160e;
}
body{word-break:keep-all;overflow-wrap:break-word}
.hero-copy p{margin:0 0 28px}
.hero-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hero-actions .button{gap:8px;background:var(--gollaju-tomato)}
.hero-actions .button.secondary{border:1px solid var(--line);background:transparent;color:var(--ink)}
.browser-shot{margin:0;overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.browser-bar{height:38px;display:flex;align-items:center;gap:7px;padding:0 15px;border-bottom:1px solid var(--line);background:#f4efdf}
.browser-bar i{width:9px;height:9px;border:1px solid rgba(23,22,16,.55);border-radius:50%;background:var(--gollaju-tomato)}
.browser-bar i:nth-child(2){background:var(--gollaju-mustard)}
.browser-bar i:nth-child(3){background:var(--gollaju-soda)}
.browser-bar span{margin-left:auto;color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:10px;font-style:normal;letter-spacing:.04em}
.browser-shot img{width:100%;height:auto}
.section-grid>*{min-width:0}
.body-copy{min-width:0}
.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:72px;border:1px solid var(--line);background:var(--line)}
.mode{min-height:290px;padding:34px;background:var(--surface);display:flex;flex-direction:column;border-top:7px solid var(--gollaju-tomato)}
.mode:nth-child(2){border-top-color:var(--gollaju-mustard)}
.mode:nth-child(3){border-top-color:var(--gollaju-soda)}
.mode-num{color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.04em}
.mode-icon{margin:38px 0 12px;font-size:34px}
.mode h3{margin:0 0 14px;font-size:24px;letter-spacing:-.025em}
.mode p{margin:auto 0 0;color:var(--muted);font-size:15px;line-height:1.7}
.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,26px);align-items:start;margin-top:72px}
.gallery figure:nth-child(3){grid-column:auto;display:block}
.phone{margin:0;padding:9px 9px 13px;border:1px solid var(--line);background:var(--surface)}
.phone:nth-child(even){margin-top:46px}
.phone img{width:100%;height:auto;border:1px solid var(--line);border-radius:10px}
.phone figcaption{padding:12px 3px 0;color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:500;line-height:1.5;letter-spacing:.02em}
.proof-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;width:100%;min-width:0;margin-top:54px}
.proof{min-width:0;padding:24px;border-top:1px solid var(--ink)}
.proof strong{display:block;margin-bottom:8px;font-size:18px}
.proof span{color:var(--muted);font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.live-cta{padding:clamp(90px,13vw,170px) 0;text-align:center}
.live-cta h2{max-width:900px;margin:20px auto 38px;font-size:clamp(40px,6vw,82px);line-height:1.08;letter-spacing:-.05em}
.live-cta .button{background:var(--gollaju-tomato)}
.live-url{margin:22px 0 0;color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.03em}
@media(max-width:980px){
  .mode-grid{grid-template-columns:1fr}
  .mode{min-height:230px}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .proof-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .hero-actions{align-items:stretch;flex-direction:column}
  .hero-actions .button{width:100%}
  .browser-bar span{display:none}
  .gallery{gap:12px}
  .phone{padding:5px 5px 9px}
  .phone:nth-child(even){margin-top:28px}
}
@media(prefers-reduced-motion:reduce){.button{transition:none!important}}
