:root{
  --paper:      #FFFFFF;
  --tint:       #F3F8FD;   /* cool light-blue tint for alternating sections */
  --ink:        #14213D;   /* deep navy-black */
  --ink-soft:   #5B6478;
  --blue:       #0077C2;   /* brand blue, brightened */
  --blue-deep:  #023A63;
  --blue-light: #E7F4FF;
  --yellow:     #FFC93C;   /* brand yellow, brightened */
  --yellow-deep:#E0A100;
  --green:      #3FAE72;   /* brand green, brightened */
  --green-deep: #2A8657;
  --coral:      #FF5D73;   /* brand coral, brightened */
  --coral-deep: #E23D54;
  --line:       #E4E9F1;
  --radius:     16px;
  --radius-sm:  10px;
  --shadow:     0 24px 48px -24px rgba(14,33,61,.28);
  --shadow-sm:  0 10px 24px -14px rgba(14,33,61,.22);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Public Sans', -apple-system, sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{
  font-family:'Fraunces', serif;
  font-weight:650;
  letter-spacing:-0.01em;
  margin:0;
  color:var(--ink);
}

a{color:inherit;}
img{max-width:100%; display:block;}
section{position:relative;}

.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}

.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12.5px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--blue);
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:600;
}
.eyebrow::before{content:""; width:18px; height:3px; border-radius:2px; background:linear-gradient(90deg,var(--coral),var(--yellow)); display:inline-block;}

a:focus-visible, button:focus-visible{outline:2px solid var(--blue); outline-offset:3px; border-radius:2px;}

/* ---------- NAV ---------- */
header.site{
  position:sticky; top:0; z-index:50;
  background:#FFFFFF;
  box-shadow:0 1px 0 var(--line), 0 8px 24px -20px rgba(14,33,61,.35);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:13px 28px; max-width:1180px; margin:0 auto;}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink);}
.brand img{height:42px; width:auto; flex:none;}
.brand .word{font-family:'Fraunces', serif; font-weight:750; font-size:20px; color:var(--blue);}
.nav-links{display:flex; align-items:center; gap:8px; list-style:none; margin:0; padding:0;}
.nav-links a{text-decoration:none; font-size:14.5px; font-weight:650; color:var(--ink-soft); transition:color .2s var(--ease), background .2s var(--ease); position:relative; padding:8px 14px; border-radius:20px;}
.nav-links a:hover{color:var(--blue); background:var(--blue-light);}
.nav-links a.current{color:var(--blue); background:var(--blue-light);}
.nav-right{display:flex; align-items:center; gap:18px;}

