/* Super Web Agent Marketing — 2026 refresh */
:root{
  --ink:#081b2c;
  --muted:#5a6b78;
  --navy:#0c2d48;
  --teal:#0f7280;
  --cyan:#8fe7e8;
  --sea:#dff7f5;
  --paper:#f6f9fb;
  --white:#ffffff;
  --line:#d7e1e7;
  --shadow:0 20px 70px rgba(8,27,44,.10);
  --radius:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--white);line-height:1.6}
a{color:inherit}
.site-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:16px clamp(20px,5vw,72px);background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(215,225,231,.7)}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;text-decoration:none;letter-spacing:-.02em}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--navy),var(--teal));color:white;font-size:13px;letter-spacing:.04em}
.nav{display:flex;align-items:center;gap:26px;font-size:14px;font-weight:700}
.nav a{text-decoration:none;color:#294454}
.nav-cta{padding:10px 16px;border-radius:999px;background:var(--ink);color:white!important}
.menu-btn{display:none;border:0;background:none;font-size:26px}
.section{padding:96px clamp(20px,7vw,110px)}
.alt{background:var(--paper)}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;min-height:740px;align-items:center;background:
radial-gradient(circle at 78% 18%,rgba(143,231,232,.32),transparent 26%),
linear-gradient(180deg,#fff 0%,#f7fbfc 100%)}
.eyebrow{font-size:12px;font-weight:900;letter-spacing:.16em;color:var(--teal);margin-bottom:16px}
h1,h2,h3{line-height:1.08;letter-spacing:-.035em;margin-top:0}
h1{font-size:clamp(48px,6vw,82px);max-width:950px;margin-bottom:24px}
h2{font-size:clamp(36px,4vw,58px);margin-bottom:16px}
h3{font-size:24px;margin-bottom:12px}
.lead{font-size:20px;color:var(--muted);max-width:760px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:34px 0}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:14px;text-decoration:none;font-weight:900;transition:.2s transform,.2s box-shadow}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--ink);color:white;box-shadow:0 12px 24px rgba(8,27,44,.18)}
.btn-secondary{border:1px solid var(--line);background:white}
.microproof{display:flex;flex-wrap:wrap;gap:18px;font-size:13px;color:#47606f}
.hero-panel{padding:22px;border-radius:30px;background:#071b2a;color:white;box-shadow:var(--shadow)}
.status-line{font-size:11px;letter-spacing:.13em;color:#bfe9e7;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.pulse{display:inline-block;width:9px;height:9px;border-radius:50%;background:#46e0c1;box-shadow:0 0 0 7px rgba(70,224,193,.12)}
.flow-card{display:grid;gap:6px;background:rgba(255,255,255,.06);padding:18px;border-radius:20px}
.flow-card>div:not(.arrow){display:flex;justify-content:space-between;gap:16px;padding:15px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.04)}
.flow-card b{font-size:16px}.flow-card span{color:#b7c8d3;font-size:13px;text-align:right}.arrow{text-align:center;color:#6ddad4}
.section-heading{max-width:820px;margin-bottom:42px}
.section-heading p{color:var(--muted);font-size:18px}
.card-grid,.agent-grid,.offer-grid,.case-grid{display:grid;gap:18px}
.four{grid-template-columns:repeat(4,1fr)}
.card,.agent,.offer,.case{border:1px solid var(--line);border-radius:var(--radius);background:white;padding:28px}
.card{min-height:250px}.card p,.agent p,.offer p,.case p{color:var(--muted)}
.card-kicker{font-weight:900;color:var(--teal);font-size:12px}
.case-grid{grid-template-columns:1.4fr 1fr 1fr}
.case.flagship{grid-row:span 2;background:linear-gradient(145deg,#0a263d,#0e5a69);color:white;border:0;display:flex;flex-direction:column;justify-content:space-between}
.case.flagship p,.case.flagship li{color:#d9e9ed}.case ul{padding-left:18px}
.case-badge{margin-top:24px;font-size:12px;font-weight:900;letter-spacing:.12em;color:var(--cyan)}
.pill{display:inline-block;font-size:10px;font-weight:900;letter-spacing:.1em;padding:8px 10px;border-radius:999px;background:var(--sea);color:var(--teal);margin-bottom:18px}
.agent-grid{grid-template-columns:repeat(3,1fr)}
.agent b{font-size:25px;display:block}.agent span{display:block;color:var(--teal);font-weight:800;margin-top:4px}
.offer-grid{grid-template-columns:repeat(2,1fr)}
.offer.featured{border:2px solid #9fdedb;box-shadow:var(--shadow)}
.price{font-size:16px;margin:18px 0}.price b{font-size:42px;letter-spacing:-.05em}.price span{color:var(--muted)}
.custom-note{text-align:center;margin-top:28px;color:var(--muted)}
.review-section{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;background:linear-gradient(180deg,#fff,#f3fbfa)}
.review-steps{list-style:none;padding:0;display:grid;gap:14px}.review-steps li{display:flex;align-items:center;gap:12px}.review-steps span{display:grid;place-items:center;width:30px;height:30px;background:var(--ink);color:white;border-radius:50%;font-weight:900;font-size:12px}
.consent-note{font-size:12px;color:#657985}
.avery-shell{border-radius:28px;border:1px solid var(--line);padding:22px;background:white;box-shadow:var(--shadow);min-height:430px}
.avery-heading{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid var(--line)}.avery-heading>div{display:flex;align-items:center;gap:10px}.avery-heading>span{font-size:12px;color:var(--muted)}
.avery-description{padding:18px 0 4px;color:var(--muted)}
elevenlabs-convai{display:block;min-height:280px}
.final-cta{display:flex;align-items:center;justify-content:space-between;gap:30px;background:#09243a;color:white}.final-cta h2{max-width:900px;margin-bottom:0}.final-cta .eyebrow{color:var(--cyan)}
footer{padding:44px clamp(20px,7vw,110px);display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;background:#061825;color:#c6d2d9;font-size:13px}
.footer-brand{color:white}.footer-links{display:grid;gap:10px}.footer-links a{text-decoration:none}.copyright{align-self:end;text-align:right}
.legal{max-width:920px;margin:auto;padding:80px 24px}.legal h1{font-size:48px}.legal h2{font-size:28px;margin-top:42px}.legal p,.legal li{color:#425867}
@media (max-width:1000px){
  .hero,.review-section{grid-template-columns:1fr}.hero{min-height:auto}.four{grid-template-columns:repeat(2,1fr)}.case-grid{grid-template-columns:1fr 1fr}.case.flagship{grid-row:auto;grid-column:1/-1}.agent-grid{grid-template-columns:repeat(2,1fr)}.nav{display:none}.nav.open{display:flex;position:absolute;top:71px;left:0;right:0;flex-direction:column;background:white;padding:24px;border-bottom:1px solid var(--line)}.menu-btn{display:block}.final-cta{align-items:flex-start;flex-direction:column}
}
@media (max-width:650px){
  .section{padding:72px 20px}h1{font-size:48px}.four,.case-grid,.agent-grid,.offer-grid{grid-template-columns:1fr}.hero{gap:34px;padding-top:58px}.microproof{display:grid}.flow-card>div:not(.arrow){flex-direction:column}.flow-card span{text-align:left}footer{grid-template-columns:1fr}.copyright{text-align:left}
}

/* Approved Super Web Agent logo */
.logo-link{display:block}
.site-logo{display:block;height:54px;width:auto;max-width:min(430px,48vw);object-fit:contain}
.footer-logo{display:block;width:min(360px,100%);height:auto}
@media(max-width:650px){
  .site-logo{height:42px;max-width:70vw}
}

/* =========================================================
   SUPER WEB AGENT — APPROVED DARK BRAND THEME
   Keeps the navy / cyan / teal identity consistent with the
   approved dark logo treatment.
   ========================================================= */
:root{
  --ink:#f4fbff;
  --muted:#9fb4c2;
  --navy:#071827;
  --navy-2:#0a2236;
  --navy-3:#0d2d46;
  --teal:#18c9c1;
  --cyan:#22b8f0;
  --sea:#102f3d;
  --paper:#081c2b;
  --white:#0a2032;
  --line:#1d4054;
  --shadow:0 24px 80px rgba(0,0,0,.38);
}

html,body{background:#061724;color:#f3fbff}
body{
  background:
    radial-gradient(circle at 85% 7%,rgba(24,201,193,.13),transparent 25%),
    radial-gradient(circle at 15% 28%,rgba(34,184,240,.08),transparent 28%),
    #061724;
}

.site-header{
  background:rgba(6,23,36,.94);
  border-bottom:1px solid rgba(38,82,104,.7);
  box-shadow:0 8px 28px rgba(0,0,0,.18);
}
.nav a{color:#c4d7e2}
.nav a:hover{color:#69e8e0}
.nav-cta{
  background:linear-gradient(135deg,#19c9c1,#22aee9);
  color:#04131f!important;
  box-shadow:0 8px 28px rgba(24,201,193,.22);
}
.menu-btn{color:#d9f6fa}

.hero{
  background:
    radial-gradient(circle at 80% 22%,rgba(24,201,193,.18),transparent 30%),
    radial-gradient(circle at 12% 65%,rgba(34,184,240,.08),transparent 28%),
    linear-gradient(180deg,#071b2b 0%,#061724 100%);
}
.hero-panel{
  background:linear-gradient(155deg,#0b2b44,#071826);
  border:1px solid #17435a;
  box-shadow:0 28px 90px rgba(0,0,0,.38),0 0 45px rgba(24,201,193,.06);
}
.lead,.section-heading p,.card p,.agent p,.offer p,.case p,
.custom-note,.avery-description,.p-notes{color:#9fb4c2}
.eyebrow{color:#62e1db}

.alt{background:#081c2b}

.card,.agent,.offer,.case,.avery-shell{
  background:linear-gradient(180deg,#0b2437,#091d2d);
  border-color:#1d4054;
  box-shadow:0 16px 50px rgba(0,0,0,.16);
}
.card:hover,.agent:hover,.offer:hover,.case:hover{
  border-color:#2e7889;
}

.case.flagship{
  background:
    radial-gradient(circle at 80% 10%,rgba(36,224,210,.15),transparent 28%),
    linear-gradient(145deg,#0d344e,#092131);
}
.case.flagship p,.case.flagship li{color:#bed2dc}

.pill{
  background:#103742;
  color:#5ee5dc;
  border:1px solid #1b5662;
}
.agent span,.card-kicker{color:#58ddd6}

.offer.featured{
  border-color:#24bcb7;
  box-shadow:0 20px 65px rgba(0,0,0,.26),0 0 35px rgba(24,201,193,.07);
}
.price span{color:#9fb4c2}

.review-section{
  background:
    radial-gradient(circle at 80% 30%,rgba(25,201,193,.1),transparent 30%),
    linear-gradient(180deg,#071a29,#091f30);
}
.avery-shell{
  box-shadow:0 26px 80px rgba(0,0,0,.35),0 0 30px rgba(34,184,240,.05);
}
.avery-heading{border-bottom-color:#1d4054}
.consent-note{color:#89a4b4}

.btn-primary{
  background:linear-gradient(135deg,#20d0c8,#22b4e9);
  color:#04131f;
  box-shadow:0 12px 34px rgba(25,201,193,.20);
}
.btn-secondary{
  background:#0c273a;
  border-color:#275267;
  color:#e9f7fb;
}
.btn-secondary:hover{border-color:#45c9c4}

.final-cta{
  background:
    radial-gradient(circle at 90% 20%,rgba(31,210,201,.11),transparent 25%),
    linear-gradient(135deg,#071725,#0a2a3e);
  border-top:1px solid #183c4f;
  border-bottom:1px solid #183c4f;
}

footer{
  background:#04111c;
  border-top:1px solid #173447;
  color:#94aebb;
}
.footer-links a:hover{color:#63e6df}

/* Logo sits naturally on dark theme */
.site-logo{
  filter:drop-shadow(0 6px 16px rgba(0,0,0,.24));
}
.footer-logo{
  filter:drop-shadow(0 6px 18px rgba(0,0,0,.3));
}

/* Legal pages */
.legal{color:#edf7fa}
.legal p,.legal li{color:#abc0cb}
.legal a{color:#65e3dd}

/* Scout app dark treatment */
.app-body{background:#061724!important}
.app-header{
  background:#071b2b!important;
  border-bottom-color:#1d4054!important;
}
.app-panel,.prospect-card{
  background:#0a2032!important;
  border-color:#1d4054!important;
  color:#edf7fa!important;
}
input,select,textarea{
  background:#071a29!important;
  color:#eaf8fb!important;
  border-color:#275267!important;
}
.tag{background:#103742!important;color:#5ee5dc!important}
.import-box,details{border-color:#1d4054!important}
.score-bubble{background:linear-gradient(135deg,#0b3848,#0e5870)!important}
.copy-btn,.delete-btn{
  background:#0a2435!important;
  border-color:#275267!important;
  color:#dff5f8!important;
}
.open-site{color:#62e1db!important}

@media(max-width:1000px){
  .nav.open{
    background:#071b2b;
    border-bottom-color:#1d4054;
  }
}


/* Final approved transparent logo for site */
.logo-link{display:block;line-height:0}
.site-logo{
  display:block !important;
  height:110px !important;
  width:auto !important;
  max-width:min(700px,70vw) !important;
  object-fit:contain !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  filter:none !important;
}
.footer-logo{
  display:block !important;
  width:min(520px,100%) !important;
  height:auto !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  filter:none !important;
}
@media(max-width:900px){
  .site-logo{height:82px !important; max-width:80vw !important;}
}
@media(max-width:650px){
  .site-logo{height:66px !important; max-width:88vw !important;}
  .footer-logo{width:min(360px,100%) !important;}
}


/* Avery live section */
.avery-live-section{
  background:
    radial-gradient(circle at 82% 18%,rgba(24,201,193,.10),transparent 26%),
    linear-gradient(180deg,#071a29,#081c2b);
}
.avery-heading-block{max-width:980px}
.avery-live-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:28px;
  align-items:start;
}
.avery-promo-card,
.avery-live-widget{
  background:linear-gradient(180deg,#0b2437,#091d2d);
  border:1px solid #1d4054;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 18px 60px rgba(0,0,0,.28);
}
.avery-promo-card img{
  display:block;
  width:100%;
  height:auto;
}
.avery-live-widget{
  padding:24px;
}
.avery-widget-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:12px;
}
.avery-widget-top h3{
  margin:0;
  font-size:32px;
}
.status-pill{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid #295a5e;
  background:#0a2435;
  color:#dff9f7;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  white-space:nowrap;
}
.status-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#18d06f;
  box-shadow:0 0 0 6px rgba(24,208,111,.12);
}
.avery-live-copy{
  color:#9fb4c2;
  margin:0 0 18px;
  font-size:16px;
}
.avery-shell.live{
  margin-top:8px;
}
.avery-suggested-prompts{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:16px;
}
.prompt-chip{
  appearance:none;
  border:1px solid #2a596d;
  background:#0a2236;
  color:#e9f7fb;
  border-radius:999px;
  padding:12px 16px;
  font-weight:700;
  cursor:pointer;
}
.prompt-chip:hover{
  border-color:#45c9c4;
}
@media(max-width:1100px){
  .avery-live-grid{
    grid-template-columns:1fr;
  }
}


/* Avery section refinement: bigger widget, portrait-only card */
.avery-live-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:28px;
  align-items:stretch;
}
.avery-profile-card,
.avery-live-widget{
  background:linear-gradient(180deg,#0b2437,#091d2d);
  border:1px solid #1d4054;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 18px 60px rgba(0,0,0,.28);
}
.avery-profile-card{
  display:flex;
  flex-direction:column;
}
.avery-portrait-wrap{
  position:relative;
  background:radial-gradient(circle at 20% 15%,rgba(34,184,240,.12),transparent 30%), #081b2b;
}
.avery-portrait-wrap img{
  display:block;
  width:100%;
  height:auto;
}
.avery-profile-copy{
  padding:24px 24px 26px;
}
.avery-profile-copy h3{
  font-size:58px;
  line-height:1;
  margin:0 0 8px;
}
.avery-role{
  letter-spacing:.18em;
  font-size:13px;
  font-weight:800;
  color:#dbe8ef;
  margin-bottom:18px;
}
.avery-profile-copy p{
  color:#9fb4c2;
  font-size:18px;
  margin:0 0 18px;
}
.avery-benefits{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.benefit-pill{
  border:1px solid #23546a;
  background:#0b2233;
  border-radius:18px;
  padding:14px 16px;
}
.benefit-pill strong{
  display:block;
  color:#f2fbff;
  margin-bottom:3px;
  font-size:18px;
}
.benefit-pill span{
  color:#8fb7c7;
  font-size:14px;
}
.avery-live-widget{
  padding:28px;
  display:flex;
  flex-direction:column;
}
.avery-widget-top h3{
  margin:0;
  font-size:40px;
}
.avery-live-copy{
  color:#9fb4c2;
  margin:4px 0 18px;
  font-size:18px;
}
.avery-shell.live.bigger{
  flex:1 1 auto;
  min-height:780px;
  padding:24px;
}
.avery-shell.live.bigger elevenlabs-convai{
  display:block;
  min-height:590px;
}
.avery-suggested-prompts{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}
.prompt-chip{
  appearance:none;
  border:1px solid #2a596d;
  background:#0a2236;
  color:#e9f7fb;
  border-radius:999px;
  padding:12px 16px;
  font-weight:700;
  cursor:pointer;
}
.prompt-chip:hover{
  border-color:#45c9c4;
}
@media(max-width:1200px){
  .avery-live-grid{
    grid-template-columns:1fr;
  }
  .avery-shell.live.bigger{
    min-height:680px;
  }
}
@media(max-width:700px){
  .avery-profile-copy h3{
    font-size:44px;
  }
  .avery-widget-top h3{
    font-size:32px;
  }
  .avery-shell.live.bigger{
    min-height:620px;
    padding:18px;
  }
  .avery-shell.live.bigger elevenlabs-convai{
    min-height:520px;
  }
}


/* Business-focused Avery refinement */
.avery-portrait-wrap{
  background:
    radial-gradient(circle at 18% 18%, rgba(34,184,240,.10), transparent 26%),
    linear-gradient(180deg,#071b2b,#081a28) !important;
}
.avery-profile-card{
  box-shadow:0 20px 65px rgba(0,0,0,.30);
}
.avery-profile-copy h3{
  letter-spacing:-.03em;
}
.avery-role{
  color:#62e1db;
}
.benefit-pill{
  background:#0a2131;
}