/* Enquire Studio shared stylesheet.
   Used by /workflow/, its vertical pages, /workflow/review/ and /tools/roi/.
   The homepage and /quick-sites/ stay single-file by design; do not migrate them.
   Extracted from the automation page so the light-theme service pages share one
   source of truth. Adding a component here beats repeating it on five pages.
   No em-dashes. ASCII source. */

@font-face{font-family:'Newsreader Fallback';src:local('Georgia');size-adjust:98%;ascent-override:94%;descent-override:24%;line-gap-override:0%;}

:root{
  --midnight:#0B1642; --depth:#070E2E; --porcelain:#F5F2EC; --bone:#E8E2D6;
  --klein:#2447E0; --klein-bright:#8CA3FF; --klein-deep:#1F3BB3;
  --mist:rgba(245,242,236,.68); --line:rgba(245,242,236,.16); --line-ink:rgba(23,25,27,.12);
  --ink:#17191B; --slate:#565B60; --paper:#FBFAF7; --card:#ffffff;
  --green:#1f9d57; --wash:#eef1fd; --wash-line:#dde3fb;
  --serif:'Newsreader','Newsreader Fallback',Georgia,serif;
  --sans:'Space Grotesk',system-ui,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --shadow-sm:0 2px 14px rgba(11,22,66,.06); --shadow-md:0 18px 46px -20px rgba(11,22,66,.28);
}

*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--sans);font-weight:400;color:var(--ink);background:var(--paper);
  line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
::selection{background:var(--klein);color:var(--porcelain);}
img{max-width:100%;display:block;}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.06;letter-spacing:-.01em;text-wrap:balance;color:var(--ink);}
.it{font-style:italic;color:var(--klein-deep);}
.eyebrow{font-weight:500;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--slate);}
.wrap{width:min(1080px,92vw);margin-inline:auto;}
.sec{padding:clamp(3.2rem,8vh,5.4rem) 0;}
a{color:inherit;}
.lede{color:var(--slate);font-size:1.05rem;max-width:60ch;margin-top:1rem;}
.mt{margin-top:1.6rem;}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.dark{background:var(--midnight);color:var(--porcelain);}
.dark h1,.dark h2,.dark h3{color:var(--porcelain);}
.dark .eyebrow{color:var(--mist);}
.dark .it{color:var(--klein-bright);}
.dark p{color:var(--mist);}
.tint{background:var(--wash);}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--sans);
  font-weight:500;font-size:.88rem;letter-spacing:.02em;cursor:pointer;text-decoration:none;
  padding:.9rem 1.7rem;border:1.5px solid var(--klein);color:var(--porcelain);background:var(--klein);
  border-radius:8px;transition:background .25s var(--ease),border-color .25s var(--ease),transform .2s var(--ease);}
.btn:hover{background:var(--klein-deep);border-color:var(--klein-deep);transform:translateY(-1px);}
.btn--ghost{background:transparent;border-color:var(--line-ink);color:var(--ink);}
.btn--ghost:hover{background:var(--ink);border-color:var(--ink);color:var(--bone);}
.dark .btn--ghost{border-color:rgba(245,242,236,.4);color:var(--porcelain);}
.dark .btn--ghost:hover{background:var(--porcelain);color:var(--midnight);border-color:var(--porcelain);}
.btn--wa{background:#25D366;border-color:#25D366;color:#062b14;}
.btn--wa:hover{background:#1eb857;border-color:#1eb857;color:#062b14;}

/* topbar */
.topbar{position:sticky;top:0;left:0;right:0;z-index:90;display:flex;align-items:center;
  justify-content:space-between;padding:.9rem clamp(1rem,4vw,2.4rem);
  background:rgba(11,22,66,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.topbar__mark{font-family:var(--serif);font-size:1.1rem;color:var(--porcelain);text-decoration:none;}
.topbar__mark i{font-style:italic;color:var(--klein-bright);}
.topbar__tag{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist);
  border-left:1px solid var(--line);padding-left:.8rem;margin-left:.6rem;display:none;}
@media(min-width:640px){.topbar__tag{display:inline;}}
.topbar .btn{padding:.5rem .95rem;font-size:.75rem;}

/* hero */
.hero{padding:clamp(3rem,8vh,5.2rem) 0 clamp(2rem,5vh,3rem);}
.hero h1{font-size:clamp(2.2rem,5.4vw,3.5rem);max-width:19ch;}
.hero .sub{margin-top:1.1rem;color:var(--slate);font-size:1.05rem;max-width:52ch;}
.hero .badges{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.1rem;}
.pill{font-size:.74rem;font-weight:500;color:var(--klein-deep);background:var(--wash);
  border:1px solid var(--wash-line);padding:.4rem .8rem;border-radius:999px;}
.hero .cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.7rem;}

/* breadcrumb */
.crumb{font-size:.8rem;color:var(--slate);padding-top:1.4rem;}
.crumb a{color:var(--klein-deep);text-decoration:underline;text-underline-offset:2px;}

/* the live demo band */
.try{background:var(--midnight);color:var(--porcelain);}
.try .wrap{padding:clamp(2.6rem,7vh,4rem) 0;}
.try h2{font-size:clamp(1.7rem,3.6vw,2.6rem);max-width:22ch;color:var(--porcelain);}
.try p{color:var(--mist);max-width:56ch;margin-top:.9rem;}
.addr{display:inline-block;margin-top:1.4rem;font-family:var(--sans);font-weight:600;
  font-size:clamp(.95rem,2.4vw,1.3rem);color:var(--porcelain);background:rgba(245,242,236,.08);
  border:1px solid var(--line);border-radius:10px;padding:.9rem 1.2rem;word-break:break-all;
  text-decoration:none;}
.addr:hover{background:rgba(245,242,236,.14);}
.try .note{font-size:.86rem;color:var(--mist);margin-top:1rem;}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2.2vw,1.6rem);margin-top:2.2rem;}
.stp{border-top:2px solid var(--klein);padding-top:1rem;}
.stp b{font-family:var(--serif);font-weight:400;font-size:1.15rem;display:block;}
.stp span{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--klein-deep);font-weight:600;}
.stp p{color:var(--slate);font-size:.92rem;margin-top:.45rem;}

