/* ============ TOKENS ============ */
:root{
  --ink:#344054;
  --paper:#ffffff;
  --mist:#F3F3F0;
  --mist-dark:#EAE9E4;
  --line:#ABABAB;
  --slate:#5b5b5b;
  --slate-light:#98978F;
  --primary:#635BFF;
  --primary-deep:#4d45e0;
  --primary-soft:#F0F0F0;
  --gray-soft: #344054;
  --ghost:#d9d9d9;

  --font: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display: 'Inter Tight', 'Inter', sans-serif;

  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 48px;
  --space-6: 64px;
  --space-7: 96px;
  --space-8: 128px;

  --radius-s: 6px;
  --radius-m: 10px;
  --radius-l: 18px;

  --ease: cubic-bezier(.4,0,.2,1);
  --ease-out: cubic-bezier(0,0,.2,1);

  --shadow-1: 0 1px 2px rgba(7,7,7,.06), 0 1px 1px rgba(7,7,7,.04);
  --shadow-2: 0 8px 24px rgba(7,7,7,.10), 0 2px 6px rgba(7,7,7,.06);
  --shadow-3: 0 20px 48px rgba(7,7,7,.16), 0 6px 16px rgba(7,7,7,.08);

  --maxw: 1220px;
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
}
img,svg{display:block; max-width:100%;}
a{color:inherit; text-decoration:none;}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer;}
ul{margin:0; padding:0; list-style:none;}
h1,h2,h3,h4,p{margin:0;}
.w-100 {
  width: 100%;
}
.text-bold {
  font-weight: 700;
}
:focus-visible{outline:2px solid var(--primary); outline-offset:3px; border-radius:2px;}

.wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:20px;}
@media (min-width:768px){ .wrap{padding-inline:40px;} }
@media (min-width:1200px){ .wrap{padding-inline:56px;} }

.skip-link{position:absolute; left:-999px; top:0; background:var(--ink); color:var(--paper); padding:12px 20px; z-index:200;}
.skip-link:focus{left:12px; top:12px;}

/* ============ TYPE ============ */
h1,h2,h3{font-family:var(--font-display); font-weight:800; letter-spacing:-0.02em; color:var(--ink);}
.eyebrow{
  font-size:.8125rem; font-weight:600; color:var(--slate);
  display:inline-flex; align-items:center; gap:8px;
}
.eyebrow::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--ink); flex:none;}

.h1{ font-size:clamp(2.35rem, 6.4vw, 3.4rem); line-height:1.24; letter-spacing:-0.03em; }
.h2{ font-size:clamp(1.7rem, 4.4vw, 2.65rem); line-height:1.12; }
.h3{ font-size:1.2rem; line-height:1.3; font-weight:700; }
.lede{ font-size:clamp(1.05rem,2vw,1.0rem); color:var(--slate); line-height:1.6; max-width:52ch; }
.body-s{ font-size:.95rem; color:var(--slate); line-height:1.65; max-width:42ch; }

/* ============ BUTTONS ============ */
.btn{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 26px; border-radius:999px;
  font-weight:600; font-size:.95rem;
  transition:background var(--ease) .2s, color var(--ease) .2s, box-shadow var(--ease) .2s, transform var(--ease) .2s, border-color var(--ease) .2s;
  white-space:nowrap;
}
.btn-primary{ background:var(--ink); color:var(--paper); box-shadow:var(--shadow-1); }
.btn-primary:hover{ background:none; border: 1px solid var(--ink); color:var(--ink); box-shadow:var(--shadow-2); transform:translateY(-2px); }
.btn-primary:active{ transform:translateY(0); }
.btn-ghost{ background:transparent; color:var(--ink); border:1.5px solid var(--line); }
.btn-ghost:hover{ border-color:var(--ink); background:var(--mist); color:var(--ink); }
.btn-light{ background:var(--paper); color:var(--ink); }
.btn-light:hover{ background:var(--ghost); color:var(--ink); transform:translateY(-2px); }
.btn-sm{ padding:10px 18px; font-size:.875rem; }
.btn .ripple{ position:absolute; border-radius:50%; background:rgba(255,255,255,.5); transform:scale(0); animation:ripple .55s var(--ease-out); pointer-events:none; }
.btn-ghost .ripple, .btn-light .ripple{ background:rgba(7,7,7,.14); }
@keyframes ripple{ to{ transform:scale(1); opacity:0; } }

.badge{
  display:inline-flex; align-items:center; gap:7px;
  font-size:.8rem; font-weight:600; color:var(--ink);
  background:var(--mist); border:1px solid var(--line);
  padding:7px 13px; border-radius:999px;
}
.badge .dot{ width:6px; height:6px; border-radius:50%; background:var(--ink); }

/* ============ ICONS ============ */
.icon{ width:24px; height:24px; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }

/* ============ HEADER / NAV ============ */
.nav{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.85); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.nav.is-scrolled{ border-color:var(--line); box-shadow:0 1px 0 rgba(7,7,7,.02); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding-block:16px; }
.logo{ display:flex; align-items:center; gap:2px; font-family:var(--font-display); font-weight:800; font-size:1.28rem; letter-spacing:-0.01em; }
.logo .mark{ color:var(--primary); }
.nav-links{ display:none; align-items:center; gap:36px; }
.nav-links a{ font-size:.92rem; font-weight:500; color:var(--ink); position:relative; padding-block:4px; }
.nav-links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1.5px; background:var(--primary);
  transition:right .25s var(--ease);
}
.nav-links a:hover::after{ right:0; }
.nav-cta{ display:none; align-items:center; gap:18px; }
.nav-cta .tel-link{ font-size:.9rem; font-weight:500; color:var(--slate); }
@media (min-width:960px){
  .nav-links{ display:flex; }
  .nav-cta{ display:flex; }
}
.menu-btn{ display:flex; width:42px; height:42px; align-items:center; justify-content:center; border-radius:50%; }
.menu-btn:hover{ background:var(--mist); }
@media (min-width:960px){ .menu-btn{ display:none; } }

