/* ==========================================================================
   Adwix Connect — SEO landing pages (tools, pricing calculator, industries).
   Loaded after adwix.css + pages.css; uses the same tokens and components.
   ========================================================================== */
svg.i{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}

/* breadcrumbs */
.lp-crumbs{padding-top:18px;font-size:.86rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.lp-crumbs a{color:var(--muted);}
.lp-crumbs a:hover{color:var(--brand-700);}
.lp-crumbs [aria-current]{color:var(--heading);font-weight:600;}
.lp-crumbs__sep{opacity:.5;}
.lp .phero{padding-top:clamp(18px,3vw,36px);}
.lp .phero .meta{font-size:.85rem;color:var(--muted);margin-top:-6px;}

/* section rhythm */
.lp-sec{padding:clamp(44px,7vw,88px) 0;}
.lp-sec--soft{background:var(--bg-soft);}
.measure{max-width:820px;margin-inline:auto;}
.lp-h2{font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.15;margin-bottom:14px;}
.lp-lead{font-size:clamp(1rem,1.5vw,1.12rem);color:var(--text);margin-bottom:22px;}
.prose p{color:var(--text);line-height:1.75;margin-bottom:14px;}
.prose h3{font-size:1.18rem;margin:26px 0 8px;}
.prose ul,.prose ol{margin:0 0 16px 1.2em;color:var(--text);line-height:1.7;}
.prose li{margin-bottom:6px;}
.prose a{color:var(--brand-700);font-weight:600;}
.prose strong{color:var(--heading);}

/* tables */
.lp-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;margin:18px 0 10px;}
.lp-table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:520px;}
.lp-table th,.lp-table td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:top;}
.lp-table thead th{background:var(--bg-soft);font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;}
.lp-table tbody tr:last-child td{border-bottom:0;}
.lp-table td:first-child{font-weight:600;color:var(--heading);}
.lp-table .yes{color:var(--brand-700);font-weight:700;}
.lp-table .no{color:#b4433b;font-weight:600;}
.lp-note{font-size:.85rem;color:var(--muted);}

/* callout */
.callout{border:1px solid rgba(37,211,102,.35);background:var(--bg-mint);border-radius:var(--r-sm);padding:16px 18px;color:var(--heading);margin:18px 0;}
.callout strong{color:var(--brand-700);}

/* numbered steps */
.steps{counter-reset:s;display:grid;gap:14px;margin:18px 0;}
.steps li{list-style:none;counter-increment:s;position:relative;padding:16px 18px 16px 62px;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);color:var(--text);line-height:1.6;}
.steps li::before{content:counter(s);position:absolute;left:16px;top:14px;width:32px;height:32px;border-radius:50%;background:var(--brand-grad);color:#fff;font-weight:800;display:grid;place-items:center;font-size:.95rem;}
.steps li strong{display:block;color:var(--heading);margin-bottom:2px;}

/* use-case cards */
.uc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.uc{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px 22px;box-shadow:var(--sh-xs);}
.uc__ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--bg-mint);color:var(--brand-700);margin-bottom:14px;}
.uc__ic svg{width:24px;height:24px;}
.uc h3{font-size:1.08rem;margin-bottom:7px;}
.uc p{font-size:.94rem;color:var(--muted);line-height:1.6;}

