/* Phone layouts: readable type, deliberate spacing, and comfortable touch targets. */
@media (max-width:720px) {
  :root { --header-height:calc(72px + env(safe-area-inset-top,0px)); --ribbon-height:56px; }
  html { scroll-padding-top:calc(var(--header-height) + 16px); -webkit-text-size-adjust:100%; }
  body { overflow-wrap:break-word; }
  .container { width:calc(100% - 40px); }
  main, section, article, .studio-copy, .scenario-copy, .contact-copy { min-width:0; }
  .header { height:var(--header-height); padding-top:env(safe-area-inset-top,0px); }
  .header .nav-wrap { gap:8px; }
  .header .logo { width:90px; height:44px; }
  .header .logo img { top:-6px; }
  .header .nav-cta { min-height:44px; font-size:12px; gap:10px; padding:6px 7px 6px 14px; box-shadow:none; }
  .header .nav-cta .circle { width:30px; height:30px; }
  .header .menu-toggle { width:44px; height:44px; padding:12px; flex-shrink:0; }
  .header .nav-wrap nav { top:var(--header-height); padding:8px 20px 16px; max-height:calc(100dvh - var(--header-height) - 16px); overflow-y:auto; overscroll-behavior:contain; }
  .header .nav-wrap nav a { min-height:52px; display:flex; align-items:center; padding:12px 8px; border-bottom:1px solid #e7e8eb; font-size:16px; }
  .header .nav-wrap nav a:last-child { border:0; }
  .section { padding-block:64px; }
  .section-top { margin-bottom:28px; }
  .section-top h2, .problem-copy h2, .faq-title h2 { font-size:clamp(1.9rem,8vw,2.5rem); line-height:1.3; }
  .section-top>p, .section-description, .problem-copy .section-description { font-size:16px; line-height:1.8; }
  .section-top>p br, .studio-copy h3+p br { display:none; }
  .section-top .eyebrow, .problem-copy .eyebrow, .faq-title .eyebrow { font-size:12px; line-height:1.6; margin-bottom:20px; }
  .hero-v2 { padding-top:24px; padding-bottom:18px; }
  .hero-v2 .eyebrow { font-size:10px; letter-spacing:.06em; margin-bottom:25px; }
  .hero-v2 h1 { font-size:clamp(28px,8.4vw,56px); }
  .hero-v2 .hero-bottom { margin-top:25px; gap:20px; }
  .hero-bottom>p { font-size:16px; line-height:1.75; }
  .hero-explore { min-height:62px; width:238px; }
  .hero-explore small { font-size:12px; }
  .hero-explore strong { font-size:16px; }
  .hero-v2 .hero-machine { margin-top:24px; padding-block:22px; gap:20px; }
  .hero-machine .machine-input>small, .hero-machine .machine-output>small { font-size:10px; }
  .hero-machine .rolling-words span { font-size:15px; }
  .hero-machine .machine-output>strong { font-size:15px; }
  .hero-v2 .hero-foot { margin-top:16px; min-height:32px; }
  .hero-foot a { min-height:36px; font-size:11px; }
  .hero-foot>span { display:none; }
  .marquee-content a { display:flex; align-items:center; min-height:44px; }
  .problem-experience { gap:32px; }
  .problem-options button { min-height:88px; padding-block:18px; }
  .problem-options button small { font-size:12px; }
  .problem-options button strong { font-size:17px; line-height:1.45; }
  .comparison-heading>small, .comparison-label>span, .before-number, .after-number { font-size:12px; }
  .comparison-label>b, .before-note { font-size:14px; }
  .before-list>li { grid-template-columns:20px minmax(0,1fr) auto; gap:10px; }
  .before-label { font-size:16px; }
  .after-flow { gap:16px; }
  .after-label { font-size:14px; }
  #about .editorial-comparison .after-stage h3 { font-size:clamp(1.6rem,7.5vw,2rem); }
  .studio-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .studio-tabs button { min-height:96px; padding:14px 9px; }
  .studio-tabs button>small { font-size:12px; margin-bottom:7px; }
  .studio-tabs button>b { font-size:16px; }
  .studio-tabs button>span { font-size:13px; margin-top:7px; line-height:1.4; }
  .studio-tabs button[aria-selected=true] { background:#fff; }
  .studio-panel { gap:24px; }
  .studio-copy h3 { font-size:clamp(1.7rem,7.5vw,2.1rem); line-height:1.4; }
  .studio-copy h3+p { font-size:16px; line-height:1.8; }
  .tags { gap:7px; }
  .tags span { font-size:12px; padding:7px 9px; }
  .studio-copy .text-link { min-height:44px; width:fit-content; font-size:15px; margin-top:16px; padding-block:10px; }
  .studio-visual { min-height:340px; padding:26px 18px; }
  .studio-visual-caption { position:static; font-size:10px; margin-bottom:18px; gap:10px; }
  .studio-bottom { font-size:12px; line-height:1.7; gap:12px; margin-top:24px; }
  .studio-bottom>span:last-child { white-space:nowrap; }
  .web-device-switch button { min-width:44px; min-height:44px; font-size:14px; padding:8px 10px; }
  .web-showcase-top { gap:10px; }
  .web-showcase-label { font-size:10px; letter-spacing:.06em; }
  .web-showcase-top small { font-size:12px; line-height:1.5; }
  .web-showcase-stage { padding:14px; }
  .showcase-viewport { height:350px; }
  .web-showcase-bottom { font-size:12px; }
  .demo-dashboard { margin-top:0; padding:16px 12px; }
  .dashboard-nav, .dashboard-tabs { font-size:12px; }
  .dashboard-table>div { grid-template-columns:minmax(0,1.3fr) .65fr .9fr; font-size:12px; gap:8px; line-height:1.55; padding:15px 0; }
  .dashboard-table>div:first-child { font-size:12px; }
  .dashboard-table em { font-size:11px; padding:4px; white-space:normal; background:#f1f2f4; color:#424751; }
  .dashboard-foot { font-size:14px; line-height:1.6; }
  .voice-wave { gap:4px; }
  .voice-wave i { flex-shrink:1; }
  .demo-call h4 { font-size:17px; line-height:1.55; }
  .demo-call>p { font-size:16px; line-height:1.7; }
  .demo-call>small { font-size:12px; line-height:1.6; }
  .call-actions { font-size:12px; gap:6px; flex-wrap:wrap; margin-top:22px; }
  .call-actions>span { padding:10px 8px; }
  .agent-message { margin-left:20px; font-size:16px; padding:16px; }
  .agent-response { gap:10px; }
  .agent-response>div { min-width:0; }
  .agent-response b { font-size:16px; line-height:1.5; }
  .agent-task { font-size:14px; line-height:1.7; }
  .create-format small, .create-format>span { font-size:10px; }
  .create-format { padding:14px; }
  .create-format strong { font-size:2.15rem; }
  .format-two strong { font-size:1.35rem; }
  #studio-FLOW .flow-workbench { padding:22px 18px; }
  .flow-workbench-heading b { font-size:17px; }
  .flow-workbench-heading small { font-size:12px; }
  .flow-replay { min-height:44px; font-size:14px; }
  .flow-example-switch { margin-top:16px; }
  .flow-example-switch button { min-height:48px; font-size:14px; padding-inline:4px; }
  .automation-input>p { font-size:16px; }
  .automation-step-head>b { font-size:14px; }
  .automation-step-head>small, .automation-number { font-size:12px; }
  .automation-fields dt { font-size:12px; }
  .automation-fields dd { font-size:14px; }
  .automation-results small, .flow-workbench-note { font-size:12px; }
  .scenario-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .scenario-tabs button { font-size:14px; min-height:60px; padding:10px 8px; border-radius:6px; line-height:1.45; }
  .scenario-panel { padding:26px 18px; gap:26px; }
  .scenario-copy h3 { font-size:clamp(1.6rem,7vw,2rem); }
  .scenario-copy .eyebrow { font-size:11px; overflow-wrap:anywhere; line-height:1.6; }
  .scenario-copy>p:not(.eyebrow) { font-size:16px; line-height:1.8; }
  .scenario-disclaimer { font-size:12px; line-height:1.7; }
  .workflow { padding:18px 14px; }
  .workflow-heading { font-size:10px; gap:8px; }
  .run-workflow { min-height:44px; font-size:14px; padding:8px 10px; white-space:nowrap; }
  .workflow li { padding:16px 11px; gap:11px; opacity:1; }
  .workflow li>div { min-width:0; }
  .workflow li strong { font-size:14px; line-height:1.65; }
  .workflow li small { font-size:12px; line-height:1.5; color:#a7afbc; }
  .workflow li.active-step { transform:none; }
  .workflow-status { font-size:13px; line-height:1.65; color:#b3bac6; }
  .workflow-footer { font-size:10px; gap:6px; }
  .manifesto { min-height:0; height:auto; }
  .manifesto-sticky { position:relative; top:auto; min-height:0; padding:72px 0; }
  .manifesto h2 { font-size:clamp(1.55rem,6.8vw,2.4rem); line-height:1.6; }
  .manifesto .eyebrow { font-size:12px; }
  .manifesto .promise-row { font-size:12px; gap:18px; }
  .manifesto .promise-row b { font-size:15px; }
  .promise-cross { font-size:350px; }
  #process { padding:64px 20px; }
  .process-grid { gap:14px; }
  .process-grid li { padding:22px 16px; grid-template-columns:36px minmax(0,1fr); gap:0 14px; }
  .process-grid h3 { font-size:17px; line-height:1.5; }
  .process-grid p { font-size:16px; line-height:1.8; }
  .process-grid small { font-size:12px; line-height:1.6; }
  .process-grid li.process-active:nth-child(n) { transform:none; }
  .price-card .service-name { font-size:12px; }
  .pricing-grid .price-card li { font-size:15px; gap:12px; line-height:1.65; }
  .price-card .price-link { min-height:52px; font-size:15px; }
  .pricing-note { font-size:13px; color:#696f78; line-height:1.85; }
  .faq-list summary { min-height:64px; font-size:16px; line-height:1.6; padding:20px 0; }
  .faq-list summary>span { flex-shrink:0; }
  .faq-list details p { font-size:16px; line-height:1.85; }
  .contact-section { padding:64px 0; }
  .contact-copy { position:static; padding-top:0; }
  .contact-copy h2 { font-size:clamp(1.9rem,8vw,2.5rem); }
  .contact-copy .eyebrow { font-size:11px; line-height:1.6; }
  .contact-copy>p:not(.eyebrow) { font-size:16px; line-height:1.8; color:#b4bac4; }
  .contact-equation { font-size:13px; }
  .project-form { padding:24px 18px; border-radius:10px; }
  .project-form h3 { font-size:20px; line-height:1.5; }
  .project-form>label, .form-row>label, .project-form legend { font-size:14px; }
  .project-form legend>span { font-size:12px; }
  .form-row { grid-template-columns:1fr; gap:0; }
  .service-choices { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .service-choices span { min-height:44px; display:flex; align-items:center; justify-content:center; font-size:14px; padding:10px 8px; }
  .project-form input:not([type=checkbox]), .project-form textarea { font-size:16px; min-height:50px; padding:14px 12px; color:#f1f2f4; }
  .project-form input::placeholder, .project-form textarea::placeholder { color:#9aA2af; }
  .project-form textarea { min-height:160px; line-height:1.7; }
  .submit-button { min-height:56px; font-size:15px; padding-left:16px; gap:10px; }
  .submit-button .circle { width:32px; height:32px; }
  .project-form .form-notice { font-size:12px; color:#a3acb9; line-height:1.8; text-align:left; }
  .project-form #form-status { font-size:14px; line-height:1.7; }
  .footer-top { gap:15px 22px; }
  .footer-top p { font-size:14px; }
  .footer-top>a:last-child { min-height:44px; display:flex; align-items:center; font-size:12px; margin-left:0; }
  .footer-bottom { font-size:12px; line-height:1.7; gap:10px 20px; padding-bottom:calc(48px + env(safe-area-inset-bottom,0px)); }
  .motion-control { width:44px; height:44px; left:max(12px,env(safe-area-inset-left,0px)); bottom:calc(12px + env(safe-area-inset-bottom,0px)); font-size:14px; }
  body:has(.project-form input:focus) .motion-control, body:has(.project-form textarea:focus) .motion-control { visibility:hidden; }
  .js-motion .reveal { transition-duration:.45s; }
}
@media (max-width:360px) {
  .container { width:calc(100% - 32px); }
  .header .nav-wrap { gap:4px; }
  .header .logo { width:78px; }
  .header .logo img { width:146px; height:49px; left:-33px; top:-2px; }
  .header .nav-cta { padding-left:11px; gap:7px; font-size:11px; }
  .hero-v2 .eyebrow { font-size:9px; letter-spacing:.025em; }
  .hero-machine .machine-output>strong { font-size:14px; }
  .studio-tabs button { padding-inline:6px; }
  .studio-tabs button>b { font-size:15px; }
  .before-list>li { grid-template-columns:18px minmax(0,1fr) auto; gap:7px; }
  .before-note { font-size:12px; }
  .web-showcase-label { font-size:9px; }
  .web-showcase-top small { font-size:11px; }
  #studio-FLOW .flow-workbench { padding-inline:14px; }
  .flow-workbench-heading b { font-size:16px; }
  .automation-step-head { gap:7px; }
  .automation-sequence .automation-process { padding-inline:13px; }
  .automation-fields>div { grid-template-columns:60px 1fr; gap:8px; }
  .scenario-panel { padding-inline:14px; }
  .workflow { padding-inline:11px; }
  .workflow-heading { font-size:9px; }
  #process { padding-inline:16px; }
}
@media (hover:none) and (max-width:900px) {
  .button:hover, .price-card:hover { transform:none; }
  .hero-explore:hover .explore-arrow { transform:none; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
}
@media(max-width:720px){
  html{overflow-x:clip}
  .studio-visual-caption,.studio-bottom,.dashboard-tabs,.dashboard-table>div:first-child,.dashboard-foot{color:#69717d}
  .flow-workbench-note,.automation-results small{color:#69717d}
  .hero-machine .machine-input>small,.hero-machine .machine-output>small{color:#727986}
}
@media(max-width:360px){.hero-v2{padding-top:20px;padding-bottom:14px}}
.scenario-tabs button>small{font:inherit}
@media(max-width:720px){
  .scenario-tabs button>span:first-child{display:block;font-size:14px}
  .scenario-tabs button>.scenario-separator{display:none}
  .scenario-tabs button>small{display:block;font-size:12px;margin-top:3px}
  .agent-task,.agent-input{color:#69717d}
  .demo-agent{margin-top:12px}
}
@media(max-width:720px){
  .header{background:#fff;backdrop-filter:none}
  .service-choices input:checked+span{background:#ff6a2a;border-color:#ff6a2a;color:#111318}
  .scenario-tabs button[aria-selected=true]{background:#ff6a2a;border-color:#ff6a2a}
}
@media(max-width:720px){
  .process-grid li>span{font-size:30px;line-height:1.2;white-space:nowrap}
  .process-grid p{color:#626b78}
  .process-grid small{color:#69717d}
}