.mobile-panel{
  position:fixed; inset:0; z-index:150; background:var(--paper);
  display:flex; flex-direction:column; padding:20px;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .3s var(--ease), transform .3s var(--ease), visibility 0s linear .3s;
}
.mobile-panel.is-open{ opacity:1; visibility:visible; transform:translateY(0); transition:opacity .3s var(--ease), transform .3s var(--ease); }
.mobile-panel-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--space-6); }
.mobile-panel nav{ display:flex; flex-direction:column; gap:4px; }
.mobile-panel a{
  font-family:var(--font-display); font-size:1.7rem; font-weight:700; padding:14px 4px;
  border-bottom:1px solid var(--line); opacity:0; transform:translateY(10px);
  transition:opacity .35s var(--ease), transform .35s var(--ease);
}
.mobile-panel.is-open a{ opacity:1; transform:translateY(0); }
.mobile-panel.is-open a:nth-child(1){ transition-delay:.05s; }
.mobile-panel.is-open a:nth-child(2){ transition-delay:.1s; }
.mobile-panel.is-open a:nth-child(3){ transition-delay:.15s; }
.mobile-panel.is-open a:nth-child(4){ transition-delay:.2s; }
.mobile-panel.is-open a:nth-child(5){ transition-delay:.25s; }
.mobile-panel-foot{ margin-top:auto; display:flex; flex-direction:column; gap:14px; padding-top:var(--space-5); }

/* ============ HERO ============ */
.hero {
  background: #f8f8f5;
  padding-block:var(--space-6) var(--space-7);
  overflow:hidden; 
}
.image-fade {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(to right, #f8f8f5 0%, transparent 15%, transparent 85%, #f8f8f5 100%), linear-gradient(to bottom, #f8f8f5 0%, transparent 15%, transparent 85%, #f8f8f5 100%);
}
.hero-grid{ display:grid; gap:var(--space-6); align-items:center; }
@media (min-width:1024px){ .hero-grid{ grid-template-columns:1.05fr .95fr; gap:var(--space-5); } }

.hero-copy{ opacity:0; transform:translateY(16px); animation:rise .7s var(--ease-out) forwards; }
.hero-copy .eyebrow{ animation-delay:0s; }
.hero-copy h1{ margin-top:var(--space-3); }
.hero-copy .lede{ margin-top:var(--space-3); }
.hero-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:var(--space-4); }
.hero-badges{ display:flex; flex-wrap:wrap; gap:10px; margin-top:var(--space-4); }

@keyframes rise{ to{ opacity:1; transform:translateY(0); } }
.stagger > *{ opacity:0; transform:translateY(14px); animation:rise .6s var(--ease-out) forwards; }
.stagger > *:nth-child(1){ animation-delay:.05s; }
.stagger > *:nth-child(2){ animation-delay:.16s; }
.stagger > *:nth-child(3){ animation-delay:.27s; }
.stagger > *:nth-child(4){ animation-delay:.38s; }

.hero-art{ position:relative; opacity:0; transform:translateY(18px) scale(.98); animation:rise .8s var(--ease-out) .2s forwards; }
.hero-art svg{ width:100%; height:auto; }

/* ============ REVEAL ============ */
.reveal{ opacity:0; transition:opacity .7s var(--ease); }
.reveal.in-view{ opacity:1; }

/* ============ SECTION ============ */
.section{ padding-block:var(--space-7); }
.section-alt{ background:var(--mist); }
.section-head{ max-width:640px; margin-bottom:var(--space-5); }
.section-head .eyebrow{ margin-bottom:var(--space-2); }
.section-head-row{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:var(--space-3); margin-bottom:var(--space-5); }