/* sample WhatsApp templates */
.tpl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.tpl{background:#efeae2;border-radius:var(--r);padding:16px;border:1px solid var(--line);}
.tpl__label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--brand-700);margin-bottom:8px;display:flex;justify-content:space-between;gap:8px;}
.tpl__label span{color:var(--muted);}
.tpl__msg{background:#fff;border-radius:4px 14px 14px 14px;padding:12px 14px;font-size:.92rem;line-height:1.55;color:#1f2c26;box-shadow:0 1px 1px rgba(0,0,0,.06);white-space:pre-line;}
.tpl__btns{display:grid;gap:6px;margin-top:6px;}
.tpl__btns span{background:#fff;border-radius:10px;text-align:center;padding:9px;font-size:.88rem;font-weight:600;color:#027eb5;}

/* flow (automation) */
.flow-v{display:grid;gap:0;margin:18px 0;}
.flow-v__step{display:grid;grid-template-columns:44px 1fr;gap:14px;position:relative;padding-bottom:18px;}
.flow-v__step:not(:last-child)::after{content:"";position:absolute;left:21px;top:44px;bottom:0;width:2px;background:var(--line);}
.flow-v__dot{width:44px;height:44px;border-radius:50%;background:#fff;border:2px solid var(--brand);display:grid;place-items:center;color:var(--brand-700);font-weight:800;}
.flow-v__body{padding-top:9px;color:var(--text);line-height:1.6;}
.flow-v__body strong{color:var(--heading);}

/* tool + calculator panel */
.toolbox{max-width:980px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:start;}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px;box-shadow:var(--sh-sm);}
.panel h2{font-size:1.15rem;margin-bottom:16px;}
.panel .row2{display:grid;grid-template-columns:120px 1fr;gap:10px;}
.panel textarea.input{min-height:96px;resize:vertical;font-family:inherit;}
.panel .hint{font-size:.8rem;color:var(--muted);margin-top:6px;}
.panel .err{font-size:.85rem;color:#b4433b;margin-top:6px;min-height:1.2em;}
.out-link{display:flex;gap:8px;align-items:stretch;margin-bottom:12px;}
.out-link input{flex:1;min-width:0;font-weight:600;color:var(--heading);}
.qr-box{display:grid;place-items:center;background:var(--bg-soft);border:1px dashed var(--line);border-radius:var(--r-sm);min-height:240px;padding:16px;margin-bottom:12px;}
.qr-box img,.qr-box canvas{width:220px;height:220px;image-rendering:pixelated;background:#fff;padding:10px;border-radius:12px;}
.qr-box .ph{color:var(--muted);font-size:.9rem;text-align:center;}
.btnrow{display:flex;gap:10px;flex-wrap:wrap;}
.btnrow .btn{flex:1;justify-content:center;min-width:140px;}
.copied{color:var(--brand-700);font-weight:700;font-size:.85rem;min-height:1.2em;}

.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;}
.calc-grid .field{margin-bottom:0;}
.calc-grid label small{font-weight:500;color:var(--muted);}
.calc-out{display:grid;gap:10px;}
.calc-line{display:flex;justify-content:space-between;gap:12px;font-size:.95rem;color:var(--text);padding:8px 0;border-bottom:1px dashed var(--line);}
.calc-line b{color:var(--heading);font-variant-numeric:tabular-nums;}
.calc-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:6px;padding:14px 16px;border-radius:var(--r-sm);background:var(--bg-mint);}
.calc-total span{font-weight:700;color:var(--heading);}
.calc-total b{font-size:1.6rem;color:var(--brand-700);font-variant-numeric:tabular-nums;}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-pill);padding:4px;background:var(--bg-soft);gap:4px;margin-bottom:16px;}
.seg button{border:0;background:transparent;padding:8px 14px;border-radius:var(--r-pill);font:inherit;font-weight:600;font-size:.88rem;color:var(--text);cursor:pointer;}
.seg button[aria-pressed="true"]{background:#fff;color:var(--heading);box-shadow:var(--sh-xs);}

/* related links */
.rel{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.rel a{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:16px 18px;color:var(--heading);font-weight:700;transition:border-color .2s,transform .2s;}
.rel a span{display:block;font-weight:500;color:var(--muted);font-size:.88rem;margin-top:4px;}
.rel a:hover{border-color:var(--brand);transform:translateY(-2px);}

@media (max-width:900px){
  .toolbox{grid-template-columns:1fr;}
  .uc-grid,.tpl-grid,.rel{grid-template-columns:1fr 1fr;}
}
@media (max-width:600px){
  .uc-grid,.tpl-grid,.rel,.calc-grid{grid-template-columns:1fr;}
  .panel{padding:18px;}
  .panel .row2{grid-template-columns:96px 1fr;}
}

/* the quotable definition at the top of a feature page */
.lp-answer{font-size:1.08rem;line-height:1.75;color:var(--heading);padding:18px 22px;background:var(--bg-soft);border-left:4px solid var(--brand);border-radius:0 var(--r-sm) var(--r-sm) 0;}
