/* Business pages (/business, /schools-and-colleges, /small-business, /enterprise).
   Components copied from index.html's inline <style> so these pages match the family homepage. */
/* hero — full-bleed family photo */
.fhero{ position:relative; min-height:min(78vh,660px); display:flex; align-items:flex-end; overflow:hidden; }
.fhero__bg{ position:absolute; inset:0; } .fhero__bg img{ width:100%; height:100%; object-fit:cover; object-position:72% center; }
.fhero__scrim{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,40,44,.85) 0%, rgba(8,40,44,.52) 42%, rgba(8,40,44,.12) 72%, rgba(8,40,44,0) 100%), linear-gradient(0deg, rgba(8,40,44,.55) 0%, rgba(8,40,44,0) 42%); }
.fhero__in{ position:relative; padding-top:clamp(48px,7vw,84px); padding-bottom:clamp(40px,5vw,64px); max-width:660px; }
.fhero .eyebrow{ color:#7fe0e6; }
.fhero h1{ color:#fff; font-size:clamp(36px,6vw,62px); letter-spacing:-0.035em; line-height:1.04; margin-top:14px; }
.fhero p{ color:rgba(255,255,255,.9); font-size:clamp(16px,2vw,20px); line-height:1.5; margin-top:18px; max-width:520px; }
.fhero__btns{ margin-top:26px; display:flex; gap:12px; flex-wrap:wrap; }
.fhero__note{ margin-top:14px; font-size:14px; color:rgba(255,255,255,.82); max-width:520px; }
.fhero__facts{ margin-top:22px; display:flex; gap:8px 20px; flex-wrap:wrap; font-size:13.5px; font-weight:600; color:rgba(255,255,255,.82); }
.fhero__facts span{ display:inline-flex; align-items:center; gap:7px; } .fhero__facts i{ font-size:16px; color:#7fe0e6; }

.avail{ border-bottom:1px solid var(--line); background:var(--surface); }
.avail__in{ display:flex; align-items:center; justify-content:center; gap:10px 26px; flex-wrap:wrap; padding:18px 0; }
.avail__lab{ font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-400); }
.avail__os{ display:inline-flex; align-items:center; gap:7px; font-size:14px; font-weight:700; color:var(--ink-700); } .avail__os i{ font-size:17px; color:var(--teal-700); }

.f-head{ max-width:720px; margin:0 auto clamp(32px,4vw,46px); text-align:center; }
.f-head h2{ font-size:clamp(27px,3.6vw,42px); letter-spacing:-0.03em; } .f-head p{ margin-top:13px; font-size:17.5px; color:var(--ink-500); }

.appic{ width:36px; height:36px; border-radius:9px; background:#fff; border:1px solid var(--line); display:grid; place-items:center; box-shadow:var(--sh-1); overflow:hidden; }
.appic img{ width:24px; height:24px; display:block; object-fit:contain; }
.blocknote{ margin:clamp(24px,3vw,32px) auto 0; max-width:720px; text-align:center; background:var(--teal-50); border:1px solid var(--teal-100); border-radius:var(--r-lg); padding:16px 22px; font-size:15px; color:var(--teal-800); }
.blocknote b{ font-weight:800; }
/* app wall (auto-scrolling row) + category switches */
.marquee{ position:relative; overflow:hidden; padding:6px 0; -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
.marquee__track{ display:flex; width:max-content; animation:marq 40s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes marq{ from{ transform:translateX(0); } to{ transform:translateX(-33.3333%); } }
.marquee__set{ display:flex; gap:16px; padding-right:16px; flex:0 0 auto; }
.marquee .appic{ width:58px; height:58px; border-radius:15px; } .marquee .appic img{ width:34px; height:34px; }
@media (prefers-reduced-motion: reduce){ .marquee__track{ animation:none; } .marquee{ overflow-x:auto; } }
.chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; max-width:780px; margin:30px auto 0; }
.chip{ display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border:1px solid var(--line); border-radius:999px; background:var(--surface); font-size:14px; font-weight:700; color:var(--ink-700); }
.chip svg{ color:var(--teal-600); } .chip .sw{ width:30px; height:18px; border-radius:999px; background:var(--teal-600); position:relative; flex:0 0 auto; } .chip .sw::after{ content:""; position:absolute; top:2px; right:2px; width:14px; height:14px; border-radius:50%; background:#fff; }

/* schedules — 3 demos */
.demo3{ display:flex; flex-direction:column; gap:clamp(18px,2.5vw,26px); max-width:920px; margin:0 auto; }
.demorow{ display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(20px,3vw,40px); align-items:center; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-xl); padding:clamp(22px,3vw,34px); }
.demorow:nth-child(even){ background:var(--bg); } @media (max-width:720px){ .demorow{ grid-template-columns:1fr; } }
.demorow h3{ font-size:20px; } .demorow p{ margin-top:8px; font-size:15px; color:var(--ink-500); } .demorow .eyebrow{ margin-bottom:8px; }
.mini{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1); padding:16px 18px; }
.mini__top{ display:flex; align-items:center; gap:11px; } .mini__ic{ width:36px; height:36px; border-radius:10px; background:var(--teal-50); color:var(--teal-600); display:grid; place-items:center; font-size:18px; flex:0 0 auto; }
.mini__nm{ font-size:14.5px; font-weight:800; display:block; } .mini__mt{ font-size:12px; color:var(--ink-400); display:block; }
.mini__badge{ margin-left:auto; font-family:var(--mono); font-size:10.5px; color:var(--teal-700); background:var(--teal-50); border-radius:999px; padding:4px 10px; white-space:nowrap; }
.mini__win{ display:flex; align-items:center; gap:8px; margin-top:13px; padding-top:12px; border-top:1px solid var(--line-2); font-size:12.5px; font-weight:700; color:var(--ink-500); flex-wrap:wrap; }
.mini__chip{ font-family:var(--mono); font-size:11.5px; background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:3px 9px; color:var(--ink-900); }
.mini__pill{ font-size:11.5px; font-weight:700; border-radius:999px; padding:3px 10px; } .mini__pill--off{ background:var(--block-50); color:var(--block); }

/* built to stay on — dark zig-zag */
.stay{ background:#101a1c; color:#eaf3f2; }
.stay .wrap{ padding-top:clamp(60px,8vw,100px); padding-bottom:clamp(60px,8vw,100px); }
.stay__head{ max-width:680px; margin:0 auto clamp(34px,5vw,52px); text-align:center; }
.stay__head .eyebrow{ color:#4fd0d8; } .stay__head h2{ color:#fff; font-size:clamp(27px,3.6vw,42px); margin-top:12px; } .stay__head p{ color:#9fb3b2; margin-top:14px; font-size:17px; }

/* privacy with background image */
.privbg{ position:relative; overflow:hidden; }
.privbg__img{ position:absolute; inset:0; } .privbg__img img{ width:100%; height:100%; object-fit:cover; object-position:center 30%; }
.privbg__scrim{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(247,250,249,.75) 0%, rgba(247,250,249,.55) 40%, rgba(8,40,44,.55) 100%); }
.privbg .wrap{ position:relative; }
.priv3{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2.5vw,24px); }
@media (max-width:760px){ .priv3{ grid-template-columns:1fr; max-width:420px; margin:0 auto; } }
.pcard{ background:rgba(255,255,255,.92); backdrop-filter:blur(4px); border:1px solid var(--line); border-radius:var(--r-lg); padding:26px; box-shadow:var(--sh-1); }
.pcard__ic{ width:44px; height:44px; border-radius:12px; background:var(--teal-50); color:var(--teal-600); display:grid; place-items:center; font-size:22px; }
.pcard h3{ font-size:17px; margin-top:16px; } .pcard p{ margin-top:8px; font-size:14.5px; color:var(--ink-500); line-height:1.55; }

/* schedules — blurred photo background (same idea as privacy) */
.schedbg{ position:relative; overflow:hidden; }
.schedbg__img{ position:absolute; inset:0; } .schedbg__img img{ width:100%; height:100%; object-fit:cover; object-position:center 35%; filter:blur(3px); transform:scale(1.06); }
.schedbg__scrim{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(247,250,249,.75) 0%, rgba(247,250,249,.55) 40%, rgba(8,40,44,.55) 100%); }
.schedbg .wrap{ position:relative; }

/* why zaksha — what we do vs what we'll never do */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2.4vw,26px); max-width:1000px; margin:0 auto; }
@media (max-width:760px){ .split{ grid-template-columns:1fr; max-width:520px; } }
.panel{ border-radius:var(--r-xl); padding:clamp(26px,3vw,34px); box-shadow:var(--sh-1); }
.panel--do{ background:var(--teal-600); color:#fff; }
.panel--dont{ background:var(--surface); border:1px solid var(--line); }
.panel h3{ font-size:18px; letter-spacing:-0.01em; display:flex; align-items:center; gap:9px; }
.panel--do h3 i{ font-size:22px; }
.panel--dont h3{ color:var(--ink-900); } .panel--dont h3 i{ font-size:22px; color:var(--ink-400); }
.panel .sub{ font-size:13px; margin-top:6px; opacity:.85; }
.panel--dont .sub{ color:var(--ink-500); opacity:1; }
.panel ul{ list-style:none; margin:20px 0 0; padding:0; }
.panel li{ display:flex; gap:11px; align-items:flex-start; font-size:14.5px; line-height:1.5; }
.panel li + li{ margin-top:14px; }
.panel--do li i{ color:#bff0ea; font-size:19px; flex:none; }
.panel--dont li{ color:var(--ink-700); } .panel--dont li i{ color:var(--ink-300); font-size:19px; flex:none; }

/* ---------- Business pages only ---------- */
/* same overlay as the family hero, deeper stops: this photo is brighter and busier behind the text */
.fhero__scrim{ background:linear-gradient(90deg, rgba(8,40,44,.9) 0%, rgba(8,40,44,.78) 42%, rgba(8,40,44,.35) 72%, rgba(8,40,44,.1) 100%), linear-gradient(0deg, rgba(8,40,44,.55) 0%, rgba(8,40,44,0) 42%); }
/* business header: Solutions menu */
.sol{ position:relative; }
.sol summary{ list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:5px; font-size:14.5px; font-weight:600; color:var(--ink-500); padding:7px 12px; border-radius:var(--r-pill); }
.sol summary::-webkit-details-marker{ display:none; }
.sol summary:hover, .sol[open] summary{ color:var(--ink-900); background:var(--bg); }
.sol summary i{ font-size:14px; transition:transform .15s; } .sol[open] summary i{ transform:rotate(180deg); }
.sol__menu{ position:absolute; top:calc(100% + 8px); left:0; width:280px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-2); padding:8px; z-index:60; }
.sol__menu a{ display:block; font-size:14.5px; font-weight:600; color:var(--ink-700); padding:9px 12px; border-radius:10px; }
.sol__menu a:hover{ background:var(--bg); color:var(--ink-900); } .sol__menu a[aria-current="page"]{ color:var(--teal-700); }
.sol__page{ display:none; border-top:1px solid var(--line-2); margin-top:6px; padding-top:6px; }
.sol__note{ border-top:1px solid var(--line-2); margin-top:6px; padding:9px 12px 4px; font-size:12.5px; color:var(--ink-400); }
.nav__in .nav__links{ margin-left:-8px; }
@media (max-width:1023px){ .nav__in .nav__links{ display:none; } .sol__page{ display:block; } }
@media (max-width:760px){
  .sol summary{ padding:7px 8px; font-size:14px; }
  .sol__menu{ position:fixed; top:64px; left:16px; right:16px; width:auto; }
}
@media (max-width:400px){ .nav__in .brand__word{ display:none; } }

/* what goes wrong: two columns of cards */
.wrong{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2.4vw,26px); max-width:1000px; margin:0 auto; }
@media (max-width:760px){ .wrong{ grid-template-columns:1fr; max-width:520px; } }
.wrong__col{ display:flex; flex-direction:column; gap:clamp(14px,2vw,18px); }
.wrong__col .eyebrow{ text-align:center; }