/* ============ BUSINESS GRID ============ */
.biz-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius-m); overflow:hidden; }
@media (min-width:640px){ .biz-grid{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1024px){ .biz-grid{ grid-template-columns:repeat(4,1fr); } }
.biz-card{
  background:var(--paper); padding:var(--space-3); display:flex; flex-direction:column; gap:14px;
  transition:background .25s var(--ease);
}
.biz-card:hover{ background:var(--gray-soft); }
.biz-card:hover .icon{ color:var(--paper); }
.biz-card:hover .biz-name{ color:var(--paper); }
.biz-card:hover .biz-desc{ color:#c9c8c2; }
.biz-card .icon{ color:var(--ink); transition:color .25s var(--ease); }
.biz-name{ font-weight:700; font-size:.98rem; transition:color .25s var(--ease); }
.biz-desc{ font-size:.85rem; color:var(--slate); line-height:1.5; transition:color .25s var(--ease); }

/* ============ PROCESS (3 step, black) ============ */
.process{ background:var(--ink); color:var(--paper); border-radius:var(--radius-l); padding:var(--space-5) var(--space-3); }
@media (min-width:768px){ .process{ padding:var(--space-6); } }
.process-head{ max-width:640px; margin-bottom:var(--space-5); }
.process-head .h2{ color:var(--paper); }
.process-head .lede{ color:#B9B8B1; }
.process-steps{ display:grid; gap:var(--space-4); }
@media (min-width:768px){ .process-steps{ grid-template-columns:repeat(3,1fr); gap:var(--space-4); } }
.step{ border-top:1px solid #828282; padding-top:var(--space-3); }
.step-num{ font-family:var(--font-display); font-size:.95rem; color:var(--paper); font-weight:700; }
.step h3{ color:var(--paper); margin-top:10px; }
.step p{ color:#B9B8B1; font-size:.92rem; margin-top:8px; line-height:1.6; }

/* ============ FEATURES ============ */
.feature-row{ display:grid; gap:var(--space-4); align-items:center; padding-block:var(--space-6); border-top:1px solid var(--line); }
.feature-row:first-of-type{ border-top:none; }
@media (min-width:1024px){
  .feature-row{ grid-template-columns:1fr 1fr; gap:var(--space-6); }
  .feature-row.flip .feature-art{ order:2; }
  .feature-row.flip .feature-copy{ order:1; }
}
.feature-art{ background:var(--mist); border-radius:var(--radius-l); padding:var(--space-4); display:flex; align-items:center; justify-content:center; }
.feature-art svg{ width:100%; height:auto; max-width:420px; color:var(--ink); }
.feature-art svg .accent{ color:var(--primary); }
.feature-copy .eyebrow{ margin-bottom:var(--space-2); }
.feature-copy h3.h2{ margin-bottom:var(--space-2); }
.feature-list{ margin-top:var(--space-3); display:flex; flex-direction:column; gap:12px; }
.feature-list li{ display:flex; gap:12px; align-items:flex-start; font-size:.96rem; color:var(--ink); }
.feature-list .icon{ width:18px; height:18px; color:var(--ink); flex:none; margin-top:3px; }

/* ============ HARDWARE HIGHLIGHT SPLIT ============ */
.split{ display:grid; gap:var(--space-5); align-items:center; }
@media (min-width:1024px){ .split{ grid-template-columns:.95fr 1.05fr; gap:var(--space-6); } }
.stat-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-2); margin-top:var(--space-4); border-top:1px solid var(--line); padding-top:var(--space-3); }
.stat-num{ font-family:var(--font-display); font-weight:800; font-size:1.5rem; }
.stat-label{ font-size:.8rem; color:var(--slate); margin-top:4px; }

/* ============ HARDWARE TEASER ============ */
.hw-scroll{
  display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px;
  margin-inline:-20px; padding-inline:20px; scrollbar-width:none;
}
.hw-scroll::-webkit-scrollbar{ display:none; }
@media (min-width:768px){ .hw-scroll{ margin-inline:-40px; padding-inline:40px; } }
@media (min-width:1024px){
  .hw-scroll{ display:grid; grid-template-columns:repeat(3,1fr); overflow:visible; margin-inline:0; padding-inline:0; }
}
.hw-card{
  scroll-snap-align:start; flex:0 0 78%; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-m);
  padding:var(--space-3); display:flex; flex-direction:column; gap:14px;
  transition:box-shadow .25s var(--ease), transform .25s var(--ease), border-color .25s var(--ease);
}
@media (min-width:540px){ .hw-card{ flex-basis:46%; } }
@media (min-width:1024px){ .hw-card{ flex-basis:auto; } }
.hw-card:hover{ box-shadow:var(--shadow-2); transform:translateY(-4px); border-color:var(--line); }
.hw-card .icon-wrap{ width:52px; height:52px; border-radius:var(--radius-s); background:var(--mist); display:flex; align-items:center; justify-content:center; }
.hw-card:hover .icon{ color:var(--ink); }
.hw-card h3{ font-size:1.05rem; }
.hw-card p{ font-size:.88rem; color:var(--slate); line-height:1.55; }
.hw-card .hw-link{ margin-top:auto; font-size:.85rem; font-weight:600; display:inline-flex; align-items:center; gap:6px; }
.hw-card .hw-link .icon{ width:15px; height:15px; transition:transform .2s var(--ease); }
.hw-card:hover .hw-link .icon{ transform:translateX(3px); }

/* ============ PRICING ============ */
.toggle-wrap{ display:inline-flex; align-items:center; gap:14px; background:var(--mist); border:1px solid var(--line); border-radius:999px; padding:6px; }
.toggle-wrap button{ padding:9px 18px; border-radius:999px; font-size:.88rem; font-weight:600; color:var(--slate); transition:background .25s var(--ease), color .25s var(--ease); }
.toggle-wrap button.is-active{ background:var(--ink); color:var(--paper); }
.save-pill{ font-size:.72rem; font-weight:700; color:var(--ink); background:var(--primary-soft); padding:3px 8px; border-radius:999px; margin-left:6px; vertical-align:2px; }

.price-grid{ display:grid; gap:var(--space-3); margin-top:var(--space-5); }
@media (min-width:900px){ .price-grid{ grid-template-columns:repeat(3,1fr); gap:var(--space-3); } }
.price-card{
  border:1px solid var(--line); border-radius:var(--radius-l); padding:var(--space-4);
  display:flex; flex-direction:column; background:var(--paper);
  transition:box-shadow .3s var(--ease), transform .3s var(--ease), border-color .3s var(--ease);
}
.price-card:hover{ box-shadow:var(--shadow-2); transform:translateY(-4px); }
.price-card.is-popular{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
@media (min-width:900px){ .price-card.is-popular{ transform:translateY(-12px); } .price-card.is-popular:hover{ transform:translateY(-16px); } }
.price-card.is-popular .plan-desc, .price-card.is-popular .price-note{ color:#B9B8B1; }
.plan-tag{ display:inline-flex; align-self:flex-start; font-size:.72rem; font-weight:700; color:var(--ink); background:var(--primary-soft); padding:4px 10px; border-radius:999px; margin-bottom:14px; }
.price-card.is-popular .plan-tag{ color:var(--ink); background:var(--paper); }
.plan-name{ font-family:var(--font-display); font-weight:800; font-size:1.3rem; }
.plan-desc{ font-size:.88rem; color:var(--slate); margin-top:6px; line-height:1.5; min-height:42px; }
.plan-price{ font-family:var(--font-display); font-weight:800; font-size:2.1rem; margin-top:var(--space-3); letter-spacing:-0.02em; }
.plan-price span{ font-size:.95rem; font-weight:600; color:var(--slate); }
.price-card.is-popular .plan-price span{ color:#B9B8B1; }
.price-note{ font-size:.78rem; color:var(--slate-light); margin-top:4px; }
.plan-feats{ margin-top:var(--space-4); display:flex; flex-direction:column; gap:11px; flex:1; }
.plan-feats li{ display:flex; gap:10px; font-size:.9rem; align-items:flex-start; }
.plan-feats .icon{ width:16px; height:16px; color:var(--ink); flex:none; margin-top:3px; }
.price-card.is-popular .plan-feats .icon{ color:var(--paper); }
.price-card .btn{ margin-top:var(--space-4); width:100%; }

/* ============ CTA BANNER ============ */
.cta-banner{ background:var(--ink); color:var(--paper); border-radius:var(--radius-l); padding:var(--space-6) var(--space-3); text-align:left; }
@media (min-width:768px){ .cta-banner{ padding:var(--space-7) var(--space-6); display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); text-align:left; } }
.cta-banner h2{ color:var(--paper); max-width:16ch; }
.cta-banner p{ color:#B9B8B1; margin-top:var(--space-2); max-width:44ch; }
.cta-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:var(--space-4); }
@media (min-width:768px){ .cta-actions{ margin-top:0; flex:none; } }

/* ============ FOOTER ============ */
footer{ border-top:1px solid var(--line); padding-block:var(--space-6) var(--space-4); }
.foot-grid{ display:grid; gap:var(--space-5); }
@media (min-width:768px){ .foot-grid{ grid-template-columns:1.4fr repeat(3,1fr); gap:var(--space-4); } }
.foot-brand p{ margin-top:var(--space-2); color:var(--slate); font-size:.9rem; max-width:34ch; line-height:1.6; }
.foot-col h4{ font-size:.85rem; font-weight:700; margin-bottom:16px; }
.foot-col ul{ display:flex; flex-direction:column; gap:11px; }
.foot-col a{ font-size:.9rem; color:var(--slate); transition:color .2s var(--ease); }
.foot-col a:hover{ color:var(--ink); }
.foot-bottom{ display:flex; flex-direction:column; gap:14px; border-top:1px solid var(--line); margin-top:var(--space-6); padding-top:var(--space-3); }
@media (min-width:768px){ .foot-bottom{ flex-direction:row; align-items:center; justify-content:space-between; } }
.foot-bottom p{ font-size:.82rem; color:var(--slate); }
.foot-legal{ display:flex; gap:20px; flex-wrap:wrap; }
.foot-legal a{ font-size:.82rem; color:var(--slate); }
.foot-legal a:hover{ color:var(--ink); }


/* ============ REGISTRATION EXPERIENCE ============ */
.signup-overlay{
  position:fixed; inset:0; z-index:500; background:rgba(7,7,7,.30);
  display:flex; align-items:stretch; justify-content:center;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .28s var(--ease), visibility 0s linear .28s;
}
.signup-overlay.is-open{ opacity:1; visibility:visible; pointer-events:auto; transition:opacity .28s var(--ease); }
.signup-shell{
  width:100%; height:100%; background:var(--paper); display:flex; flex-direction:column;
  transform:translateY(18px); transition:transform .38s var(--ease-out);
}
.signup-overlay.is-open .signup-shell{ transform:translateY(0); }
.signup-topbar{
  height:72px; flex:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 20px; border-bottom:1px solid var(--line); background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.signup-top-left,.signup-top-right{display:flex; align-items:center; gap:12px;}
.signup-back{
  width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  color:var(--slate); transition:background .2s var(--ease), color .2s var(--ease), opacity .2s var(--ease);
}
.signup-back:hover{background:var(--mist); color:var(--ink);}
.signup-back.is-hidden{opacity:0; pointer-events:none;}
.signup-step-label{font-size:.8rem; font-weight:600; color:var(--slate);}
.signup-step-count{font-size:.8rem; font-weight:700; color:var(--ink); white-space:nowrap;}
.signup-progress{position:absolute; top:71px; left:0; width:100%; height:3px; background:var(--mist-dark);}
.signup-progress-bar{height:100%; width:14.28%; background:var(--ink); transition:width .35s var(--ease);}
.signup-main{flex:1; min-height:0; overflow:auto; background:var(--paper);}
.signup-stage{min-height:100%; width:100%; display:grid; place-items:center; padding:32px 20px 112px;}
.signup-content{width:min(100%, 980px);}
.signup-heading{text-align:center; max-width:700px; margin:0 auto 32px;}
.signup-heading .eyebrow{justify-content:center;}
.signup-heading h1{margin-top:10px; font-size:clamp(2rem,5vw,3.4rem); line-height:1.04;}
.signup-heading p{margin:12px auto 0; color:var(--slate); font-size:1rem; line-height:1.6; max-width:56ch;}
.signup-grid{display:grid; gap:16px;}
.signup-grid.plans{grid-template-columns:1fr;}
.signup-plan{
  position:relative; border:1px solid var(--line); border-radius:18px; padding:22px; background:var(--paper);
  cursor:pointer; text-align:left; transition:border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease), background .2s var(--ease);
}
.signup-plan:hover{transform:translateY(-2px); box-shadow:var(--shadow-2);}
.signup-plan.is-selected{border-color:var(--ink); box-shadow:0 0 0 2px var(--ink);}
.signup-plan.is-selected::before{content:""; position:absolute; top:16px; right:16px; width:24px; height:24px; border-radius:50%; background:var(--ink);}
.signup-plan.is-selected::after{content:"✓"; position:absolute; top:16px; right:16px; width:24px; height:24px; color:#fff; display:grid; place-items:center; font-size:.78rem; font-weight:800;}
.signup-plan .plan-tag{margin-bottom:12px;}
.signup-plan .plan-name{font-size:1.25rem;}
.signup-plan-price{font-family:var(--font-display); font-weight:800; font-size:2rem; margin-top:18px; letter-spacing:-.02em;}
.signup-plan-price span{font-family:var(--font); font-size:.82rem; font-weight:600; color:var(--slate); letter-spacing:0;}
.signup-plan-note{margin-top:5px; font-size:.78rem; color:var(--slate-light);}
.signup-plan-features{margin-top:18px; display:grid; gap:9px;}
.signup-plan-features li{display:flex; gap:8px; align-items:flex-start; font-size:.86rem; color:var(--ink);}
.signup-plan-features .icon{width:16px; height:16px; color:var(--ink); flex:none; margin-top:2px;}
.signup-billing{display:flex; align-items:center; justify-content:center; margin:0 auto 24px;}
.signup-billing .toggle-wrap{box-shadow:none;}
.signup-continue-wrap{display:flex; justify-content:center; margin-top:24px;}
.signup-continue-wrap .btn{min-width:220px;}
.signup-helper{text-align:center; color:var(--slate); font-size:.8rem; margin-top:12px;}
.signup-form-card{max-width:620px; margin:0 auto;}
.signup-field{margin-bottom:16px;}
.signup-field:last-child{margin-bottom:0;}
.signup-field label{display:block; font-size:.8rem; font-weight:700; color:var(--slate); margin:0 0 7px 2px;}
/* .signup-email-prefill{display:block; margin:8px 0 0 2px; padding:0; border:0; background:none; color:var(--primary); font:inherit; font-size:.8rem; font-weight:700; text-align:left; cursor:pointer;} */
.signup-email-prefill {
	display: block;
	margin: 8px 0 0 2px;
	padding: 5px;
	border: 1.4px solid var(--line);
	background: var(--mist);
	color: var(--ink);
	font: inherit;
	font-size: .8rem;
	font-weight: 700;
	text-align: left;
	cursor: pointer;
	border-radius: 999px;
	text-decoration: none;
	transition: background .2s var(--ease);
}
.signup-email-prefill:hover:not(:disabled){
  text-decoration:none;
  background: #fff;
}
.signup-email-prefill:disabled{color:var(--slate-light); cursor:not-allowed;}
.signup-input-wrap{position:relative;}
.signup-field-icon{
  position:absolute; left:16px; top:50%; transform:translateY(-50%); color:var(--slate-light); width:20px; height:20px; pointer-events:none;
}
.signup-input,.signup-select{
  width:100%; min-height:56px; border:1px solid var(--line); border-radius:12px; background:var(--paper); color:var(--ink);
  padding:0 16px 0 48px; font:inherit; font-size:.98rem; outline:none;
  transition:border-color .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease);
}
.signup-select{appearance:none; -webkit-appearance:none; padding-right:48px;}
.signup-input:focus,.signup-select:focus{border-color:var(--ink); box-shadow:0 0 0 3px rgba(102, 101, 91, 0.12);}
.signup-select-wrap::after{content:""; position:absolute; right:18px; top:50%; width:8px; height:8px; margin-top:-5px; border-right:1.6px solid var(--slate); border-bottom:1.6px solid var(--slate); transform:rotate(45deg); pointer-events:none;}
.signup-choice-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.signup-choice{
  min-height:82px; display:flex; align-items:center; gap:12px; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--paper);
  text-align:left; transition:border-color .18s var(--ease), background .18s var(--ease), transform .18s var(--ease);
}
.signup-choice:hover{transform:translateY(-1px); border-color:var(--primary);}
.signup-choice.is-selected{border-color:var(--ink); background:var(--mist); box-shadow:0 0 0 1px var(--ink);}
.signup-choice-icon{width:40px; height:40px; border-radius:10px; background:var(--mist); display:grid; place-items:center; flex:none;}
.signup-choice-icon .icon{width:20px; height:20px;}
.signup-choice-title{font-weight:700; font-size:.9rem; line-height:1.25;}
.signup-choice-copy{font-size:.76rem; color:var(--slate); margin-top:3px; line-height:1.4;}
.signup-choice-text{display:flex; flex-direction:column; min-width:0;}
.signup-auth{max-width:520px; margin:0 auto;}
.auth-btn-outline {
  width:100%; min-height:56px; border:1px solid var(--line); border-radius:12px; display:flex; align-items:center; justify-content:center; gap:12px;
  background:var(--paper); font-size:.96rem; font-weight:700; transition:border-color .2s var(--ease), background .2s var(--ease), transform .2s var(--ease);
}
.auth-btn-outline:hover{border-color:var(--ink); background:var(--mist); transform:translateY(-1px);}
.auth-btn-outline-mark{width:20px; height:20px; display:grid; place-items:center; font-size:17px; font-weight:800;}
.signup-divider{display:flex; align-items:center; gap:12px; margin:40px 0; color:var(--slate-light); font-size:.76rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em;}
.signup-divider::before,.signup-divider::after{content:""; flex:1; height:1px; background:var(--line);}
.signup-error{display:none; margin-top:10px; color:#9b2c2c; font-size:.8rem; line-height:1.4;}
.signup-error.is-visible{display:block;}
.signup-bottom{
  position:absolute; left:0; right:0; bottom:0; z-index:10; padding:12px 20px calc(12px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.94); border-top:1px solid var(--line); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.signup-bottom-inner{max-width:980px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:14px;}
.signup-bottom .btn{min-width:150px;}
.signup-bottom-left{display:flex; align-items:center; gap:8px; color:var(--slate); font-size:.8rem;}
.signup-check{width:18px; height:18px; color:var(--ink);}
.signup-success{max-width:620px; margin:0 auto; text-align:center;}
.signup-success-mark{width:88px; height:88px; border-radius:50%; background:var(--primary-soft); margin:0 auto 22px; display:grid; place-items:center;}
.signup-success-mark .icon{width:42px; height:42px; color:var(--primary-deep); stroke-width:1.8;}
.signup-success h1{font-size:clamp(2.2rem,5vw,3.6rem);}
.signup-summary{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:28px 0;}
.signup-summary-item{border:1px solid var(--line); border-radius:12px; padding:13px 10px; text-align:left;}
.signup-summary-label{font-size:.7rem; font-weight:700; color:var(--slate-light); text-transform:uppercase; letter-spacing:.06em;}
.signup-summary-value{font-size:.88rem; font-weight:700; margin-top:4px; line-height:1.35; overflow-wrap:anywhere;}
.signup-success-actions{display:flex; justify-content:center; gap:10px; flex-wrap:wrap;}
.signup-success-actions .btn{min-width:210px;}
.signup-login-note{font-size:.8rem; color:var(--slate); margin-top:16px;}
.signup-login-note a{color:var(--ink); font-weight:700; text-decoration:underline; text-decoration-color:var(--primary); text-underline-offset:3px;}
.signup-toast{position:fixed; left:50%; bottom:92px; transform:translate(-50%,20px); background:var(--ink); color:#fff; padding:11px 15px; border-radius:999px; font-size:.8rem; font-weight:600; opacity:0; visibility:hidden; transition:opacity .22s var(--ease), transform .22s var(--ease), visibility 0s linear .22s; z-index:30; box-shadow:var(--shadow-2);}
.signup-toast.is-visible{opacity:1; visibility:visible; transform:translate(-50%,0); transition:opacity .22s var(--ease), transform .22s var(--ease);}
@media (min-width:720px){
  .signup-topbar{padding:0 32px;}
  .signup-stage{padding:52px 32px 124px;}
  .signup-grid.plans{grid-template-columns:repeat(3,1fr); gap:14px;}
  .signup-plan{padding:24px;}
  .signup-choice-grid{grid-template-columns:repeat(3,1fr);}
}
@media (min-width:1024px){
  .signup-overlay{padding:18px; align-items:center;}
  .signup-shell{max-width:1180px; height:min(940px, 100%); border-radius:22px; overflow:hidden; box-shadow:var(--shadow-3);}
  .signup-topbar{padding:0 28px;}
  .signup-stage{padding:44px 40px 118px;}
}
@media (max-width:600px){
  .signup-topbar{height:64px;}
  .signup-progress{top:63px;}
  .signup-stage{padding-top:28px;}
  .signup-heading{margin-bottom:24px;}
  .signup-heading h1{font-size:2.2rem;}
  .signup-summary{grid-template-columns:1fr;}
  .signup-bottom-inner{flex-direction:row-reverse;}
  .signup-bottom-left{display:none;}
  .signup-bottom .btn{flex:1; min-width:0;}
  .signup-bottom .signup-secondary-action{max-width:110px; flex:none;}
}
@media (prefers-reduced-motion: reduce){
  .signup-overlay,.signup-shell,.signup-progress-bar,.signup-plan,.signup-choice,.signup-google,.signup-toast{transition:none !important;}
}


/* ============ INNER PAGES ============ */
.page-hero{ padding-block:var(--space-6) var(--space-4); }
.page-hero .eyebrow{ margin-bottom:var(--space-2); }
.page-hero h1{ margin-top:var(--space-2); font-size:clamp(2rem,4.5vw,3.1rem); line-height:1.08; letter-spacing:-0.02em; }
.page-hero .lede{ margin-top:var(--space-2); }

.prose{ max-width:760px; margin-inline:auto; padding-bottom:var(--space-6); }
.prose h4{ font-family:var(--font-display); font-weight:700; font-size:1.15rem; color:var(--ink); margin:var(--space-4) 0 var(--space-2); }
.prose h4:first-child{ margin-top:0; }
.prose p{ color:var(--slate); line-height:1.7; margin-bottom:var(--space-3); }
.prose ul{ list-style:disc; padding-left:20px; display:flex; flex-direction:column; gap:8px; margin:0 0 var(--space-3); }
.prose li{ color:var(--slate); line-height:1.6; }

.form-card{ max-width:568px; margin-inline:auto; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-l); padding:var(--space-4) var(--space-3); }
@media(min-width:768px){ .form-card{ padding:var(--space-5); } }
.field{ margin-bottom:var(--space-3); }
.field label{ display:block; font-size:.8rem; font-weight:700; color:var(--slate); margin:0 0 7px 2px; }
.field input,.field textarea,.field select{
  width:100%; min-height:52px; border:1px solid var(--line); border-radius:12px; background:var(--paper); color:var(--ink);
  padding:0 16px; font:inherit; font-size:.96rem; outline:none;
  transition:border-color .18s var(--ease), box-shadow .18s var(--ease);
}
.field textarea{ min-height:140px; padding:14px 16px; resize:vertical; }
.field select{ appearance:none; -webkit-appearance:none; }
.field input:focus,.field textarea:focus,.field select:focus{ border-color:var(--ink); box-shadow:0 0 0 3px rgba(102,101,91,.12); }
.field .err{ display:none; margin-top:8px; color:#9b2c2c; font-size:.8rem; line-height:1.4; }
.field.is-invalid input,.field.is-invalid textarea,.field.is-invalid select{ border-color:#9b2c2c; }
.field.is-invalid .err{ display:block; }

.contact-list{ display:flex; flex-direction:column; gap:var(--space-3); }
.contact-item{ display:flex; gap:12px; align-items:flex-start; }
.contact-item .icon{ width:20px; height:20px; color:var(--ink); flex:none; margin-top:2px; }
.contact-item h4{ font-size:.9rem; font-weight:700; margin-bottom:2px; }
.contact-item p,.contact-item a{ font-size:.9rem; color:var(--slate); }

.success-card{ max-width:640px; margin-inline:auto; text-align:center; padding-block:var(--space-6) var(--space-7); }
.success-card .success-mark{ width:88px; height:88px; border-radius:50%; background:var(--primary-soft); margin:0 auto var(--space-3); display:grid; place-items:center; }
.success-card .success-mark .icon{ width:42px; height:42px; color:var(--primary-deep); stroke-width:1.8; }
.success-card h1{ margin-bottom:var(--space-2); }
.success-card p{ color:var(--slate); margin-bottom:var(--space-4); }

.benefit-grid{ display:grid; gap:16px; }
@media(min-width:768px){ .benefit-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .benefit-grid{ grid-template-columns:repeat(4,1fr); } }
.benefit-card{ border:1px solid var(--line); border-radius:var(--radius-m); padding:var(--space-3); background:var(--paper); transition:box-shadow .25s var(--ease), transform .25s var(--ease); }
.benefit-card:hover{ box-shadow:var(--shadow-2); transform:translateY(-3px); }
.benefit-card .icon-wrap{ width:44px; height:44px; border-radius:var(--radius-s); background:var(--mist); display:flex; align-items:center; justify-content:center; margin-bottom:var(--space-2); }
.benefit-card .icon-wrap .icon{ width:22px; height:22px; color:var(--ink); }
.benefit-card h3{ font-size:1rem; }
.benefit-card p{ font-size:.86rem; color:var(--slate); margin-top:6px; line-height:1.5; }

/* ============ ALERT TOAST ============ */
.site-toast{
  position:fixed; left:50%; bottom:24px; transform:translate(-50%,20px); max-width:min(90vw,480px);
  padding:12px 18px; border-radius:12px; color:#fff; font-size:.9rem; line-height:1.5; z-index:999;
  opacity:0; visibility:hidden; box-shadow:var(--shadow-3);
  transition:opacity .25s var(--ease), transform .25s var(--ease), visibility 0s linear .25s;
}
.site-toast.is-visible{ opacity:1; visibility:visible; transform:translate(-50%,0); transition:opacity .25s var(--ease), transform .25s var(--ease); }
.site-toast.success{ background:var(--ink); }
.site-toast.error{ background:#9b2c2c; }
.site-toast.warning{ background:var(--ink); }

/* ============ PRIVACY AND COOKIE NOTICE ============ */
.cookie-notice{
  position:fixed; z-index:1000; inset:auto 16px 16px; display:flex; align-items:center; justify-content:space-between; gap:24px;
  max-width:1100px; margin-inline:auto; padding:22px 24px; border:1px solid var(--line); border-radius:var(--radius-l);
  background:var(--paper); box-shadow:var(--shadow-3);
}
.cookie-notice[hidden]{display:none;}
.cookie-notice__copy{max-width:680px;}
.cookie-notice__title{font-size:1.05rem; margin-bottom:6px;}
.cookie-notice__copy p{font-size:.88rem; line-height:1.55; color:var(--slate);}
.cookie-notice__copy a{color:var(--primary-deep); text-decoration:underline; text-underline-offset:2px;}
.cookie-notice__actions{display:flex; flex:none; flex-wrap:wrap; justify-content:flex-end; gap:10px;}
.cookie-notice__actions .btn{min-height:42px;}
.cookie-preferences-link{padding:0; color:var(--slate); font:inherit; font-size:.82rem; cursor:pointer;}
.cookie-preferences-link:hover{color:var(--ink); text-decoration:underline;}
@media(max-width:700px){
  .cookie-notice{inset:auto 10px 10px; flex-direction:column; align-items:stretch; gap:16px; padding:18px;}
  .cookie-notice__actions{justify-content:stretch;}
  .cookie-notice__actions .btn{flex:1; white-space:normal; padding-inline:12px;}
}

/* ============ MANUFACTURING SPOTLIGHT ============ */
.manufacturing-section{overflow:hidden;}
.manufacturing-panel{position:relative; display:grid; gap:32px; padding:28px; border:1px solid var(--line); border-radius:24px; background:linear-gradient(135deg,#F7F5EF 0%,#FFFFFF 62%); box-shadow:var(--shadow-1);}
.manufacturing-panel::after{content:""; position:absolute; width:260px; height:260px; border-radius:50%; right:-110px; top:-120px; background:var(--primary-soft); opacity:.55; pointer-events:none;}
.manufacturing-copy,.production-board{position:relative; z-index:1;}
.manufacturing-copy .h2{margin:12px 0 16px; max-width:16ch;}
.manufacturing-copy .lede{margin-bottom:24px;}
.manufacturing-tags{display:flex; flex-wrap:wrap; gap:8px; margin:22px 0 28px;}
.manufacturing-tags span{border:1px solid var(--line); background:rgba(255,255,255,.78); padding:7px 11px; border-radius:999px; color:var(--slate); font-size:.82rem; font-weight:600;}
.production-board{background:#fff; border:1px solid var(--line); border-radius:18px; padding:18px; box-shadow:var(--shadow-2); min-width:0;}
.production-board-head{display:flex; justify-content:space-between; align-items:center; gap:12px; padding-bottom:16px; border-bottom:1px solid var(--line);}
.production-board-head strong{font-size:.96rem;}
.production-status{display:inline-flex; align-items:center; gap:6px; font-size:.75rem; color:#456A3D; background:#EEF5E9; padding:6px 9px; border-radius:999px; white-space:nowrap;}
.production-status::before{content:""; width:6px; height:6px; background:#5E8B4E; border-radius:50%;}
.production-order{display:flex; align-items:center; gap:12px; padding:16px 0; border-bottom:1px solid var(--line);}
.production-order:last-of-type{border-bottom:0;}
.production-order-icon{width:42px; height:42px; flex:none; display:grid; place-items:center; border-radius:12px; background:var(--mist); color:var(--gold-deep); font-size:1.2rem; font-weight:800;}
.production-order-main{flex:1; min-width:0;}
.production-order-main strong{display:block; font-size:.88rem; margin-bottom:3px;}
.production-order-main small{display:block; color:var(--slate); font-size:.76rem; line-height:1.45;}
.production-order-value{text-align:right; font-size:.78rem; font-weight:700; white-space:nowrap;}
.production-order-value small{display:block; color:var(--slate); font-size:.7rem; font-weight:500; margin-top:3px;}
.production-progress{height:5px; background:var(--mist-dark); border-radius:99px; margin-top:9px; overflow:hidden;}
.production-progress span{display:block; height:100%; border-radius:99px; background:var(--gold);}
.production-metrics{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:14px;}
.production-metric{padding:12px 10px; background:var(--mist); border-radius:12px; min-width:0;}
.production-metric small{display:block; color:var(--slate); font-size:.68rem; line-height:1.4;}
.production-metric strong{display:block; font-size:1.08rem; margin-top:4px; letter-spacing:-.03em;}
.manufacturing-capabilities{display:grid; grid-template-columns:1fr; gap:12px; margin-top:24px;}
.manufacturing-capability{display:flex; gap:12px; align-items:flex-start; padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--paper);}
.manufacturing-capability .cap-icon{width:50px; height:50px; flex:none; display:grid; place-items:center; border-radius:10px; background:var(--primary-soft); color:var(--gold-deep); font-weight:800;}
.manufacturing-capability strong{display:block; font-size:.92rem; margin-bottom:4px;}
.manufacturing-capability p{font-size:.84rem; color:var(--slate); line-height:1.55;}
@media(min-width:760px){.manufacturing-panel{grid-template-columns:minmax(0,1fr) minmax(330px,.9fr); align-items:center; gap:48px; padding:48px;}.manufacturing-capabilities{grid-template-columns:repeat(2,minmax(0,1fr));}.production-board{padding:22px;}}
@media(max-width:380px){.manufacturing-panel{padding:18px;}.production-board{padding:13px;}.production-order{gap:8px;}.production-order-icon{width:36px;height:36px;}.production-order-value{font-size:.72rem;}.production-metric{padding:10px 7px;}.production-metric strong{font-size:.96rem;}}

.logo img{
  width:140px;
}
@media (max-width: 768px) {
  .logo img {
    width: 100px;
  }
}

.selected-plan-card {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px 16px;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    font-family: inherit;
}

.selected-plan-card__icon {
    display: grid;
    place-items: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background: var(--mist);
    color: var(--ink);
    border-radius: 9px;
    font-size: 21px;
}

.selected-plan-card__details {
    flex: 1;
    min-width: 0;
}

.selected-plan-card__name {
    margin: 0;
    color: #24212b;
    font-size: 15px;
    font-weight: 600;
}

.selected-plan-card__description {
    margin: 3px 0 0;
    color: #777481;
    font-size: 12px;
}

.selected-plan-card__billing {
    flex-shrink: 0;
    padding: 6px 9px;
    background: var(--mist);
    color: var(--ink);
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
}

.selected-plan-card__change {
    flex-shrink: 0;
    padding: 6px 0 6px 8px;
    border: 0;
    background: transparent;
    color: var(--primary-deep);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.selected-plan-card__change:hover {
    color: var(--ink);
    text-decoration: none;
}

@media (max-width: 380px) {
    .selected-plan-card {
        gap: 8px;
        padding: 10px;
    }

    .selected-plan-card__icon {
        width: 34px;
        height: 34px;
        font-size: 18px;
    }

    .selected-plan-card__name {
        font-size: 13px;
    }

    .selected-plan-card__description {
        font-size: 11px;
    }

    .selected-plan-card__billing {
        padding: 5px 7px;
        font-size: 10px;
    }

    .selected-plan-card__change {
        font-size: 12px;
    }
}