/* ============================================================
   Tanvik — site-v5.css (additive layer over site.css + site-v4.css)
   module grid · what's-new strip · lead/call card · delivery card ·
   social chain · ads list · short-link card · provider chips
   Brand unchanged: ink #090C16 · slate cards · iris #5B5BD6
   Minimum text size in this layer: 14px
   ============================================================ */

/* ---- Illustrative-mockup label (every placeholder visual carries one) ---- */
.mock-note{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:14px;color:var(--t3);letter-spacing:.02em;}
.mock-note::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--warn);opacity:.8;flex-shrink:0;}
.v5-stack{display:flex;flex-direction:column;gap:12px;}

/* ---- Module grid (Features page) ---- */
.mod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:1180px;margin:0 auto;padding:0 24px;}
.mod{display:flex;flex-direction:column;gap:10px;background:var(--card-bg);border:1px solid var(--line);border-radius:16px;padding:22px;text-decoration:none;color:inherit;transition:.3s cubic-bezier(.2,.7,.2,1);position:relative;min-height:176px;}
a.mod:hover{transform:translateY(-4px);border-color:rgba(91,91,214,.35);box-shadow:0 24px 60px rgba(91,91,214,.18);}
.mod-ic{width:38px;height:38px;border-radius:11px;background:var(--soft);display:flex;align-items:center;justify-content:center;font-size:18px;}
.mod b{font-size:16px;color:#fff;line-height:1.3;}
.mod span{font-size:14px;line-height:1.55;color:var(--t2);}
.mod .mod-go{margin-top:auto;font-family:var(--mono);font-size:14px;font-weight:600;color:var(--iris3);}
div.mod .mod-go{color:var(--t3);}
.mod-new{position:absolute;top:16px;right:16px;font-family:var(--mono);font-size:14px;font-weight:700;letter-spacing:.06em;color:var(--iris3);background:var(--soft);border:1px solid rgba(91,91,214,.3);border-radius:20px;padding:1px 9px;line-height:1.5;}
@media(max-width:980px){.mod-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.mod-grid{grid-template-columns:1fr;}.mod{min-height:0;}}

/* ---- What's new strip (Home) ---- */
.wn-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:1180px;margin:0 auto;padding:0 24px;}
.wn{background:var(--card-bg);border:1px solid var(--line);border-radius:16px;padding:20px 22px;text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:8px;transition:.3s cubic-bezier(.2,.7,.2,1);}
.wn:hover{transform:translateY(-4px);border-color:rgba(91,91,214,.35);box-shadow:0 24px 60px rgba(91,91,214,.18);}
.wn-tag{font-family:var(--mono);font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--iris3);}
.wn b{font-size:16px;color:#fff;line-height:1.3;}
.wn span{font-size:14px;color:var(--t2);line-height:1.55;}
.wn .wn-go{margin-top:auto;padding-top:6px;font-size:14px;font-weight:700;color:var(--iris3);}
@media(max-width:980px){.wn-strip{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.wn-strip{grid-template-columns:1fr;}}

/* ---- Lead card with call outcome (Voice AI) ---- */
.lead-card{background:var(--card-bg);border:1px solid var(--line2);border-radius:20px;overflow:hidden;box-shadow:0 40px 100px rgba(0,0,0,.45),0 0 0 1px rgba(91,91,214,.08);}
.lc-head{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);}
.lc-av{width:40px;height:40px;border-radius:50%;background:var(--grad-iris);display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;font-size:15px;flex-shrink:0;}
.lc-name{font-size:15px;font-weight:700;color:#fff;}
.lc-sub{font-family:var(--mono);font-size:14px;color:var(--t3);margin-top:2px;}
.lc-btn{margin-left:auto;display:inline-flex;align-items:center;gap:7px;background:var(--grad-iris);color:#fff;font-size:14px;font-weight:700;padding:9px 14px;border-radius:10px;white-space:nowrap;box-shadow:0 10px 28px rgba(91,91,214,.3);}
.lc-body{padding:18px 20px;display:flex;flex-direction:column;gap:12px;}
.lc-row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px;color:var(--t2);}
.lc-row b{color:#fff;font-weight:600;}
.lc-chip{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;padding:3px 11px;white-space:nowrap;flex-shrink:0;border-radius:20px;background:rgba(74,222,128,.12);color:var(--success);border:1px solid rgba(74,222,128,.25);}
.lc-chip.i{background:var(--soft);color:var(--iris3);border-color:rgba(91,91,214,.3);}
.lc-rec{display:flex;align-items:center;gap:12px;background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;}
.lc-play{width:34px;height:34px;border-radius:50%;background:var(--soft);border:1px solid rgba(91,91,214,.35);display:flex;align-items:center;justify-content:center;color:var(--iris3);font-size:14px;flex-shrink:0;}
.lc-wave{flex:1;display:flex;align-items:center;gap:3px;height:28px;}
.lc-wave i{flex:1;background:rgba(91,91,214,.55);border-radius:2px;display:block;}
.lc-time{font-family:var(--mono);font-size:14px;color:var(--t3);white-space:nowrap;}
.lc-sum{font-size:14px;line-height:1.6;color:var(--t2);background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:14px;}
.lc-sum b{color:#fff;display:block;margin-bottom:4px;font-size:14px;}
.lc-kv{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.lc-kv div{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:14px;color:var(--t2);}
.lc-kv div b{display:block;color:#fff;font-weight:600;margin-top:2px;}
@media(max-width:480px){.lc-btn{display:none;}.lc-kv{grid-template-columns:1fr;}}

/* Agent tuning list (Voice AI) */
.tune-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:1180px;margin:0 auto;padding:0 24px;}
.tune{background:var(--card-bg);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:flex;gap:12px;align-items:flex-start;}
.tune i{font-style:normal;width:30px;height:30px;border-radius:9px;background:var(--soft);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
.tune b{font-size:15px;color:#fff;display:block;margin-bottom:3px;}
.tune span{font-size:14px;color:var(--t2);line-height:1.5;}
@media(max-width:860px){.tune-grid{grid-template-columns:1fr;}}

/* Four-step row (reuses .step-card) */
.steps-wrap.four{grid-template-columns:repeat(4,1fr);}
@media(max-width:980px){.steps-wrap.four{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.steps-wrap.four{grid-template-columns:1fr;}}

/* ---- Delivery card (Campaigns) ---- */
.dl-card{background:var(--card-bg);border:1px solid var(--line2);border-radius:18px;padding:22px;}
.dl-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.dl-head b{font-size:16px;color:#fff;}
.dl-head small{display:block;font-family:var(--mono);font-size:14px;color:var(--t3);margin-top:3px;}
.dl-pct{font-family:var(--mono);font-size:30px;font-weight:700;color:#fff;line-height:1;}
.dl-pct small{font-size:14px;color:var(--t2);font-weight:500;margin-left:6px;}
.dl-bar{display:flex;height:10px;border-radius:6px;overflow:hidden;background:rgba(255,255,255,.06);gap:2px;}
.dl-bar i{display:block;height:100%;}
.dl-key{display:flex;gap:18px;flex-wrap:wrap;margin-top:12px;font-family:var(--mono);font-size:14px;color:var(--t2);}
.dl-key span{display:inline-flex;align-items:center;gap:7px;}
.dl-key span::before{content:'';width:9px;height:9px;border-radius:2px;background:var(--k);}
.dl-fail{margin-top:16px;border-top:1px solid var(--line);padding-top:14px;display:flex;flex-direction:column;gap:9px;}
.dl-fail div{display:grid;grid-template-columns:1fr auto;gap:10px;font-size:14px;color:var(--t2);align-items:baseline;}
.dl-fail div b{color:#fff;font-weight:600;}
.dl-fail div em{font-style:normal;color:var(--iris3);font-weight:600;white-space:nowrap;}
.dl-check{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;}
.dl-check div{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-family:var(--mono);font-size:14px;color:var(--t3);}
.dl-check div b{display:block;color:#fff;font-size:18px;}
@media(max-width:480px){.dl-fail div{grid-template-columns:1fr;}.dl-check{grid-template-columns:1fr;}}

/* ---- Social chain: comment → DM → WhatsApp lead (Social Suite) ---- */
.so-chain{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:10px;align-items:stretch;max-width:1180px;margin:0 auto;padding:0 24px;}
.so-step{background:var(--card-bg);border:1px solid var(--line2);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px;}
.so-lbl{font-family:var(--mono);font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--t3);}
.so-arrow{align-self:center;color:var(--iris3);font-size:20px;}
.so-comment{display:flex;gap:10px;font-size:14px;line-height:1.5;color:var(--t2);}
.so-comment .so-av{width:28px;height:28px;border-radius:50%;background:var(--surface2);border:1px solid var(--line2);flex-shrink:0;}
.so-comment b{color:#fff;font-weight:600;}
.so-reply{font-size:14px;color:var(--t2);padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line);line-height:1.5;}
.so-reply b{color:#fff;font-weight:600;}
.so-wa{font-size:14px;color:#e0fbe2;background:rgba(0,92,75,.85);padding:10px 12px;border-radius:12px;border-bottom-left-radius:4px;line-height:1.5;align-self:flex-start;}
.so-lead{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--success);font-weight:700;font-family:var(--mono);margin-top:auto;}
@media(max-width:860px){.so-chain{grid-template-columns:1fr;}.so-arrow{transform:rotate(90deg);justify-self:center;}}

/* Social calendar mock */
.cal{background:var(--card-bg);border:1px solid var(--line2);border-radius:18px;padding:18px;}
.cal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
.cal-head b{font-size:15px;color:#fff;}
.cal-head span{font-family:var(--mono);font-size:14px;color:var(--iris3);}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
.cal-d{aspect-ratio:1;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:6px;font-family:var(--mono);font-size:14px;color:var(--t3);position:relative;}
.cal-d i{position:absolute;left:6px;right:6px;bottom:6px;height:5px;border-radius:3px;background:var(--iris);display:block;}
.cal-d i.p{background:rgba(255,255,255,.18);}
.cal-d.best{border-color:rgba(91,91,214,.5);background:var(--soft);color:var(--iris3);}
@media(max-width:480px){.cal-d{font-size:14px;padding:4px;}}

/* ---- Ads list (Ads block) ---- */
.ads-list{background:var(--card-bg);border:1px solid var(--line2);border-radius:18px;overflow:hidden;}
.ads-row{display:grid;grid-template-columns:1.7fr repeat(4,1fr) auto;gap:12px;align-items:center;padding:14px 20px;border-bottom:1px solid var(--line);font-size:14px;color:var(--t2);}
.ads-row:last-child{border-bottom:none;}
.ads-row.h{font-family:var(--mono);color:var(--t3);background:rgba(255,255,255,.03);}
.ads-row b{color:#fff;font-weight:600;display:block;}
.ads-row small{font-family:var(--mono);font-size:14px;color:var(--t3);display:block;margin-top:2px;}
.ads-row .n{font-family:var(--mono);color:#fff;}
.ads-row .n.g{color:var(--success);}
.ads-st{font-family:var(--mono);font-size:14px;padding:3px 10px;border-radius:20px;white-space:nowrap;}
.ads-st.on{background:rgba(74,222,128,.12);color:var(--success);}
.ads-st.off{background:rgba(255,255,255,.06);color:var(--t2);}
@media(max-width:860px){.ads-row{grid-template-columns:1fr 1fr;}.ads-row.h{display:none;}.ads-row>*:first-child{grid-column:1/-1;}.ads-row .n::before{content:attr(data-l) ' ';color:var(--t3);}}

/* ---- Short link card ---- */
.sl-card{display:grid;grid-template-columns:1fr 132px;gap:18px;background:var(--card-bg);border:1px solid var(--line2);border-radius:18px;padding:20px;align-items:center;}
.sl-card>div:first-child{min-width:0;}
.sl-url{font-family:var(--mono);font-size:16px;color:#fff;overflow-wrap:anywhere;}
.sl-url span{color:var(--iris3);}
.sl-dest{font-size:14px;color:var(--t2);margin-top:6px;line-height:1.5;}
.sl-stats{display:flex;gap:22px;margin-top:14px;flex-wrap:wrap;}
.sl-stats div{font-family:var(--mono);font-size:14px;color:var(--t3);}
.sl-stats b{display:block;font-size:20px;color:#fff;font-weight:700;}
.sl-qr{width:132px;height:132px;border-radius:12px;border:1px dashed rgba(255,255,255,.3);background:rgba(255,255,255,.04);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-family:var(--mono);font-size:14px;color:var(--t3);text-align:center;}
.sl-qr b{color:#fff;font-size:15px;}
@media(max-width:480px){.sl-card{grid-template-columns:1fr;}.sl-qr{width:100%;height:96px;}}

/* ---- Provider chips + key test (Bring your own AI) ---- */
.prov-row{display:flex;gap:10px;flex-wrap:wrap;}
.prov{display:inline-flex;align-items:center;gap:8px;background:var(--card-bg);border:1px solid var(--line2);border-radius:12px;padding:10px 16px;font-size:14px;font-weight:700;color:#fff;}
.prov i{font-style:normal;width:8px;height:8px;border-radius:50%;background:var(--iris3);}
.prov.on{border-color:rgba(74,222,128,.4);}
.prov.on i{background:var(--success);}
.keytest{background:var(--card-bg);border:1px solid var(--line2);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:12px;}
.keytest .kt-row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px;color:var(--t2);padding:10px 12px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;}
.keytest .kt-row b{color:#fff;font-weight:600;}
.keytest .kt-ok{color:var(--success);font-family:var(--mono);font-weight:700;}
.keytest .kt-warn{color:var(--warn);font-family:var(--mono);font-weight:700;}

/* ---- Approval screen mock (Connect to Claude) ---- */
.appr{background:var(--card-bg);border:1px solid var(--line2);border-radius:18px;padding:24px;max-width:420px;margin:0 auto;text-align:center;}
.appr .ap-ic{width:52px;height:52px;border-radius:14px;background:var(--soft);border:1px solid rgba(91,91,214,.3);margin:0 auto 14px;display:flex;align-items:center;justify-content:center;font-size:22px;}
.appr h4{font-size:18px;color:#fff;margin:0 0 6px;font-weight:800;letter-spacing:-.01em;}
.appr p{font-size:14px;color:var(--t2);line-height:1.6;margin:0 0 16px;}
.appr .ap-list{text-align:left;display:flex;flex-direction:column;gap:6px;margin-bottom:18px;}
.appr .ap-list div{font-size:14px;color:var(--t2);display:flex;gap:9px;}
.appr .ap-list div::before{content:'✓';color:var(--success);font-weight:800;}
.appr .ap-btns{display:flex;gap:10px;justify-content:center;}
.appr .ap-btns span{font-size:14px;font-weight:700;padding:10px 20px;border-radius:10px;border:1px solid var(--line2);color:var(--t1);}
.appr .ap-btns span.y{background:var(--grad-iris);border-color:transparent;color:#fff;}

/* Link-flow mock (Send WhatsApp from a link) */
.linkflow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:10px;align-items:center;}
.lf{background:var(--card-bg);border:1px solid var(--line2);border-radius:14px;padding:14px 16px;text-align:center;}
.lf b{font-size:15px;color:#fff;display:block;margin-bottom:3px;}
.lf span{font-size:14px;color:var(--t2);display:block;line-height:1.5;}
.lf code{font-family:var(--mono);font-size:14px;color:var(--iris3);display:block;margin-top:6px;word-break:break-all;}
.lf-arrow{color:var(--iris3);font-size:20px;}
@media(max-width:860px){.linkflow{grid-template-columns:1fr;}.lf-arrow{transform:rotate(90deg);text-align:center;}}

/* Layout helper: two-col content + visual, visual gets room */
.two-col.v5{align-items:center;}
.two-col.v5 .tc-vis{min-width:0;}

/* Plan-availability line (words only) */
.avail{font-family:var(--mono);font-size:14px;color:var(--t3);margin-top:12px;}
.avail a{color:var(--iris3);}

@media(prefers-reduced-motion:reduce){a.mod:hover,.wn:hover{transform:none;}}

/* ---- Home hero refresh ---- */
.hero .trust-bar{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px 18px;}
.hero .trust-bar .tb-item{padding:0;border:none!important;font-size:14px;line-height:1.45;}
.hero-chat{padding-top:56px;}
.hero-chat .hero-chip.tl{top:0;left:0;}
.hero-chip .hc-num{font-size:16px;white-space:nowrap;}
.hero-chip .hc-lbl{font-size:14px;letter-spacing:.02em;text-transform:none;}
.hero-new{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px;}
.hero-new a{white-space:nowrap;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--t1);background:rgba(255,255,255,.04);border:1px solid var(--line2);border-radius:999px;padding:5px 12px 5px 5px;transition:.2s;}
.hero-new a:hover{border-color:rgba(91,91,214,.45);background:var(--soft);}
.hero-new b{font-family:var(--mono);font-size:14px;color:#fff;background:var(--iris);border-radius:999px;padding:1px 9px;}


/* ============ ICON SYSTEM (replaces emoji sitewide) ============
   One sprite: assets/img/icons.svg · 24px grid · 1.75 stroke · currentColor */
.ic{width:1em;height:1em;display:inline-block;vertical-align:-.15em;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;overflow:visible;}
.di{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;background:var(--soft);color:var(--iris3);font-size:16px;}
.dropdown a:hover .di{background:rgba(91,91,214,.22);color:#fff;}
.mobile-menu a .ic{font-size:16px;color:var(--iris3);margin-right:10px;vertical-align:-.2em;}
.ic-tile{width:44px;height:44px;border-radius:12px;background:var(--soft);border:1px solid rgba(91,91,214,.22);color:var(--iris3);display:flex;align-items:center;justify-content:center;font-size:21px;margin-bottom:16px;}
.feat-card:hover .ic-tile,.spot:hover .ic-tile{color:#fff;border-color:rgba(91,91,214,.45);}
.pi-ic,.mod-ic,.cc-ic,.ap-ic,.tune i,.fn-ic,.pc-ic,.lp-b-icon,.feat-icon,.moat-icon,.mi,.ri,.wyp-icon,.cm-icon{color:var(--iris3);font-size:18px;}
.pi-ic .ic,.mod-ic .ic,.tune i .ic,.fn-ic .ic{font-size:18px;}
.ind4 .ind-ic{width:44px;height:44px;border-radius:12px;background:var(--soft);border:1px solid rgba(91,91,214,.22);color:var(--iris3);display:flex;align-items:center;justify-content:center;font-size:21px;margin-bottom:14px;}
.chan4 .ch-ic4{color:#fff;font-size:20px;}
.cc-ic{display:inline-flex;width:38px;height:38px;border-radius:11px;background:var(--soft);align-items:center;justify-content:center;font-size:19px;margin-bottom:10px;}
.pain-card .pc-ic{display:inline-flex;width:40px;height:40px;border-radius:11px;background:rgba(229,72,77,.1);color:#ff8a8e;align-items:center;justify-content:center;font-size:19px;}
.jstep .jnode{color:var(--iris3);font-size:26px;}
.jstep.in-view .jnode{color:#fff;}
.ai-tag .ic{font-size:13px;margin-right:2px;}
.lc-play .ic{font-size:14px;}
.lc-btn .ic{font-size:15px;}
.hero-chip .hc-num .ic{font-size:15px;margin-right:4px;}
.tb-item .ic{color:var(--iris3);font-size:15px;}
.sec-head h2 .ic,.cta-banner .ic{display:none;}
@media(max-width:600px){.jstep .jnode{font-size:20px;}}