.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Public Sans', sans-serif; font-weight:700; font-size:14.5px;
  padding:12px 22px; border-radius:999px; text-decoration:none;
  border:1.5px solid transparent; cursor:pointer;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease), background .2s var(--ease);
}
.btn-primary{background:linear-gradient(135deg,var(--blue),#00A3C4); color:#fff; box-shadow:0 10px 22px -10px rgba(0,119,194,.55);}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 16px 28px -12px rgba(0,119,194,.6);}
.btn-ghost{background:#fff; border-color:var(--line); color:var(--ink); box-shadow:var(--shadow-sm);}
.btn-ghost:hover{border-color:var(--blue); color:var(--blue); transform:translateY(-2px);}
.nav .btn{padding:10px 18px; font-size:13.5px;}

/* ---------- PAGE HEADER (inner pages) ---------- */
.page-header{padding:64px 0 56px; background:linear-gradient(180deg,var(--blue-light) 0%, #fff 100%);}
.page-header h1{font-size:clamp(32px,4vw,48px); margin-top:14px;}
.page-header p{color:var(--ink-soft); font-size:17px; max-width:56ch; margin-top:14px;}
.crumb{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--ink-soft); letter-spacing:.04em;}
.crumb a{color:var(--blue); text-decoration:none;}
.crumb a:hover{text-decoration:underline;}

/* ---------- HERO (home) ---------- */
.hero{padding:76px 0 104px; overflow:hidden; position:relative; background:linear-gradient(180deg,#fff 0%, var(--blue-light) 100%);}
.hero .blob{position:absolute; border-radius:50%; filter:blur(50px); opacity:.35; z-index:0;}
.hero .blob-1{width:340px; height:340px; background:var(--yellow); top:-90px; right:8%;}
.hero .blob-2{width:280px; height:280px; background:var(--coral); bottom:-60px; left:2%;}
.hero .blob-3{width:220px; height:220px; background:var(--green); bottom:20%; right:-60px;}
.hero .wrap{display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center; position:relative; z-index:1;}
.hero h1{font-size:clamp(38px, 4.6vw, 60px); line-height:1.03; margin:18px 0 22px;}
.hero h1 em{font-style:italic; background:linear-gradient(120deg,var(--blue),var(--green)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero p.lede{font-size:18px; color:var(--ink-soft); max-width:46ch; margin-bottom:32px;}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:34px;}
.hero-trust{display:flex; gap:26px; flex-wrap:wrap; font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--ink-soft);}
.hero-trust div{max-width:150px;}
.hero-trust b{display:block; font-family:'Fraunces', serif; font-size:22px; color:var(--ink); font-weight:750;}

/* ---- ticket component (signature) ---- */
.ticket{
  background:#fff; border-radius:var(--radius); box-shadow:var(--shadow);
  position:relative; padding:28px 26px 24px; font-family:'IBM Plex Mono', monospace;
  transform:rotate(1.2deg); animation:ticketIn .7s var(--ease) both;
  border:1px solid var(--line);
  overflow:hidden;
}
.ticket::before{content:""; position:absolute; top:0; left:0; right:0; height:6px; background:linear-gradient(90deg,var(--coral),var(--yellow),var(--green),var(--blue));}
.ticket-top{display:flex; justify-content:space-between; align-items:flex-start; border-bottom:1px dashed var(--line); padding-bottom:14px; margin-bottom:16px; margin-top:6px;}
.ticket-id{font-size:11px; letter-spacing:.08em; color:var(--ink-soft); text-transform:uppercase;}
.ticket-id b{display:block; font-size:16px; color:var(--ink); letter-spacing:0.04em;}
.stamp{font-family:'Public Sans', sans-serif; font-weight:800; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--green-deep); background:rgba(63,174,114,.12); border:2px solid var(--green); border-radius:999px; padding:5px 11px; transform:rotate(-6deg);}
.ticket-garments{font-size:13px; color:var(--ink); margin-bottom:18px;}
.ticket-garments span{color:var(--ink-soft);}
.steps{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px;}
.steps li{display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--ink-soft);}
.steps li .dot{width:9px; height:9px; border-radius:50%; border:2px solid var(--line); flex:none; background:var(--paper);}
.steps li.done .dot{background:var(--green); border-color:var(--green);}
.steps li.active{color:var(--ink); font-weight:600;}
.steps li.active .dot{background:var(--yellow); border-color:var(--yellow-deep); box-shadow:0 0 0 4px rgba(255,201,60,0.3);}
.steps li.done{text-decoration:line-through; text-decoration-color:var(--line);}

@keyframes ticketIn{from{opacity:0; transform:rotate(4deg) translateY(18px);} to{opacity:1; transform:rotate(1.2deg) translateY(0);}}

/* ---------- MODULES ---------- */
.modules{padding:90px 0; background:var(--tint);}
.section-head{max-width:640px; margin-bottom:48px;}
.section-head h2{font-size:clamp(28px,3vw,38px); margin-top:14px;}
.section-head p{color:var(--ink-soft); font-size:16.5px; margin-top:14px;}

.module-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:22px;}
.tag-card{background:#fff; border-radius:var(--radius); padding:30px 26px 28px; position:relative; box-shadow:var(--shadow-sm); transition:transform .25s var(--ease), box-shadow .25s var(--ease); border-top:5px solid var(--blue); overflow:hidden;}
.tag-card:nth-child(2){border-top-color:var(--coral);}
.tag-card:nth-child(3){border-top-color:var(--green);}
.tag-card:hover{transform:translateY(-6px); box-shadow:var(--shadow);}
.tag-card .num{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--blue); letter-spacing:.08em; font-weight:600;}
.tag-card:nth-child(2) .num{color:var(--coral-deep);}
.tag-card:nth-child(3) .num{color:var(--green-deep);}
.tag-card h3{font-size:23px; margin:10px 0 10px;}
.tag-card p{color:var(--ink-soft); font-size:15px; margin:0;}
.tag-card ul{margin:14px 0 0; padding-left:18px; color:var(--ink-soft); font-size:14px;}
.tag-card ul li{margin-bottom:6px;}

/* ---------- HOW IT WORKS ---------- */
.how{padding:96px 0;}
.how-list{counter-reset:step; display:grid; grid-template-columns:1fr 1fr; gap:0 48px;}
.how-item{counter-increment:step; display:flex; gap:18px; padding:22px 0; border-bottom:1px solid var(--line);}
.how-item::before{
  content:counter(step, decimal-leading-zero); font-family:'IBM Plex Mono', monospace; font-weight:700; font-size:13px;
  color:#fff; background:linear-gradient(135deg,var(--blue),var(--green)); padding-top:2px; flex:none; width:32px; height:32px;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
}
.how-item h4{font-size:17px; font-weight:700; font-family:'Public Sans', sans-serif; margin-bottom:4px;}
.how-item p{margin:0; color:var(--ink-soft); font-size:14.5px;}

/* ---------- FEATURES ---------- */
.features{padding:96px 0; background:linear-gradient(160deg,var(--blue-deep) 0%, #04588f 100%); color:#F2F6FB;}
.features .section-head h2{color:#fff;}
.features .section-head p{color:#BFDCF0;}
.features .eyebrow{color:var(--yellow);}
.features .eyebrow::before{background:linear-gradient(90deg,var(--yellow),var(--coral));}
.feat-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:16px;}
.feat-item{background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.12); border-radius:var(--radius); padding:24px 20px; min-height:150px; display:flex; flex-direction:column; justify-content:space-between; transition:transform .25s var(--ease), background .25s var(--ease);}
.feat-item:hover{background:rgba(255,255,255,0.13); transform:translateY(-4px);}
.feat-item svg{width:22px; height:22px; stroke:#fff; padding:9px; box-sizing:content-box; border-radius:10px;}
.feat-item:nth-child(4n+1) svg{background:rgba(255,201,60,.22); stroke:var(--yellow);}
.feat-item:nth-child(4n+2) svg{background:rgba(255,93,115,.22); stroke:var(--coral);}
.feat-item:nth-child(4n+3) svg{background:rgba(63,174,114,.25); stroke:#6BE0A0;}
.feat-item:nth-child(4n+4) svg{background:rgba(255,255,255,.16); stroke:#fff;}
.feat-item h4{font-family:'Public Sans', sans-serif; font-size:15px; font-weight:700; color:#fff; margin-top:14px;}
.feat-item p{font-size:13px; color:#BFDCF0; margin:6px 0 0;}

/* ---------- PRICING ---------- */
.pricing{padding:96px 0;}
.price-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; align-items:stretch;}
.price-card{background:#fff; border-radius:var(--radius); padding:32px 28px 28px; position:relative; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; border:1px solid var(--line);}
.price-card:nth-child(1){border-top:5px solid var(--coral);}
.price-card:nth-child(3){border-top:5px solid var(--green);}
.price-card.featured{background:linear-gradient(160deg,var(--blue) 0%, #00A3C4 100%); color:#fff; transform:translateY(-12px); border:none; box-shadow:0 28px 48px -20px rgba(0,119,194,.5);}
.price-card.featured .price-name, .price-card.featured h3{color:#fff;}
.price-card.featured p{color:#E4F6FF;}
.price-card.featured .price-amt sup, .price-card.featured .price-amt small{color:#E4F6FF;}
.price-tag{font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--coral-deep); font-weight:700;}
.price-card:nth-child(3) .price-tag{color:var(--green-deep);}
.price-card.featured .price-tag{color:#FFE9A8;}
.price-card h3{font-size:20px; margin:8px 0 4px;}
.price-amt{font-family:'Fraunces', serif; font-size:40px; font-weight:750; margin:14px 0 6px;}
.price-amt sup{font-size:16px; font-weight:600; margin-right:2px;}
.price-amt small{font-size:13px; font-weight:500; font-family:'Public Sans',sans-serif; color:var(--ink-soft);}
.price-card p.desc{color:var(--ink-soft); font-size:14.5px; margin-bottom:22px;}
.price-card p.desc2{color:var(--paper); font-size:14.5px; margin-bottom:22px;}
.price-card ul.incl{list-style:none; margin:0 0 24px; padding:0; font-size:13.5px; color:var(--ink-soft); display:flex; flex-direction:column; gap:8px;}
.price-card.featured ul.incl{color:#EAF8FF;}
.price-card ul.incl li{display:flex; gap:8px; align-items:flex-start;}
.price-card .btn{margin-top:auto; justify-content:center;}

.faq{margin-top:64px; max-width:760px;}
.faq-item{border-bottom:1px solid var(--line); padding:18px 0;}
.faq-item h4{font-family:'Public Sans',sans-serif; font-size:15.5px; font-weight:700; margin-bottom:6px;}
.faq-item p{margin:0; color:var(--ink-soft); font-size:14.5px;}

/* ---------- VIDEO ---------- */
.video-sec{padding:96px 0; background:var(--tint);}
.video-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;}
.video-card{border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); background:#000; aspect-ratio:16/9; border:1px solid var(--line);}
.video-card iframe{width:100%; height:100%; border:0; display:block;}

/* ---------- CONTACT ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px; padding:88px 0;}
.contact-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow-sm);}
.contact-card h3{font-size:19px; margin-bottom:10px;}
.contact-card p{color:var(--ink-soft); font-size:14.5px; margin-bottom:18px;}
.contact-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px;}
.contact-list li{display:flex; gap:14px; align-items:flex-start;}
.contact-list svg{width:19px; height:19px; stroke:var(--blue); flex:none; margin-top:3px; padding:8px; box-sizing:content-box; background:var(--blue-light); border-radius:10px;}
.contact-list .lbl{font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); display:block; margin-bottom:2px;}
.contact-list .val{font-size:14.5px; font-weight:650;}
.contact-list a.val{text-decoration:none; color:var(--blue);}

.form-field{margin-bottom:18px;}
.form-field label{display:block; font-size:13px; font-weight:700; margin-bottom:6px; font-family:'Public Sans',sans-serif;}
.form-field input, .form-field textarea, .form-field select{
  width:100%; padding:11px 13px; border:1.5px solid var(--line); border-radius:var(--radius-sm);
  font-family:'Public Sans', sans-serif; font-size:14.5px; background:var(--tint); color:var(--ink);
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{outline:none; border-color:var(--blue); background:#fff;}
.form-note{font-size:12.5px; color:var(--ink-soft); margin-top:6px;}

/* ---------- CTA BAND ---------- */
.cta-band{padding:88px 0; text-align:center; background:linear-gradient(135deg,var(--blue-light) 0%, #fff 60%);}
.cta-band h2{font-size:clamp(28px,3.6vw,42px); max-width:20ch; margin:0 auto 18px;}
.cta-band p{color:var(--ink-soft); margin-bottom:30px;}
.cta-band .btn{padding:15px 30px; font-size:15.5px;}

/* ---------- FOOTER ---------- */
footer.site{background:var(--ink); color:#B9C2D6; padding:56px 0 28px;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,0.12);}
.foot-brand{display:flex; align-items:center; gap:10px; margin-bottom:14px;}
.foot-brand img{height:36px; width:auto; background:#fff; border-radius:10px; padding:3px;}
.foot-brand .word{font-family:'Fraunces',serif; font-weight:750; font-size:19px; color:#fff;}
footer.site p{font-size:13.5px; line-height:1.6; max-width:34ch;}
footer.site h5{color:#fff; font-family:'Public Sans',sans-serif; font-size:13px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:14px;}
footer.site ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;}
footer.site a{text-decoration:none; font-size:14px; color:#B9C2D6; transition:color .2s;}
footer.site a:hover{color:var(--yellow);}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:24px; flex-wrap:wrap; gap:12px; font-size:12.5px; color:#7C87A0; font-family:'IBM Plex Mono', monospace;}
.foot-social{display:flex; gap:14px;}
.foot-social a{color:#B9C2D6;}
.foot-social a:hover{color:var(--yellow);}

/* reveal on scroll */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .6s var(--ease), transform .6s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}

/* ---------- HERO BADGE ROW ---------- */
.badge-row{display:flex; align-items:center; gap:10px; margin-bottom:20px; flex-wrap:wrap;}
.badge-row .pill{font-family:'IBM Plex Mono', monospace; font-size:12px; font-weight:600; color:var(--blue); background:var(--blue-light); border-radius:999px; padding:6px 14px;}

/* ---------- DASHBOARD MOCKUP (hero visual) ---------- */
.mockup-shell{position:relative;}
.mockup-panel{
  background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); border:1px solid var(--line);
  overflow:hidden; transform:rotate(-1deg); animation:ticketIn .7s var(--ease) both;
}
.mockup-topbar{display:flex; align-items:center; gap:8px; padding:14px 18px; border-bottom:1px solid var(--line); background:var(--tint);}
.mockup-topbar span{width:10px; height:10px; border-radius:50%; background:var(--line);}
.mockup-topbar span:nth-child(1){background:var(--coral);}
.mockup-topbar span:nth-child(2){background:var(--yellow);}
.mockup-topbar span:nth-child(3){background:var(--green);}
.mockup-topbar .mt-label{margin: 0; font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--ink-soft);}
.mockup-body{padding:22px 22px 26px; display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.mockup-kpi{background:var(--tint); border-radius:12px; padding:16px 16px;}
.mockup-kpi .kv{font-family:'Fraunces', serif; font-size:22px; font-weight:700; color:var(--ink);}
.mockup-kpi .kl{font-size:12px; color:var(--ink-soft); margin-top:2px;}
.mockup-kpi.accent-blue{background:var(--blue-light);}
.mockup-kpi.accent-green{background:rgba(63,174,114,.12);}
.mockup-rows{grid-column:1 / -1; display:flex; flex-direction:column; gap:10px; margin-top:4px;}
.mockup-row{display:flex; align-items:center; gap:12px; font-size:13px; color:var(--ink-soft); background:var(--tint); border-radius:10px; padding:10px 14px;}
.mockup-row b{color:var(--ink); font-weight:650; font-size:13px;}
.mockup-row .tag-pill{margin-left:auto; font-family:'IBM Plex Mono', monospace; font-size:10.5px; padding:3px 9px; border-radius:999px; font-weight:700;}
.mockup-row .tag-pill.processing{background:rgba(255,201,60,.22); color:var(--yellow-deep);}
.mockup-row .tag-pill.done{background:rgba(63,174,114,.16); color:var(--green-deep);}
.mockup-row .tag-pill.transit{background:var(--blue-light); color:var(--blue);}

.float-badge{
  position:absolute; background:#fff; border-radius:14px; box-shadow:var(--shadow);
  padding:12px 16px; display:flex; align-items:center; gap:10px; border:1px solid var(--line);
  font-family:'Public Sans', sans-serif; z-index:2; animation:floatIn .8s var(--ease) both;
}
.float-badge .fb-ico{width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:17px; flex:none;}
.float-badge .fb-num{font-family:'Fraunces', serif; font-weight:750; font-size:16px; color:var(--ink); line-height:1.1;}
.float-badge .fb-lbl{font-size:11px; color:var(--ink-soft);}
.float-badge.badge-1{top:-22px; right:-18px; animation-delay:.15s;}
.float-badge.badge-1 .fb-ico{background:rgba(63,174,114,.16);}
.float-badge.badge-2{bottom:18px; left:-30px; animation-delay:.35s;}
.float-badge.badge-2 .fb-ico{background:var(--blue-light);}
@keyframes floatIn{from{opacity:0; transform:translateY(10px) scale(.96);} to{opacity:1; transform:translateY(0) scale(1);}}

/* ---------- SERVICE MARQUEE ---------- */
.marquee-sec{padding:32px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; overflow:hidden;}
.marquee-label{text-align:center; font-family:'IBM Plex Mono', monospace; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:18px;}
.marquee-track{display:flex; gap:14px; width:max-content; animation:scrollMarquee 22s linear infinite;}
.marquee-track span{
  font-family:'Public Sans', sans-serif; font-weight:650; font-size:14px; color:var(--ink);
  background:var(--tint); border:1px solid var(--line); border-radius:999px; padding:9px 20px; white-space:nowrap;
}
@keyframes scrollMarquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){.marquee-track{animation:none;}}

/* ---------- BENTO FEATURES (light) ---------- */
.bento-sec{padding:96px 0; background:var(--tint);}
.bento-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.bento-item{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:24px 22px; box-shadow:var(--shadow-sm); transition:transform .25s var(--ease), box-shadow .25s var(--ease);}
.bento-item:hover{transform:translateY(-5px); box-shadow:var(--shadow);}
.bento-item .bi-ico{width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:21px; margin-bottom:14px;}
.bento-item:nth-child(8n+1) .bi-ico{background:rgba(255,201,60,.22);}
.bento-item:nth-child(8n+2) .bi-ico{background:rgba(255,93,115,.18);}
.bento-item:nth-child(8n+3) .bi-ico{background:rgba(63,174,114,.18);}
.bento-item:nth-child(8n+4) .bi-ico{background:var(--blue-light);}
.bento-item:nth-child(8n+5) .bi-ico{background:var(--blue-light);}
.bento-item:nth-child(8n+6) .bi-ico{background:rgba(63,174,114,.18);}
.bento-item:nth-child(8n+7) .bi-ico{background:rgba(255,93,115,.18);}
.bento-item:nth-child(8n+8) .bi-ico{background:rgba(255,201,60,.22);}
.bento-item h4{font-family:'Public Sans', sans-serif; font-size:15.5px; font-weight:700; margin-bottom:6px;}
.bento-item p{margin:0; font-size:13.5px; color:var(--ink-soft);}

/* ---------- STATS BAND ---------- */
.stats-band{padding:64px 0; background:linear-gradient(135deg,var(--blue-deep) 0%, #04588f 100%);}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center;}
.stats-grid .stat b{display:block; font-family:'Fraunces', serif; font-size:clamp(30px,4vw,44px); font-weight:750; color:#fff;}
.stats-grid .stat span{display:block; font-family:'IBM Plex Mono', monospace; font-size:12px; color:#BFDCF0; margin-top:6px; letter-spacing:.04em;}

/* ---------- REASONS ---------- */
.reasons{padding:96px 0;}
.reason-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.reason-card{padding:26px 24px; border-radius:var(--radius); background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-sm);}
.reason-card .ri{font-size:26px; margin-bottom:12px; display:inline-block;}
.reason-card h4{font-size:17px; margin-bottom:8px;}
.reason-card p{margin:0; font-size:14px; color:var(--ink-soft);}

/* ---------- FAQ ACCORDION ---------- */
.faq-acc{max-width:760px; margin:0 auto;}
.faq-acc details{border-bottom:1px solid var(--line); padding:6px 0;}
.faq-acc summary{
  cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center;
  padding:16px 4px; font-family:'Public Sans',sans-serif; font-weight:700; font-size:15.5px; color:var(--ink);
}
.faq-acc summary::-webkit-details-marker{display:none;}
.faq-acc summary::after{content:"+"; font-size:20px; color:var(--blue); font-weight:400; flex:none; margin-left:12px;}
.faq-acc details[open] summary::after{content:"–";}
.faq-acc .faq-body{padding:0 4px 18px; font-size:14.5px; color:var(--ink-soft);}

/* ---------- FAQ ACCORDION ---------- */
.faq-acc{max-width:760px; margin:0 auto;}
.faq-acc details{border-bottom:1px solid var(--line); padding:6px 0;}
.faq-acc summary{
  cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center;
  padding:16px 4px; font-family:'Public Sans',sans-serif; font-weight:700; font-size:15.5px; color:var(--ink);
}
.faq-acc summary::-webkit-details-marker{display:none;}
.faq-acc summary::after{content:"+"; font-size:20px; color:var(--blue); font-weight:400; flex:none; margin-left:12px;}
.faq-acc details[open] summary::after{content:"–";}
.faq-acc .faq-body{padding:0 4px 18px; font-size:14.5px; color:var(--ink-soft);}

/* ---------- PRODUCT ARCHITECTURE (Modules page) ---------- */
.arch-tag{font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; padding:5px 12px; border-radius:999px; display:inline-block;}
.arch-tag.core{background:var(--blue-light); color:var(--blue);}
.arch-tag.addon{background:rgba(63,174,114,.14); color:var(--green-deep);}

.core-card{
  background:linear-gradient(160deg,#fff 0%, var(--blue-light) 130%);
  border:1px solid var(--line); border-radius:var(--radius); padding:36px 34px;
  box-shadow:var(--shadow-sm); margin-bottom:22px; border-top:5px solid var(--blue);
}
.core-card h3{font-size:26px; margin:12px 0 10px;}
.core-card > p{color:var(--ink-soft); font-size:15.5px; max-width:70ch; margin-bottom:24px;}
.core-list{display:grid; grid-template-columns:1fr 1fr; gap:10px 28px; list-style:none; margin:0; padding:0;}
.core-list li{display:flex; align-items:center; gap:10px; font-size:14.5px; color:var(--ink); font-weight:600; padding:8px 0; border-bottom:1px dashed var(--line);}
.core-list li::before{content:"✓"; color:var(--green-deep); font-weight:800; flex:none;}

.addon-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:8px;}
.addon-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px 26px 24px; box-shadow:var(--shadow-sm); border-top:5px solid var(--green);}
.addon-card:nth-child(2){border-top-color:var(--coral);}
.addon-card:nth-child(3){border-top-color:var(--yellow-deep);}
.addon-card:nth-child(4){border-top-color:var(--blue);}
.addon-card h3{font-size:20px; margin:10px 0 8px;}
.addon-card > p{color:var(--ink-soft); font-size:14.5px; margin-bottom:14px;}
.addon-card ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.addon-card ul li{font-size:13.5px; color:var(--ink-soft); display:flex; gap:8px; align-items:flex-start;}
.addon-card ul li::before{content:"—"; color:var(--ink-soft); flex:none;}

.tool-pills{display:flex; flex-wrap:wrap; gap:10px;}
.tool-pills span{
  font-family:'Public Sans', sans-serif; font-size:13.5px; font-weight:650; color:var(--ink);
  background:var(--tint); border:1px solid var(--line); border-radius:999px; padding:9px 16px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 940px){
  .hero .wrap{grid-template-columns:1fr; gap:48px;}
  .module-grid{grid-template-columns:1fr 1fr;}
  .feat-grid{grid-template-columns:1fr 1fr;}
  .price-grid{grid-template-columns:1fr; max-width:420px; margin:0 auto;}
  .price-card.featured{transform:none;}
  .how-list{grid-template-columns:1fr;}
  .video-grid{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .bento-grid{grid-template-columns:1fr 1fr;}
  .stats-grid{grid-template-columns:1fr 1fr; gap:32px;}
  .reason-grid{grid-template-columns:1fr;}
  .float-badge{display:none;}
  .addon-grid{grid-template-columns:1fr;}
  .core-list{grid-template-columns:1fr;}
}
@media (max-width: 680px){
  .nav-links{display:none;}
  .module-grid{grid-template-columns:1fr;}
  .feat-grid{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr;}
  .hero{padding:48px 0 60px;}
  .modules,.how,.features,.pricing,.video-sec,.cta-band,.contact-grid,.bento-sec,.reasons{padding:56px 0;}
  .page-header{padding:48px 0 40px;}
  .bento-grid{grid-template-columns:1fr;}
  .stats-grid{grid-template-columns:1fr 1fr;}
  .mockup-body{grid-template-columns:1fr;}
}