/* workflow rows: the problem, what it costs, what changes */
.wfrow{border-top:1px solid var(--line-ink);padding:1.5rem 0;display:grid;
  grid-template-columns:1.1fr 1fr 1fr;gap:clamp(1rem,3vw,2.2rem);align-items:start;}
.wfrow:last-of-type{border-bottom:1px solid var(--line-ink);}
.wfrow h3{font-size:1.18rem;}
.wfrow .k{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);
  font-weight:600;display:block;margin-bottom:.35rem;}
.wfrow p{color:var(--slate);font-size:.93rem;}
.wfrow .now{color:var(--slate);}
.wfrow .then{color:var(--ink);}
@media(max-width:820px){.wfrow{grid-template-columns:1fr;gap:.9rem;}}

/* price */
.price{background:var(--card);border:1px solid var(--line-ink);border-radius:16px;
  padding:clamp(1.6rem,4vw,2.4rem);box-shadow:var(--shadow-sm);max-width:640px;}
.price .fig{font-family:var(--serif);font-size:clamp(2rem,5vw,2.8rem);line-height:1.1;}
.price .fig small{font-family:var(--sans);font-size:.95rem;color:var(--slate);font-weight:400;}
.price ul{list-style:none;margin:1.2rem 0 0;display:flex;flex-direction:column;gap:.6rem;}
.price li{display:flex;gap:.6rem;align-items:flex-start;font-size:.95rem;color:var(--slate);}
.price li svg{flex:0 0 auto;margin-top:.32rem;color:var(--klein);}
.guarantee{margin-top:1.4rem;padding:1rem 1.1rem;background:#f2f7f4;border:1px solid #d8e8de;
  border-radius:10px;font-size:.92rem;color:#1d5637;}
.guarantee b{color:#14432a;}

/* cards */
.who{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2.5vw,2rem);margin-top:2rem;}
.wcard{background:var(--card);border:1px solid var(--line-ink);border-radius:14px;padding:1.5rem;}
.wcard h3{font-size:1.2rem;}
.wcard p{color:var(--slate);font-size:.93rem;margin-top:.5rem;}
.wcard ul{margin:.7rem 0 0 1.1rem;color:var(--slate);font-size:.93rem;}
.wcard li{margin-bottom:.3rem;}

/* illustrative label: never let an example read as a customer result */
.label{display:inline-flex;align-items:center;gap:.45rem;font-size:.7rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:#8a5a00;background:#fdf4e3;
  border:1px solid #f0dcb4;border-radius:999px;padding:.35rem .8rem;margin-bottom:.9rem;}
.dark .label{color:#f5d79a;background:rgba(245,215,154,.1);border-color:rgba(245,215,154,.3);}

/* CTA stack: same order on every page */
.ctastack{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.8rem;}
.ctacard{background:var(--card);border:1px solid var(--line-ink);border-radius:14px;padding:1.4rem;
  display:flex;flex-direction:column;gap:.6rem;}
.dark .ctacard{background:rgba(245,242,236,.05);border-color:var(--line);}
.ctacard b{font-family:var(--serif);font-weight:400;font-size:1.15rem;}
.ctacard p{font-size:.88rem;color:var(--slate);flex:1;}
.dark .ctacard p{color:var(--mist);}
.ctacard .n{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--klein-deep);font-weight:600;}
.dark .ctacard .n{color:var(--klein-bright);}
@media(max-width:820px){.ctastack{grid-template-columns:1fr;}}

/* faq */
.faq details{border-bottom:1px solid var(--line-ink);}
.faq details:first-of-type{border-top:1px solid var(--line-ink);}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;
  gap:1rem;padding:1.1rem .1rem;font-family:var(--serif);font-size:1.1rem;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";color:var(--klein);font-size:1.3rem;transition:transform .3s var(--ease);}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq .a{padding:0 .1rem 1.2rem;color:var(--slate);max-width:66ch;font-size:.95rem;}

/* forms, scorecard and calculator */
fieldset{border:0;}
legend{font-family:var(--serif);font-size:1.15rem;margin-bottom:.2rem;}
label{display:block;font-size:.9rem;font-weight:500;margin-bottom:.35rem;}
.hint{font-size:.82rem;color:var(--slate);font-weight:400;margin-bottom:.5rem;}
input[type=number],input[type=text],input[type=email],select,textarea{
  width:100%;font-family:var(--sans);font-size:.95rem;color:var(--ink);background:var(--card);
  border:1.5px solid var(--line-ink);border-radius:8px;padding:.7rem .85rem;}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--klein);outline-offset:1px;}
