*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:ui-sans-serif, -apple-system, system-ui, Segoe UI, Inter, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";color:#1d1d1f;background:#fff;line-height:1.5;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.skip{position:absolute;left:-9999px;top:auto}.skip:focus{left:16px;top:10px;background:#f5f5f7;padding:8px 12px;border-radius:10px}

:root{
  --text:#1d1d1f; --muted:#6e6e73; --panel:#ffffff; --panel-2:#f5f5f7; --line:rgba(0,0,0,.08);
  --shadow:0 8px 28px rgba(0,0,0,.06);
  --radius:18px; --radius-lg:28px;
}

/* Nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.72);backdrop-filter:saturate(120%) blur(12px);border-bottom:1px solid var(--line)}
.nav-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700}
.links{display:flex;gap:18px}
.links a{padding:8px;border-radius:8px}
.links a:hover{text-decoration:underline}
.actions{display:flex;align-items:center;gap:10px}
.hamburger{display:none;border:1px solid var(--line);background:#fff;padding:10px;border-radius:12px}
.hamburger span{display:block;width:20px;height:2px;background:#1d1d1f;margin:3px 0;border-radius:2px;transition:transform .2s ease, opacity .2s ease}
.hamburger.open span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;padding:20px;gap:16px;background:rgba(255,255,255,.96);backdrop-filter:blur(12px)}
.mobile-menu[hidden]{display:none}
.mobile-menu.open{display:flex}
.mobile-menu a{padding:12px 18px;border-radius:12px}
@media (max-width:900px){.links,.actions .btn-primary{display:none}.hamburger{display:grid}}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:12px 22px;font-weight:700;border:1px solid transparent}
.btn-primary{background:#000;color:#fff}
.btn-primary:hover{background:#111}
.btn-ghost{background:#fff;border-color:var(--line)}
.btn-ghost:hover{border-color:#d1d1d6}

/* Chevron text link (Apple-like) */
.chevron-link{display:inline-flex;align-items:center;gap:.35ch;color:#06c;font-weight:600}
.chevron-link::after{content:'›';font-size:1.1em;line-height:1}
.chevron-link:hover{text-decoration:underline}

/* Sections */
.section{padding:clamp(72px,10vw,140px) 20px}
.hero{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.hero-copy .eyebrow{margin:0 0 8px}
.hero h1{margin:0 0 12px;font-size:clamp(44px,6vw,76px);letter-spacing:-.04em;font-weight:600;text-wrap:balance}
.lead{color:var(--muted);font-size:clamp(18px,2vw,22px);max-width:68ch;text-wrap:pretty}
.cta-row{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap}
.hero-art{position:relative;min-height:380px}
/* Trusted by wordmarks */
.brands{display:flex;gap:18px;flex-wrap:wrap;margin:18px 0 0;padding:0;list-style:none;opacity:.8}
.brands li{font-weight:700;letter-spacing:.06em;color:#1d1d1f;border:1px solid var(--line);border-radius:999px;padding:8px 12px;background:#fff}

/* Device mocks */
.device{position:absolute;inset:auto;border-radius:24px;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);overflow:hidden}
.device .screen{height:100%;border-radius:inherit}
.device .gradient{background:linear-gradient(135deg,#e8eaed,#f5f5f7 40%,#e8eaed)}
.device .gradient.alt{background:linear-gradient(135deg,#e8eaed,#e3e4e8 40%,#f5f5f7)}
.device.device-l{width:520px;height:340px;right:0;top:20px}
.device.device-s{width:260px;height:180px;left:18%;bottom:0}
@media (max-width:980px){.hero{grid-template-columns:1fr}.device.device-l{position:relative;top:auto;right:auto;width:100%;height:320px}.device.device-s{display:none}}

/* Mock UI inside screens */
.device .screen{position:relative;overflow:hidden}
.device .screen.has-ui .titlebar{position:absolute;top:10px;left:12px;display:flex;gap:6px;opacity:.9}
.device .screen.has-ui .dot{width:8px;height:8px;border-radius:50%}
.device .screen.has-ui .dot.r{background:#ff5f57}
.device .screen.has-ui .dot.y{background:#ffbd2f}
.device .screen.has-ui .dot.g{background:#28c840}
.device .screen.has-ui .ui-text{position:absolute;left:18px;right:18px;top:40px;font-weight:700;letter-spacing:-.01em}
.device .screen.has-ui .ui-text.grid{display:grid;grid-auto-rows:12px;row-gap:10px}
.device .screen.has-ui .ui-text .tline{display:flex;align-items:center;font-size:12px;line-height:12px;border-radius:6px;color:#1d1d1f;opacity:.9}
.device .screen.has-ui .ui-text .tline.typing::after{content:'|';display:inline-block;margin-left:.06em;opacity:.6;animation:blink 1.1s steps(1,end) infinite}
.device .screen.has-ui .ui-text .tw{position:relative}
.device .screen.has-ui .ui-text .tw::after{content:'|';display:inline-block;margin-left:.06em;opacity:.6;animation:blink 1.1s steps(1,end) infinite}
.device .screen.has-ui .lines{position:absolute;left:18px;right:18px;top:40px;bottom:48px;display:grid;grid-auto-rows:12px;gap:10px}
.device .screen.has-ui .line{height:12px;border-radius:6px;background:rgba(0,0,0,.08);position:relative;overflow:hidden}
.device .screen.has-ui .line::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.65),transparent);transform:translateX(-100%);animation:shine 3.2s ease-in-out infinite}
.device .screen.has-ui .w90{width:90%}
.device .screen.has-ui .w80{width:80%}
.device .screen.has-ui .w70{width:70%}
.device .screen.has-ui .w65{width:65%}
.device .screen.has-ui .w55{width:55%}
.device .screen.has-ui .w40{width:40%}
.device .screen.has-ui .chips{position:absolute;left:14px;bottom:14px;display:flex;gap:8px}
.device .screen.has-ui .chip{border:1px solid var(--line);background:rgba(255,255,255,.8);backdrop-filter:blur(8px);padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;color:#1d1d1f;opacity:0;transform:translateY(6px);animation:chipIn .6s ease forwards}
.device .screen.has-ui .chips .chip:nth-child(2){animation-delay:.08s}
.device .screen.has-ui .chips .chip:nth-child(3){animation-delay:.16s}
.device .screen.has-ui .badge{position:absolute;right:14px;bottom:14px;border:1px solid var(--line);background:rgba(255,255,255,.75);backdrop-filter:blur(8px);padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;color:#1d1d1f}

@keyframes shine{to{transform:translateX(100%)}}
@keyframes blink{50%{opacity:0}}
@keyframes chipIn{to{opacity:1;transform:none}}

/* Highlights */
.highlights{background:var(--panel-2);border-block:1px solid var(--line)}
.highlights .grid{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.highlights article{background:#fff;border:1px solid var(--line);padding:22px;border-radius:var(--radius)}
.highlights h3{margin:0 0 8px;font-size:20px}
@media (max-width:900px){.highlights .grid{grid-template-columns:1fr}}

/* Metrics */
.metrics .metrics-grid{max-width:1000px;margin:0 auto;display:flex;flex-wrap:wrap;gap:18px}
/* Fallback with flex */
.metrics .metrics-grid > .metric{flex:1 1 280px}
/* Prefer grid when available */
@supports (display: grid){
  .metrics .metrics-grid{display:grid;grid-template-columns:repeat(3,1fr)}
  .metrics .metrics-grid > .metric{flex:initial}
}
.metrics{position:relative;background:radial-gradient(1200px 260px at 50% 0%, #f6f7fb, #fff 60%)}
.metric{background:transparent;border:none;border-radius:0;padding:18px 10px;display:grid;gap:8px;justify-items:center;text-align:center}
.metrics .metric + .metric{border-left:1px solid var(--line)}
.metric .num{font-size:clamp(40px,5.6vw,60px);font-weight:700;letter-spacing:-.02em;line-height:1.06}
.metric .num .unit{display:inline-block;font-size:.6em;opacity:.6;margin-left:.35ch}
.metric .label{margin:0;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem}
@media (max-width:900px){.metrics .metrics-grid{grid-template-columns:1fr}}

/* Split section */
.split{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.split .split-art{order:1}
.split .split-copy{order:2}
.split.alt .split-art{order:2}
.split.alt .split-copy{order:1}
.split .device-xl{position:relative;width:100%;height:420px;border-radius:28px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);overflow:hidden}
.split .device-xl .screen{background:linear-gradient(135deg,#f1f2f4,#f9f9fb)}
.split .eyebrow{color:var(--muted);font-weight:600;margin:0 0 6px}
.split h2{margin:0 0 12px;font-size:clamp(28px,4vw,40px);letter-spacing:-.02em;text-wrap:balance}
.split .body{color:var(--muted);max-width:62ch;text-wrap:pretty;hyphens:auto}
.ticks{margin:14px 0 0;padding-left:20px}
.ticks li{margin:6px 0}
@media (max-width:980px){.split{grid-template-columns:1fr}.split .split-art{order:2}.split .split-copy{order:1}}

/* Gallery */
.gallery .gallery-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px}
.gallery .gallery-grid .tile:nth-child(3){grid-column:2/4}
.tile{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--line);background:#fff}
.tile img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;filter:saturate(.96) contrast(1.05)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.28));pointer-events:none}
.tile figcaption{position:absolute;left:12px;bottom:10px;color:#fff;font-weight:700;letter-spacing:.02em;text-shadow:0 2px 8px rgba(0,0,0,.35)}
@media (max-width:980px){.gallery .gallery-grid{grid-template-columns:1fr 1fr}.gallery .gallery-grid .tile:nth-child(3){grid-column:auto}}
@media (max-width:560px){.gallery .gallery-grid{grid-template-columns:1fr}}

/* Text boxes (Principles) */
.textboxes .grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:980px){.textboxes .grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.textboxes .grid{grid-template-columns:1fr}}
.box{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);transform:translateY(6px);opacity:0}
.box::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;border-top-left-radius:inherit;border-top-right-radius:inherit;background:linear-gradient(90deg,#e7e8ec,#cfd4dc,#e9ecf1);background-size:200% 100%;animation:shimmer 12s linear infinite}
.textboxes.in .box{animation:rise .6s ease forwards}
.textboxes.in .box:nth-child(2){animation-delay:.06s}
.textboxes.in .box:nth-child(3){animation-delay:.12s}
.textboxes.in .box:nth-child(4){animation-delay:.18s}
.textboxes.in .box:nth-child(5){animation-delay:.24s}
.textboxes.in .box:nth-child(6){animation-delay:.30s}
.box h3{margin:0 0 8px;font-weight:700;letter-spacing:-.01em}
.box p{margin:0;color:var(--muted)}

@keyframes shimmer{to{background-position:200% 0}}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Cases */
.cases .case-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.case{display:grid;gap:12px}
.case-art{height:160px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(135deg,#f1f2f4,#fff 50%,#f6f7fb)}
.case-art.alt{background:linear-gradient(135deg,#eef0f3,#fff 40%,#f1f2f6)}
.case-art{position:relative;overflow:hidden}
/* Minimal Apple-like ambient pattern with rotating glow */
.case-art{background:
  radial-gradient(420px 120px at 20% 25%, rgba(0,0,0,.06), transparent 60%),
  radial-gradient(420px 120px at 80% 75%, rgba(0,0,0,.06), transparent 60%),
  linear-gradient(135deg,#f7f8fb,#ffffff)}
}
.case-art::after{content:"";position:absolute;inset:-40%;background:conic-gradient(from var(--a,0deg), rgba(0,0,0,.05), transparent 40%, rgba(0,0,0,.05));filter:blur(22px);opacity:.55;animation:spin 18s linear infinite}
.case-art::before{content:attr(data-tag);position:absolute;top:10px;left:12px;border:1px solid var(--line);background:rgba(255,255,255,.85);backdrop-filter:blur(6px);padding:4px 8px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.06em;color:#1d1d1f}
@keyframes spin{to{--a:360deg}}

/* Ornaments: orb + ring + grid */
.case-art{--c1:#0a84ff; --c2:#8e8eff}
.case-art[data-tag="AI"]{--c1:#0a84ff; --c2:#bf5af2}
.case-art[data-tag="Sync"]{--c1:#64d2ff; --c2:#30d158}
.case-art[data-tag="Ops"]{--c1:#ff9f0a; --c2:#30d158}
.case-art .orn{position:absolute;inset:0;pointer-events:none}
.case-art .orb{position:absolute;left:-10%;top:-20%;width:380px;height:260px;border-radius:50%;filter:blur(18px);opacity:.25;background:radial-gradient(closest-side,var(--c1), transparent 70%);animation:float 16s ease-in-out infinite}
.case-art .ring{position:absolute;right:-10%;bottom:-20%;width:70%;height:70%;border-radius:50%;background:conic-gradient(from 0deg, var(--c1), var(--c2));-webkit-mask:radial-gradient(closest-side, transparent calc(100% - 2px), #000 calc(100% - 2px));mask:radial-gradient(closest-side, transparent calc(100% - 2px), #000 calc(100% - 2px));opacity:.2;animation:spinRing 26s linear infinite}
.case-art .grid{position:absolute;inset:0;background:
  linear-gradient(0deg, rgba(0,0,0,.06) 1px, transparent 1px) 0 0/ 14px 14px,
  linear-gradient(90deg, rgba(0,0,0,.06) 1px, transparent 1px) 0 0/ 14px 14px;
  opacity:.1;animation:pan 30s linear infinite}

/* Beams + shine */
.case-art .beam{position:absolute;left:-40%;right:-40%;height:120px;border-radius:60px;filter:blur(12px);mix-blend-mode:screen;opacity:.22}
.case-art .beam.b1{top:-10%;transform:rotate(-22deg);background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--c1) 45%, transparent), transparent);animation:drift 20s ease-in-out infinite}
.case-art .beam.b2{bottom:-10%;transform:rotate(18deg);background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--c2) 45%, transparent), transparent);animation:drift 26s ease-in-out infinite reverse}
.case-art .shine{position:absolute;left:-50%;top:-20%;width:40%;height:140%;background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.12), rgba(255,255,255,0));transform:rotate(-18deg);opacity:0}
.case:hover .shine{animation:sweep 1.8s ease forwards}

@keyframes drift{50%{transform:translateX(6%) rotate(var(--r,0deg))}}
@keyframes sweep{from{opacity:0;transform:translateX(0) rotate(-18deg)} 10%{opacity:1} to{opacity:0;transform:translateX(220%) rotate(-18deg)}}

@keyframes float{50%{transform:translate(8px,6px)} 100%{transform:none}}
@keyframes spinRing{to{transform:rotate(360deg)}}
@keyframes pan{to{background-position:140px 140px}}

/* Subject SVGs */
.case-art svg.sub{position:absolute;inset:0;padding:10px}
.sub .dash{stroke-dasharray:160;stroke-dashoffset:160;animation:draw 1.8s ease forwards}
.sub.ai .dash.d2{animation-delay:.15s}
.sub.ai .dash.d3{animation-delay:.3s}
.sub.ai .dash.d4{animation-delay:.45s}
.sub.ai .pulse{animation:node 2.4s ease-in-out infinite}
.sub.ai .pulse.hub{animation:node 2.4s ease-in-out infinite, hub 5s ease-in-out infinite}
.sub.sync .dot{fill:var(--c2);filter:drop-shadow(0 0 2px color-mix(in srgb, var(--c2) 50%, transparent))}
.sub.sync .d1{animation:travel1 2.2s linear infinite}
.sub.sync .d2{animation:travel2 2.2s linear infinite}
.sub.ops .connect .p1,.sub.ops .connect .p2,.sub.ops .connect .p3{stroke-dasharray:40;stroke-dashoffset:40;animation:draw 1.6s ease forwards}
.sub.ops .connect .p2{animation-delay:.2s}
.sub.ops .connect .p3{animation-delay:.4s}
.sub.ops .check{stroke-dasharray:40;stroke-dashoffset:40;animation:draw 1.8s ease forwards .6s}

@keyframes node{50%{transform:scale(1.25);opacity:.85}}
@keyframes hub{50%{filter:drop-shadow(0 4px 18px color-mix(in srgb, var(--c1) 55%, transparent))}}
@keyframes travel1{to{transform:translateX(42px)}}
@keyframes travel2{to{transform:translateX(-42px)}}

/* Subject overlays */
.case-art .overlay{position:absolute;inset:0;pointer-events:none}
/* AI chat bubbles */
.overlay.ai{display:grid;gap:8px;align-content:end;padding:12px}
.overlay .bubble{max-width:70%;font-size:12px;border-radius:12px;padding:8px 10px;border:1px solid var(--line);background:rgba(255,255,255,.9);backdrop-filter:blur(4px);color:#1d1d1f}
.overlay .bubble.left{justify-self:start}
.overlay .bubble.right{justify-self:end}
.overlay .bubble .dots{display:inline-block;letter-spacing:2px;position:relative}
.overlay .bubble .dots::after{content:'•••';animation:ellipsis 1.3s infinite steps(4,end)}
@keyframes ellipsis{0%{content:''}25%{content:'•'}50%{content:'••'}75%{content:'•••'}100%{content:''}}

/* Sync pills */
.overlay.sync{display:flex;justify-content:space-between;align-items:flex-start;padding:12px}
.overlay .pill{font-size:11px;font-weight:700;border:1px solid var(--line);background:rgba(255,255,255,.92);backdrop-filter:blur(4px);padding:6px 10px;border-radius:999px}

/* Ops progress */
.overlay.ops{display:grid;gap:6px;align-content:end;padding:12px}
.overlay .progress{height:8px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.8);overflow:hidden}
.overlay .progress .fill{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--c1),var(--c2));animation:load 4.2s ease-in-out infinite}
.overlay .status{font-size:11px;color:#1d1d1f;opacity:.8;justify-self:end}
@keyframes load{50%{width:86%}100%{width:0}}

/* Professional motion: respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .case-art::after,.case-art .orb,.case-art .ring,.case-art .grid,
  .case-art .beam,.case-art .shine,
  .sub .dash,.sub.ai .pulse,.sub.ai .pulse.hub,
  .sub.sync .d1,.sub.sync .d2,
  .sub.ops .connect .p1,.sub.ops .connect .p2,.sub.ops .connect .p3,.sub.ops .check,
  .overlay .progress .fill{
    animation: none !important;
  }
}
.case-copy{display:grid;gap:6px;max-width:62ch}
.case .eyebrow{margin:0}
.case h3{margin:0;font-size:22px;letter-spacing:-.01em;font-weight:600}
.case .body{margin:0;color:var(--muted);text-wrap:pretty;hyphens:auto}
@media (max-width:1000px){.cases .case-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.cases .case-grid{grid-template-columns:1fr}}

/* Capabilities */
.caps-head{text-align:center;max-width:900px;margin:0 auto 28px}
.caps .cards{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.caps .card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;min-height:140px}
.caps .card h3{margin:0 0 8px;font-size:20px}
.caps .card p{margin:0;color:var(--muted)}
@media (max-width:1000px){.caps .cards{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.caps .cards{grid-template-columns:1fr}}

/* Products */
.products .cards{max-width:1000px;margin:0 auto}
.product{display:flex;gap:16px;align-items:center;border:1px solid var(--line);border-radius:var(--radius);padding:18px;background:#fff}
.product img{width:52px;height:52px;border-radius:14px;object-fit:cover}
.product h3{margin:0 0 4px}
.product p{margin:0 0 6px;color:var(--muted)}

/* Team band */
.team-band{background:var(--panel-2);border-block:1px solid var(--line)}
.team-head{max-width:900px;margin:0 auto 24px;text-align:center}
.team-grid{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:0;list-style:none}
.tcard{display:grid;justify-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:var(--shadow);transition:transform .2s ease}
.tcard:hover{transform:translateY(-2px)}
.avatar{position:relative}
.avatar img{width:104px;height:104px;border-radius:50%;object-fit:cover;filter:saturate(.92)}
.avatar .ring{position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--line);box-shadow:0 0 0 6px rgba(255,255,255,.7) inset}
.tcard h3{margin:6px 0 2px;font-size:18px;letter-spacing:-.01em}
.tcard .role{margin:0;color:var(--muted);font-size:.92rem;text-align:center}
.tcard .links{display:flex;gap:8px;margin-top:6px}
.team-note{max-width:900px;margin:16px auto 0;text-align:center;color:var(--muted)}
@media (max-width:820px){.team-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.team-grid{grid-template-columns:1fr}}

/* Contact */
.contact .contact-card{max-width:820px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow)}
.contact h2{margin:0 0 8px;font-size:clamp(28px,4vw,40px)}
.contact .body{color:var(--muted);margin:0 0 14px}
.form{display:grid;gap:12px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.actions{align-items:center}
input,textarea{border:1px solid var(--line);background:#fff;color:var(--text);border-radius:14px;padding:12px 14px;font:inherit}
input::placeholder,textarea::placeholder{color:#8e8e93}
textarea{resize:vertical}
@media (max-width:720px){.row{grid-template-columns:1fr}}

.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.notice{margin-top:12px;padding:14px;border:1px solid var(--line);background:#f6f7fb;border-radius:14px;color:#1d1d1f}
.notice.success{border-color:#d1e7dd;background:#e9f7f1}
.notice.error{border-color:#f5c2c7;background:#fde2e4}

/* Footer */
.footer{border-top:1px solid var(--line);background:#fff;padding:28px 20px}
.footer-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.foot-links{display:flex;gap:12px;flex-wrap:wrap}
.copy{color:var(--muted)}

/* Reveals */
.reveal{opacity:0;transform:translateY(8px);transition:opacity .6s ease, transform .6s ease}
.reveal.in{opacity:1;transform:none}

/* Apple-style typography helpers */
.eyebrow{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:600;font-size:.78rem}

/* Responsive type & spacing refinements */
@media (max-width:900px){
  .section{padding:clamp(56px,8.5vw,100px) 18px}
  .hero h1{font-size:clamp(36px,7vw,54px)}
  .lead{font-size:clamp(16px,2.4vw,20px)}
  .split h2{font-size:clamp(24px,5vw,34px)}
}
@media (max-width:560px){
  .section{padding:clamp(48px,8vw,80px) 16px}
  .hero h1{font-size:clamp(30px,8vw,40px)}
  .lead{font-size:clamp(15px,3.2vw,18px)}
  .split h2{font-size:clamp(22px,6vw,32px)}
}