/* Vowtally 3.0 — precise, flat, editorial product design; no gradient or glow treatment. */
:root{
  --bg:#f7f7f5;--paper:#ffffff;--ink:#1b2028;--sub:#59616d;--soft-text:#818994;
  --blue:#3155ce;--blue-hover:#2044b9;--blue-tint:#edf1fc;--line:#dadde0;--line-strong:#c8cdd2;
  --surface:#f0f1ef;--surface-2:#e9ebeb;--shadow:none;--deep:#1b2028;--deep-2:#262c36;
  --green:#277459;--green-tint:#e8f1eb;--amber:#9c752f;--radius:9px;--max:1220px;
}
html[data-theme="dark"]{
  --bg:#12161b;--paper:#1c2229;--ink:#e8ebef;--sub:#a9b0b9;--soft-text:#88939e;
  --blue:#a6b8ff;--blue-hover:#bed0ff;--blue-tint:#28334e;--line:#353d46;--line-strong:#4b5561;
  --surface:#191e25;--surface-2:#232a32;--shadow:none;--deep:#171b21;--deep-2:#282e37;
  --green:#74c69d;--green-tint:#1c3630;--amber:#e1bf82;
}
*,*::before,*::after{box-shadow:none!important;text-shadow:none!important}
html{scroll-padding-top:95px}
body{font-family:Arial,"Helvetica Neue",Helvetica,"Segoe UI",sans-serif;font-size:15px;line-height:1.65;letter-spacing:0;background:var(--bg)}
h1,h2,h3,h4{letter-spacing:-.048em;line-height:1.12}
h1{font-weight:750}h2{font-weight:730}
p{color:var(--sub)}.shell{width:min(calc(100% - 104px),var(--max))}
::selection{background:#c8d3fe;color:#15204b}
a:hover{color:var(--blue)}
/* Quiet header system */
.announcement{background:#1b2028;color:var(--bg);min-height:32px;gap:18px;padding:5px 18px;font-size:11px;font-weight:400;letter-spacing:.005em}
.announcement-live{color:#fff;font-weight:800;letter-spacing:.08em;font-size:10px}
.announcement a{color:#d3dfff;font-size:11px;font-weight:600}.announcement-description{opacity:.76}
.live-dot{box-shadow:none!important;width:6px;height:6px}
.header{background:var(--paper);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid var(--line)}
.nav{height:75px}.brand{gap:10px}.brand-mark{width:33px;height:33px;filter:none}.brand-name{font-size:25px;letter-spacing:-.07em;font-weight:800}.brand-dot{display:none}
.nav-links{gap:32px}.nav-links a{font-size:13px;font-weight:600;letter-spacing:-.008em}
.theme-toggle,.menu-toggle{width:37px;height:37px;border-radius:6px;background:transparent;color:var(--sub);border:1px solid var(--line)}
.theme-toggle:hover,.menu-toggle:hover{background:var(--surface);color:var(--ink);border-color:var(--line-strong)}
.btn{border-radius:6px;font-size:12.5px;font-weight:700;letter-spacing:.01em;gap:22px;min-height:42px;transform:none!important;transition:background-color .15s,border-color .15s,color .15s}
.btn-primary{background:#3155ce;color:#fff!important;border-color:#3155ce}
.btn-primary:hover{background:#2449bc;border-color:#2449bc}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}.btn-ghost:hover{background:var(--surface)}
.btn-lg{min-height:51px;padding:0 22px;font-size:13px}.btn-white{color:var(--deep)!important;background:#fff;border-color:#fff}.btn-white:hover{background:#e8ecf3}
/* An editorial hero, with visible UI rather than decoration */
.hero{padding:85px 0 80px;background:var(--bg);overflow:visible;border-bottom:1px solid var(--line)}
.hero-grid{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:65px;align-items:center}
.hero-copy{padding:12px 0 28px}.pill{border-radius:4px;padding:0;background:transparent;border:0;color:var(--blue);font-size:10px;font-weight:800;letter-spacing:.12em;line-height:1.5}
.hero-pill{padding-left:13px;border-left:3px solid var(--blue);font-size:10px}.hero-pill span{display:none}
.hero h1{font-size:clamp(3.1rem,5vw,5rem);white-space:normal;line-height:1.035;letter-spacing:-.064em;margin:29px 0 26px;max-width:660px}
.h-gradient,html[data-theme="dark"] .h-gradient{background:none!important;color:var(--blue);-webkit-text-fill-color:currentColor}
.hero-description{font-size:16px;line-height:1.8;max-width:480px;margin-bottom:29px}
.hero-buttons{gap:12px}.hero-under{font-size:11.5px;gap:10px;margin-top:35px;color:var(--soft-text)}
.under-symbol{display:none}.under-separator{font-size:12px}
.hero-art{display:block;min-height:0;margin:0;padding:0}.ambient-orb,.hero-float,.hero-orbit-note,.closing-glow{display:none!important}
.preview-caption,.preview-bottom{font-size:10px;color:var(--sub);font-weight:750;letter-spacing:.105em}
.preview-caption{margin-bottom:12px}.preview-bottom{margin-top:11px;font-weight:500;letter-spacing:0;text-align:right}
.product-frame{border-radius:8px;background:var(--paper);border:1px solid var(--line-strong);transform:none!important;overflow:hidden}
.product-bar{height:48px;background:var(--paper);padding:0 19px}
.product-app-icon{border-radius:3px;background:#3155ce}.mock-dots i{border-radius:2px;width:8px;height:8px}
.product-body{grid-template-columns:121px minmax(0,1fr);min-height:403px}
.mock-sidebar{background:var(--surface);padding:22px 9px;gap:7px}
.mock-navitem{font-size:10px;border-radius:4px;padding:9px 8px;font-weight:650}.mock-navitem b{border-radius:3px}
.mock-active{background:var(--paper);color:var(--ink);border:1px solid var(--line)}
.mock-content{padding:24px 22px}.mock-overline{font-size:9px;font-weight:700;letter-spacing:.06em}
.mock-heading h3{font-size:20px}.mock-heading p{font-size:10px}.mock-chip{border-radius:3px;padding:5px 7px}
.mock-progress-head{font-size:10px;margin-top:27px}.mock-progress{height:5px;border-radius:0}.mock-progress span{background:#3155ce;border-radius:0}
.mock-request{padding:17px;margin-top:20px;border-radius:5px;background:var(--paper);border-color:var(--line-strong)}
.mock-request-icon{background:var(--surface);color:var(--ink);border-radius:4px}.mock-request-head strong{font-size:11px}.mock-request-head small{font-size:9px}
.mock-awaiting{border-radius:3px;font-size:8px}.mock-versus>div{border-radius:4px}.mock-versus strong{font-size:20px}
.mock-button{border-radius:4px}.mock-activity{border-radius:4px}
/* Typography and editorial section rhythm */
.audience-strip{background:var(--paper);border-bottom:1px solid var(--line)}
.strip-inner{padding-block:19px;justify-content:space-between;gap:14px}
.strip-label{font-size:10px;letter-spacing:.14em;font-weight:800;color:var(--soft-text)}
.strip-inner>span:not(.strip-label){font-size:12px;font-weight:700;color:var(--ink)}
.strip-symbol{display:none}
.section{padding:106px 0}.section-head{margin-bottom:43px}.section-head.centered{text-align:left;max-width:900px;margin-inline:0}
.section-head.centered p{margin-inline:0;max-width:570px}
.section-head h2{font-size:clamp(2.45rem,4.2vw,3.8rem);margin:17px 0 18px}
.section-head p{font-size:15px;line-height:1.8}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--blue)}.eyebrow-line{background:var(--blue);height:2px;width:17px}
.text-muted{color:var(--soft-text)}.intro-section{background:var(--bg)}
.value-grid{gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.value-item{background:transparent;border:0;border-radius:0;border-right:1px solid var(--line);padding:29px 27px 26px 27px;transform:none!important}
.value-item:first-child{padding-left:0}.value-item:last-child{border-right:0}.value-item:hover{border-color:var(--line)}
.value-number{font-family:monospace;font-size:12px;color:var(--blue)}.value-item h3{font-size:21px;margin:23px 0 10px}.value-item p{font-size:13px;line-height:1.75}
.features-section{background:var(--paper);border-block:1px solid var(--line)}
.split-head{grid-template-columns:1fr .65fr;gap:65px}.split-head p{align-self:end;padding-bottom:4px}
.features-grid{gap:14px}.feature-card{border:1px solid var(--line);border-radius:7px;transform:none!important;padding:28px 29px;background:var(--paper)}.feature-card:hover{border-color:var(--line-strong)}
.feature-card.spotlight{padding:35px 35px 0;gap:27px;min-height:335px}
.feature-tag{color:var(--blue);font-size:10px;letter-spacing:.11em}
.feature-icon{border-radius:4px!important;width:34px;height:34px;background:var(--surface)!important;color:var(--ink)!important;font-size:18px}
.feature-card h3{font-size:23px;line-height:1.2;letter-spacing:-.04em}.feature-card p{font-size:13.5px;line-height:1.8}
.feature-footnote,.micro-pill{background:transparent!important;color:var(--sub);font-size:11px;letter-spacing:.01em;border:0!important;padding:0!important;border-radius:0!important}
.feature-visual{background:var(--surface);border-radius:5px 5px 0 0;border-color:var(--line);padding:21px 19px 0}
.mini-board{border-radius:5px}.mini-board-top,.mini-board-body{background:var(--paper)}.mini-v-icon{border-radius:3px}.mini-approved{border-radius:3px}
.mini-overlay{border-radius:3px;background:var(--ink);color:var(--bg);border:1px solid var(--line-strong)}
.mini-card{min-height:240px}.mini-card h3{margin-top:25px}.mini-card .feature-icon{margin-top:24px}
/* Step-by-step module — tighter, less decorative */
.workflow-section{background:var(--bg)}.workflow-shell{border-radius:7px;gap:0}
.workflow-tabs{background:var(--paper)}.workflow-tab{border-radius:4px}.workflow-tab.is-active{background:var(--blue-tint);border-color:var(--line-strong)}
.workflow-tab b{color:var(--ink);font-size:14px}.flow-number{font-family:monospace;color:var(--blue)}
.workflow-preview{background:var(--surface);padding:24px}.preview-stage{border-radius:5px;padding:30px 26px 22px;margin-top:18px}
.flow-card{border-radius:5px}.flow-status{border-radius:3px}.preview-stage h3{font-size:25px}
/* Strong chapter break, no artificial halo */
.distinction-section{background:#202730;color:#f2f4f7;padding:100px 0}
.distinction-section:before{display:none}.difference-copy h2{font-size:clamp(2.3rem,4vw,3.65rem)}.difference-copy h2 span{color:#b2bfd2}.difference-copy>p{color:#b1bbc8}
.difference-list li{color:#d6dde6}.difference-list li span{border-radius:3px;color:#222c40;background:#c6d3ec}
.difference-panel{border-radius:6px;background:#29323d;border:1px solid #4b5665;padding:25px;color:#f6f7f9}
.difference-col{border-radius:4px;background:#202932}.difference-col.highlight-col{background:#303b4e;border:1px solid #627493}.difference-awaiting{border-radius:3px}
.difference-action{border-radius:3px}
/* Real customer types */
.audience-section{background:var(--bg)}.persona-grid{gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.persona{background:transparent;border:0;border-right:1px solid var(--line);padding:31px 22px;border-radius:0;transform:none!important}
.persona:first-child{padding-left:0}.persona:last-child{border-right:0}.persona:hover{background:var(--surface)}
.persona-icon{border-radius:3px;background:transparent;color:var(--blue);width:auto;height:auto;display:block;font-size:27px;margin-bottom:30px}
.persona h3{font-size:22px}.persona p{font-size:13px}.persona>span{font-weight:650;color:var(--sub)}
/* Early access, simple and trustworthy */
.beta-section{background:var(--paper);border-block:1px solid var(--line)}.beta-grid{gap:85px}
.beta-panel{border-radius:6px;padding:34px;background:var(--surface)}.beta-panel .pill{border-left:2px solid var(--blue);padding-left:9px}
.beta-panel h3{font-size:32px;margin-top:23px}.beta-panel-icon{color:var(--sub)}.beta-panel>p{font-size:13px}
.benefit-icon{background:var(--surface);border:1px solid var(--line);border-radius:3px;color:var(--blue)}
.field input,.field textarea{border-radius:4px;background:var(--paper)}.field input:focus{border-color:var(--blue);outline:2px solid color-mix(in srgb,var(--blue) 20%,transparent);outline-offset:1px}
.beta-submit{border-radius:4px}
.faq-section{background:var(--bg)}.faq-item summary{font-size:14px}.faq-item summary:after{color:var(--ink)}
.closing-section{background:var(--bg);padding:0 0 95px}
.closing-card{border-radius:5px;padding:69px 32px;text-align:left;background:#3155ce;color:#fff}
.closing-card h2{font-size:clamp(2.45rem,4.5vw,4.3rem);letter-spacing:-.06em;max-width:850px;margin:18px 0}
.closing-card h2 em{color:#e2e9ff;font-style:normal}.closing-card p{margin:0 0 23px;max-width:650px;color:#e5ebff}.closing-kicker{color:#d5dfff}
/* Footer and secondary pages */
.footer{background:#1b2028;color:#fff;padding:64px 0 29px}.footer-top{gap:48px}.footer .brand-name{color:#fff}
.footer-building .live-dot{background:#b0bdcc}.footer-column a{color:#aeb8c4}.footer-bottom{border-top-color:#3a424d;color:#a5afba}
.simple-header{background:var(--bg);padding:90px 0 70px}.simple-header h1{font-size:clamp(3rem,5vw,4.8rem);letter-spacing:-.06em}.simple-header p{line-height:1.8}
.prose{max-width:780px}.prose h2{font-size:2.1rem}.notice,.callout{border-radius:5px;background:var(--paper)}
/* Mobile and tablet: preserve function and clear hierarchy */
@media(max-width:1160px){.hero-grid{gap:34px}.hero h1{font-size:clamp(3.1rem,5.1vw,4.25rem)}.split-head{gap:32px}.beta-grid{gap:45px}}
@media(max-width:930px){
  .shell{width:min(calc(100% - 56px),var(--max))}.nav{height:66px}.nav-links{top:66px;background:var(--paper)}
  .hero{padding:74px 0 72px}.hero-grid{grid-template-columns:1fr;gap:43px}.hero h1{font-size:clamp(3.8rem,7.5vw,5.4rem);max-width:760px}
  .hero-copy{padding:0}.hero-art{width:min(100%,750px);min-height:0;margin:0}
  .section{padding:81px 0}.value-grid{grid-template-columns:repeat(3,1fr)}
  .features-grid{grid-template-columns:repeat(2,1fr)}.feature-card.spotlight{grid-template-columns:1fr 1fr}
  .workflow-shell{grid-template-columns:1fr 1.1fr}.persona-grid{grid-template-columns:repeat(2,1fr)}
  .persona:nth-child(2){border-right:0}.persona:nth-child(-n+2){border-bottom:1px solid var(--line)}.persona:nth-child(3){padding-left:0}
  .beta-grid{grid-template-columns:1fr;gap:38px}.faq-grid{grid-template-columns:1fr;gap:38px}
}
@media(max-width:630px){
  .shell{width:min(calc(100% - 36px),var(--max))}.announcement{min-height:35px}.announcement-description{display:none}.nav{height:61px}.nav-links{top:61px}
  .brand-name{font-size:24px}.brand-mark{height:31px;width:31px}
  .hero{padding:56px 0 57px}.hero h1{font-size:clamp(2.75rem,11vw,4.05rem);margin:24px 0 18px}
  .hero-description{font-size:15px;line-height:1.7}.hero-buttons{display:flex;gap:9px}.hero-buttons .btn{flex:1;min-width:0;font-size:11px;min-height:47px;padding:0 11px;gap:8px}
  .hero-under{margin-top:22px;font-size:10px}.hero-art{min-height:0;margin-top:0}.preview-caption{font-size:9px}.preview-bottom{font-size:10px;text-align:left}
  .product-body{grid-template-columns:76px minmax(0,1fr);min-height:290px}.product-bar{height:38px;padding:0 10px}
  .mock-sidebar{padding:11px 3px}.mock-navitem{font-size:7px;padding:7px 4px}.mock-content{padding:13px 9px}
  .mock-request{padding:8px}.mock-request-head strong{font-size:8px}.mock-request-head small{font-size:6px}.mock-versus strong{font-size:13px}
  .strip-inner{display:grid;grid-template-columns:1fr 1fr;gap:7px 20px;justify-items:start;padding-block:18px}.strip-label{grid-column:1/-1;text-align:left;font-size:9px}
  .section{padding:68px 0}.section-head{margin-bottom:27px}.section-head h2{font-size:clamp(2.15rem,9vw,3.1rem)}.section-head p{font-size:13px}
  .value-grid{grid-template-columns:1fr}.value-item,.value-item:first-child{padding:21px 0;border-right:0;border-bottom:1px solid var(--line)}.value-item:last-child{border-bottom:0}.value-item h3{margin:9px 0 6px;font-size:21px}
  .split-head{display:block}.features-grid{grid-template-columns:1fr;gap:10px}.feature-card.spotlight{grid-template-columns:1fr;padding:24px 23px 0;gap:0}.feature-card{padding:24px 23px;border-radius:5px}
  .feature-visual{padding:18px 12px 0}.feature-card.mini-card{min-height:0}.feature-card.mini-card h3{margin:14px 0 8px}
  .workflow-shell{grid-template-columns:1fr}.workflow-tabs{padding:11px}.workflow-tab{padding:13px 10px}.workflow-preview{padding:12px}.preview-stage{padding:19px 13px;min-height:0}
  .distinction-section{padding:70px 0}.difference-copy h2{font-size:clamp(2.2rem,9vw,3.3rem)}.difference-panel{padding:14px}.difference-col strong{font-size:20px}
  .persona-grid{grid-template-columns:1fr}.persona,.persona:first-child,.persona:nth-child(3){padding:25px 0;border-right:0;border-bottom:1px solid var(--line)}.persona:last-child{border-bottom:0}.persona-icon{margin-bottom:15px}.persona p{min-height:0;margin-bottom:20px}
  .beta-grid{gap:26px}.beta-panel{padding:24px 19px}.faq-grid{gap:25px}
  .closing-section{padding-bottom:62px}.closing-card{padding:46px 24px}.closing-card h2{font-size:clamp(2.2rem,9vw,3.15rem)}
  .simple-header{padding:61px 0 48px}.simple-header h1{font-size:clamp(2.8rem,9vw,3.9rem)}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}