/* records row + Wi-Fi band */
.mini__log{ display:flex; align-items:center; gap:8px; margin-top:10px; font-size:12.5px; flex-wrap:wrap; }
.mini__log:first-of-type{ margin-top:13px; padding-top:12px; border-top:1px solid var(--line-2); }
.mini__t{ font-family:var(--mono); font-size:11.5px; color:var(--ink-400); }
.mini__log .mini__pill{ margin-left:auto; } .mini__pill--ok{ background:var(--allow-50); color:var(--allow); }
.wifi{ max-width:720px; margin:0 auto; }
.plans--one{ grid-template-columns:1fr; max-width:480px; }

/* hero offer line under the buttons (pilot + price) */
.fhero__offer{ margin-top:14px !important; font-size:14px !important; font-weight:600; color:rgba(255,255,255,.85) !important; }
.cbse__src{ font-size:12.5px !important; color:var(--ink-400) !important; } .cbse__src a{ color:var(--teal-700); text-decoration:underline; }

/* small-business / enterprise: card grids, stays-on list */
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(14px,2vw,20px); max-width:1000px; margin:0 auto; }
.grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,20px); max-width:1040px; margin:0 auto; }
@media (max-width:860px){ .grid3{ grid-template-columns:1fr; max-width:520px; } }
@media (max-width:760px){ .grid2{ grid-template-columns:1fr; max-width:520px; } }
.grid2 .pcard h3, .grid3 .pcard h3{ margin-top:0; }
.grid4{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,2vw,20px); max-width:1140px; margin:0 auto; }
@media (max-width:1060px){ .grid4{ grid-template-columns:1fr 1fr; } } @media (max-width:600px){ .grid4{ grid-template-columns:1fr; } }
.grid4 .pcard h3{ margin-top:0; }
.grid--row .pcard{ display:grid; grid-template-columns:auto 1fr; column-gap:14px; align-items:center; align-content:start; }
.grid--row .pcard p{ grid-column:1/-1; }
.whyband{ position:relative; height:clamp(220px,32vw,400px); overflow:hidden; }
.whyband img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 12%; }
.whyband::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,40,44,.1) 30%, rgba(8,40,44,.7)); }
.whyband .wrap{ position:relative; z-index:1; height:100%; display:flex; align-items:flex-end; padding-bottom:28px; }
.whyband h2{ color:#fff; font-size:clamp(30px,4vw,46px); }
.whycards{ padding-top:clamp(28px,4vw,44px); }
.ba{ max-width:860px; margin:0 auto; display:grid; gap:12px; }
.ba__row{ display:grid; grid-template-columns:1fr auto 1.3fr; gap:14px; align-items:center; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:16px 20px; font-size:15px; }
.ba__row span{ color:var(--ink-400); } .ba__row i{ color:var(--teal-600); font-size:18px; } .ba__row b{ color:var(--ink-900); font-weight:700; }
@media (max-width:600px){ .ba__row{ grid-template-columns:1fr; gap:6px; } .ba__row i{ transform:rotate(90deg); } }
.stay__list{ list-style:none; padding:0; margin:0 auto; max-width:760px; display:grid; gap:12px; }
.stay__list li{ display:flex; gap:12px; align-items:flex-start; font-size:16px; line-height:1.5; color:#d7e4e3; }
.stay__list i{ color:#4fd0d8; font-size:20px; flex:none; margin-top:2px; }
.choice{ max-width:1000px; margin:clamp(14px,2vw,20px) auto 0; }
.choice ul{ margin:12px 0 0; padding-left:20px; color:var(--ink-500); font-size:15px; line-height:1.6; } .choice li + li{ margin-top:6px; }
.choice a, .grid3 a{ color:var(--teal-700); font-weight:700; }
.steps--4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:980px){ .steps--4{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .steps--4{ grid-template-columns:1fr; } }

/* marketing#26 rethink: policy building blocks, Why Zaksha */
.pchips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.pchip{ font-size:12px; font-weight:700; color:var(--teal-700); background:var(--teal-50); border:1px solid var(--teal-100); border-radius:999px; padding:4px 10px; }
.pchips__note{ font-size:13px !important; color:var(--ink-400) !important; margin-top:10px !important; }
.why3 .pcard ul{ margin:10px 0 0; padding-left:18px; color:var(--ink-500); font-size:14.5px; line-height:1.55; } .why3 .pcard li + li{ margin-top:6px; }
.why3 .pcard a{ color:var(--teal-700); font-weight:700; }

/* comparison round: small "On request" chip, section notes, trust line */
.chip-sm{ display:inline-block; margin-left:10px; vertical-align:middle; font-size:11.5px; font-weight:700; color:var(--teal-700); background:var(--teal-50); border:1px solid var(--teal-100); border-radius:999px; padding:3px 10px; }
.f-note{ text-align:center; margin-top:18px; font-size:15px; color:var(--ink-500); }
.f-trust{ font-size:13.5px !important; color:var(--ink-400) !important; } .f-trust a{ color:var(--teal-700); font-weight:700; }

/* one pricing card: demo + pilot inside, side by side, stacked on phones (render review 3) */
.price1{ max-width:640px; }
.price1__line{ margin-top:8px; font-size:15px; color:var(--ink-500); }
.price1__opts { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 18px; }
.price1__opts--3 { grid-template-columns: repeat(3, 1fr); }
.price1__opt{ border:1px solid var(--line); border-radius:var(--r-lg); padding:16px 18px; background:var(--bg); display:flex; flex-direction:column; gap:8px; }
.price1__opt h3{ font-size:16px; } .price1__opt p{ font-size:14px; color:var(--ink-500); flex:1; } .price1__opt .btn{ align-self:flex-start; }
.price1__foot{ margin-top:16px; font-size:14px; font-weight:700; color:var(--ink-700); }
@media (max-width: 600px) {
  .price1__opts { grid-template-columns: 1fr; }
}

/* /business pricing: one card per audience (2026-10-30) */
.tiers{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,20px); max-width:1040px; margin:0 auto; }
.tier{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:28px; box-shadow:var(--sh-1); display:flex; flex-direction:column; gap:10px; }
.tier--main{ border-color:var(--teal-600); box-shadow:0 0 0 1px var(--teal-600), var(--sh-1); }
.tier__ic{ width:48px; height:48px; border-radius:12px; background:var(--teal-50); color:var(--teal-600); display:grid; place-items:center; font-size:24px; }
.tier .eyebrow{ color:var(--teal-700); margin-top:6px; } .tier h3{ font-size:20px; }
.tier__head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.tier__badge{ font-size:12px; font-weight:700; color:var(--teal-700); background:var(--teal-50); border:1px solid rgba(13,110,116,.25); border-radius:999px; padding:4px 9px; white-space:nowrap; }
.tier p{ font-size:14.5px; color:var(--ink-500); line-height:1.55; flex:1; }
.tier .btn{ align-self:stretch; justify-content:center; text-align:center; } .tier__more{ align-self:center; font-size:12.5px; font-weight:600; color:var(--teal-700); }
.incl{ max-width:1040px; margin:clamp(22px,3vw,32px) auto 0; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:28px; }
.incl h3{ font-size:17px; } .incl ul{ list-style:none; padding:0; margin:14px 0 0; display:grid; grid-template-columns:repeat(3,1fr); gap:10px 20px; }
.incl li{ display:flex; gap:8px; align-items:center; font-size:14.5px; color:var(--ink-700, #2b3a3c); } .incl li i{ color:var(--teal-600); font-size:18px; }
.incl__foot{ margin-top:18px; font-size:14.5px; } .incl__foot a{ color:var(--teal-700); font-weight:700; }
.incl__note{ margin-top:6px; font-size:12px; color:var(--ink-500); }
@media (max-width:860px){ .tiers{ grid-template-columns:1fr; max-width:520px; } .incl ul{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .incl ul{ grid-template-columns:1fr; } }
.grid2 .pcard p a{ color:var(--teal-700); font-weight:700; text-decoration:underline; text-underline-offset:2px; }