.q{background:var(--card);border:1px solid var(--line-ink);border-radius:12px;padding:1.2rem 1.3rem;margin-bottom:.9rem;}
.q .qt{font-family:var(--serif);font-size:1.08rem;margin-bottom:.8rem;display:block;}
.opts{display:flex;flex-direction:column;gap:.4rem;}
.opt{display:flex;gap:.65rem;align-items:flex-start;font-size:.93rem;font-weight:400;
  color:var(--slate);cursor:pointer;padding:.45rem .6rem;border-radius:8px;margin:0;}
.opt:hover{background:var(--wash);}
.opt input{margin-top:.28rem;accent-color:var(--klein);flex:0 0 auto;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.4rem;}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem 1.4rem;}
@media(max-width:760px){.grid2,.grid3{grid-template-columns:1fr;}}

.out{background:var(--midnight);color:var(--porcelain);border-radius:16px;padding:clamp(1.4rem,3.5vw,2rem);}
.out h3{color:var(--porcelain);font-size:1.3rem;}
.outgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.1rem;margin-top:1.2rem;}
@media(min-width:760px){.outgrid{grid-template-columns:repeat(4,1fr);}}
.stat{border-top:2px solid var(--klein-bright);padding-top:.7rem;}
.stat .v{font-family:var(--serif);font-size:clamp(1.5rem,4vw,2.1rem);line-height:1.1;color:var(--porcelain);}
.stat .l{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mist);margin-top:.3rem;}
.estimate{font-size:.82rem;color:var(--mist);margin-top:1.2rem;border-top:1px solid var(--line);padding-top:1rem;}
.working{font-size:.85rem;color:var(--slate);background:var(--card);border:1px solid var(--line-ink);
  border-radius:12px;padding:1.1rem 1.2rem;margin-top:1.2rem;}
.working code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem;
  background:var(--wash);border-radius:4px;padding:.1rem .35rem;}
.working li{margin:.4rem 0 .4rem 1.1rem;}

.result{display:none;}
.result.on{display:block;}

footer{background:var(--depth);color:var(--mist);border-top:1px solid var(--line);padding:2.2rem 0;font-size:.82rem;}
footer .wrap{display:flex;flex-direction:column;gap:.4rem;}
footer .fmark{font-family:var(--serif);font-size:1.05rem;color:var(--porcelain);}
footer .fmark i{font-style:italic;color:var(--klein-bright);}
footer a{color:var(--klein-bright);text-decoration:underline;text-underline-offset:2px;}
footer nav{margin-top:.5rem;display:flex;gap:1rem;flex-wrap:wrap;}

@media(max-width:860px){ .steps{grid-template-columns:1fr 1fr;} .who{grid-template-columns:1fr;} }
@media(max-width:520px){ .steps{grid-template-columns:1fr;} }
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--klein);outline-offset:3px;border-radius:4px;}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important;}
}