/* =========================================================================
   Interesting People Advertising and Marketing Agency, Inc.
   Design system — "Orbit" visual identity
   ========================================================================= */

:root{
  /* ---- Color tokens ---- */
  --violet-900:#22124F;
  --violet-800:#2E1A78;
  --violet-700:#3E24A3;
  --violet-600:#5B3DF5;   /* primary */
  --violet-500:#7A5CF0;
  --violet-200:#DED4FB;
  --violet-100:#EFEAFD;   /* soft lavender */
  --violet-50:#F8F6FE;
  --glow:#B9A6FF;         /* radiant purple glow */
  --ink:#160F2E;          /* near-black text, warm violet cast */
  --ink-soft:#4A4468;     /* muted body text */
  --line:#E4DEF7;
  --white:#FFFFFF;
  --lime:#9FE04E;
  --gold:#FFC93C;
  --success:#2FAE6B;

  /* ---- Type ---- */
  --font-display:'Fraunces', 'Iowan Old Style', Georgia, serif;
  --font-body:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', 'SF Mono', monospace;

  /* ---- Layout ---- */
  --max:1240px;
  --radius-sm:12px;
  --radius:20px;
  --radius-lg:28px;
  --shadow-sm:0 2px 10px rgba(34,18,79,0.06);
  --shadow:0 12px 40px -12px rgba(34,18,79,0.18);
  --shadow-lg:0 24px 70px -20px rgba(34,18,79,0.28);
}

*,*::before,*::after{box-sizing:border-box;}

/* Defensive: prevent browser writing-assistant extensions (Grammarly etc.)
   from drawing overlay underlines/squiggles across the page UI */
grammarly-extension,
grammarly-desktop-integration,
grammarly-popups,
grammarly-mirror,
[data-grammarly-part],
deepl-inline-translate,
lt-toolbar,
lt-highlighter{display:none !important;visibility:hidden !important;pointer-events:none !important;}

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

body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
button{font-family:inherit;}

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.12;
  margin:0 0 0.5em;
  letter-spacing:-0.01em;
  color:var(--ink);
}
h1{font-size:clamp(2.4rem,5vw,4.2rem); font-weight:500;}
h2{font-size:clamp(1.9rem,3.6vw,2.9rem);}
h3{font-size:clamp(1.3rem,2vw,1.6rem);}
p{margin:0 0 1em;color:var(--ink-soft);}

.container{max-width:var(--max);margin:0 auto;padding:0 28px;}
.container-narrow{max-width:820px;margin:0 auto;padding:0 28px;}

.section{padding:96px 0;}
.section-tight{padding:64px 0;}
@media (max-width:768px){
  .section{padding:64px 0;}
  .section-tight{padding:44px 0;}
}

.bg-white{background:var(--white);}
.bg-lavender{background:linear-gradient(180deg,var(--violet-50),var(--violet-100) 60%,var(--violet-50));}
.bg-deep{
  background:
    radial-gradient(60% 80% at 20% 0%, rgba(185,166,255,0.35), transparent 60%),
    radial-gradient(50% 60% at 100% 100%, rgba(159,224,78,0.12), transparent 60%),
    linear-gradient(160deg,var(--violet-900),var(--violet-700) 65%,var(--violet-600));
  color:var(--white);
}
.bg-deep h2,.bg-deep h3,.bg-deep h4{color:var(--white);}
.bg-deep p{color:rgba(255,255,255,0.78);}

.eyebrow{
  font-family:var(--font-mono);
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--violet-600);
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:600;
  margin-bottom:18px;
}
.bg-deep .eyebrow{color:var(--lime);}
.eyebrow::before{
  content:"";
  width:18px;height:1px;
  background:currentColor;
  display:inline-block;
}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:15px 28px;
  border-radius:100px;
  font-weight:600;
  font-size:0.98rem;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
  white-space:nowrap;
}
.btn-primary{
  background:linear-gradient(100deg,var(--lime),var(--gold));
  color:var(--violet-900);
  box-shadow:0 10px 30px -10px rgba(255,201,60,0.55);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px -10px rgba(255,201,60,0.7);}
.btn-secondary{
  background:transparent;
  border-color:rgba(22,15,46,0.18);
  color:var(--ink);
}
.btn-secondary:hover{border-color:var(--violet-600);color:var(--violet-600);transform:translateY(-2px);}
.bg-deep .btn-secondary{border-color:rgba(255,255,255,0.3);color:var(--white);}
.bg-deep .btn-secondary:hover{border-color:var(--lime);color:var(--lime);}
.btn-sm{padding:11px 20px;font-size:0.88rem;}
.btn-block{width:100%;}

/* ---- Nav ---- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,0.82);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 0;
}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:1.18rem;font-weight:600;color:var(--ink);white-space:nowrap;}
.brand svg{width:34px;height:34px;flex-shrink:0;}
.nav-links{display:flex;align-items:center;gap:2px;}
.nav-links > li > a{
  display:inline-flex;align-items:center;white-space:nowrap;
  padding:10px 14px;border-radius:100px;font-size:0.95rem;font-weight:500;color:var(--ink-soft);
  transition:background 0.2s ease,color 0.2s ease;
}
.nav-links > li > a:hover,.nav-links > li > a.active{background:var(--violet-100);color:var(--violet-700);}
.nav-cta{display:flex;align-items:center;gap:10px;}
.nav-mobile-cta{display:none;}
.nav-toggle{display:none;background:none;border:1px solid var(--line);border-radius:10px;padding:8px 10px;}
.nav-toggle svg{width:20px;height:20px;}

.has-mega{position:relative;}
.mega{
  position:absolute;top:100%;left:50%;transform:translateX(-50%);
  width:min(880px,92vw);
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-lg);
  padding:26px;
  display:none;
  grid-template-columns:repeat(3,1fr);
  gap:6px 22px;
  margin-top:10px;
}
.has-mega:hover .mega,.has-mega:focus-within .mega{display:grid;}
.mega a{
  display:block;padding:9px 10px;border-radius:10px;font-size:0.88rem;color:var(--ink-soft);
}
.mega a:hover{background:var(--violet-50);color:var(--violet-700);}
.mega-col-title{font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--violet-600);padding:9px 10px 2px;font-weight:600;}

@media (max-width:1259px){
  .nav-links{
    position:fixed;inset:64px 16px auto 16px;
    background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
    box-shadow:var(--shadow-lg);
    flex-direction:column;align-items:stretch;padding:14px;
    display:none;
    max-height:80vh;overflow:auto;
  }
  .nav-links.open{display:flex;}
  .nav-links > li{width:100%;}
  .mega{position:static;transform:none;width:auto;box-shadow:none;border:none;padding:6px 0 6px 14px;margin:0;grid-template-columns:1fr;display:none;}
  .has-mega.open .mega{display:grid;}
  .nav-toggle{display:inline-flex;}
  .nav-cta .btn-secondary{display:none;}
  .nav-cta .btn-primary{display:none;}
  .nav-mobile-cta{display:block;margin-top:8px;}
}

/* ---- Hero ---- */
.hero{position:relative;overflow:hidden;padding:88px 0 70px;}
.hero-bg{
  position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(48% 60% at 82% 8%, rgba(185,166,255,0.55), transparent 60%),
    radial-gradient(40% 50% at 8% 90%, rgba(159,224,78,0.18), transparent 60%),
    var(--violet-50);
}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr 0.9fr;gap:56px;align-items:center;}
@media (max-width:960px){.hero-grid{grid-template-columns:1fr;}}
.hero-copy p.lede{font-size:1.15rem;max-width:520px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;}
.trust-strip{margin-top:56px;padding-top:26px;border-top:1px solid var(--line);}
.trust-strip .label{font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:16px;}
.trust-row{display:flex;flex-wrap:wrap;gap:34px;align-items:center;opacity:0.65;}
.trust-row svg{height:22px;width:auto;}

.hero-orbit{position:relative;height:420px;}

/* ---- Cards ---- */
.grid{display:grid;gap:22px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

.card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:30px;
  box-shadow:var(--shadow-sm);
  transition:transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--violet-200);}
.card-icon{
  width:48px;height:48px;border-radius:14px;
  background:var(--violet-100);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:18px;color:var(--violet-600);
}
.card-icon svg{width:24px;height:24px;}
.card h3{margin-bottom:8px;font-size:1.15rem;}
.card p{margin-bottom:0;font-size:0.95rem;}
.card a.card-link{font-size:0.88rem;font-weight:600;color:var(--violet-600);display:inline-flex;align-items:center;gap:6px;margin-top:14px;}

.glass{
  background:rgba(255,255,255,0.65);
  backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,0.5);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.bg-deep .glass,.bg-deep .card{
  background:rgba(255,255,255,0.07);
  border-color:rgba(255,255,255,0.14);
  backdrop-filter:blur(18px);
}
.bg-deep .card p{color:rgba(255,255,255,0.72);}
.bg-deep .card-icon{background:rgba(255,255,255,0.12);color:var(--lime);}

/* ---- Stats / dashboard ---- */
.stat-value{font-family:var(--font-mono);font-size:2.2rem;font-weight:600;color:var(--white);}
.stat-label{font-size:0.85rem;color:rgba(255,255,255,0.7);}
.dash-card{padding:26px;}
.dash-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;}
.dash-head .dash-title{font-size:0.82rem;font-weight:600;color:rgba(255,255,255,0.85);}
.dash-head .dash-delta{font-family:var(--font-mono);font-size:0.78rem;color:var(--lime);background:rgba(159,224,78,0.14);padding:4px 10px;border-radius:100px;}
.dash-big{font-family:var(--font-mono);font-size:1.9rem;color:var(--white);margin-bottom:14px;}

/* ---- Section heading block ---- */
.head-block{max-width:640px;margin-bottom:52px;}
.head-block.center{margin-left:auto;margin-right:auto;text-align:center;}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:52px;}
.head-row .head-block{margin-bottom:0;}
@media (max-width:768px){.head-row{flex-direction:column;align-items:flex-start;}}

/* ---- Process / timeline ---- */
.process-row{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;}
@media (max-width:900px){.process-row{grid-template-columns:1fr;}}
.process-step{padding:0 22px 0 0;position:relative;}
.process-step .num{font-family:var(--font-mono);font-size:0.85rem;color:var(--lime);}
.process-step h3{margin:14px 0 8px;font-size:1.1rem;}
.process-connector{
  position:absolute;top:10px;left:0;right:0;height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.28) 10%, rgba(255,255,255,0.28) 90%, transparent);
  z-index:0;
}

/* ---- Testimonial ---- */
.quote-card{padding:34px;}
.quote-card p{font-size:1.08rem;color:var(--ink);font-family:var(--font-display);font-weight:500;line-height:1.5;}
.quote-attr{display:flex;align-items:center;gap:12px;margin-top:20px;}
.quote-avatar{width:42px;height:42px;border-radius:50%;background:var(--violet-100);display:flex;align-items:center;justify-content:center;font-weight:600;color:var(--violet-600);font-family:var(--font-mono);font-size:0.85rem;}
.quote-name{font-weight:600;font-size:0.92rem;}
.quote-role{font-size:0.82rem;color:var(--ink-soft);}

/* ---- FAQ accordion ---- */
.faq-item{border-bottom:1px solid var(--line);padding:22px 0;}
.faq-q{display:flex;justify-content:space-between;align-items:center;cursor:pointer;gap:20px;font-weight:600;font-size:1.02rem;}
.faq-q .chev{transition:transform 0.25s ease;flex-shrink:0;color:var(--violet-600);}
.faq-item.open .chev{transform:rotate(180deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height 0.3s ease;}
.faq-item.open .faq-a{max-height:600px;}
.faq-a p{padding-top:12px;margin-bottom:0;}

/* ---- Forms ---- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media (max-width:640px){.form-grid{grid-template-columns:1fr;}}
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px;}
.field label{font-size:0.86rem;font-weight:600;}
.field input,.field select,.field textarea{
  padding:13px 15px;border:1px solid var(--line);border-radius:12px;font-family:inherit;font-size:0.96rem;background:var(--white);color:var(--ink);
}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--violet-600);outline-offset:1px;border-color:var(--violet-600);}
.field-full{grid-column:1/-1;}
.form-note{font-size:0.82rem;color:var(--ink-soft);}

/* ---- Footer ---- */
.site-footer{background:var(--violet-900);color:rgba(255,255,255,0.75);padding:72px 0 30px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.1fr;gap:30px;margin-bottom:56px;}
@media (max-width:960px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.footer-grid{grid-template-columns:1fr;}}
.site-footer h4{color:var(--white);font-family:var(--font-mono);font-size:0.76rem;letter-spacing:0.08em;text-transform:uppercase;font-weight:600;margin-bottom:16px;}
.site-footer .brand{color:var(--white);margin-bottom:14px;}
.site-footer li{margin-bottom:10px;}
.site-footer a{font-size:0.92rem;color:rgba(255,255,255,0.68);}
.site-footer a:hover{color:var(--lime);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;padding-top:26px;border-top:1px solid rgba(255,255,255,0.12);font-size:0.85rem;}
.social-row{display:flex;gap:12px;}
.social-row a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;}
.social-row svg{width:16px;height:16px;}
.newsletter-row{display:flex;gap:10px;max-width:360px;}
.newsletter-row input{flex:1;padding:12px 14px;border-radius:100px;border:1px solid rgba(255,255,255,0.2);background:rgba(255,255,255,0.06);color:var(--white);}
.newsletter-row input::placeholder{color:rgba(255,255,255,0.5);}

/* ---- Breadcrumb / page header ---- */
.page-header{padding:52px 0 20px;background:var(--violet-50);}
.breadcrumb{display:flex;gap:8px;font-size:0.85rem;color:var(--ink-soft);align-items:center;flex-wrap:wrap;}
.breadcrumb a:hover{color:var(--violet-600);}

/* ---- Pricing ---- */
.price-card{padding:34px;position:relative;}
.price-card.featured{border-color:var(--violet-600);box-shadow:var(--shadow);}
.price-tag{position:absolute;top:-13px;right:28px;background:linear-gradient(100deg,var(--lime),var(--gold));color:var(--violet-900);font-size:0.72rem;font-weight:700;padding:6px 14px;border-radius:100px;}
.price-amount{font-family:var(--font-mono);font-size:2.2rem;font-weight:600;margin:14px 0 4px;}
.price-list li{display:flex;gap:10px;align-items:flex-start;padding:8px 0;font-size:0.92rem;color:var(--ink-soft);}
.price-list svg{flex-shrink:0;margin-top:3px;color:var(--success);}

/* ---- Utility ---- */
.text-center{text-align:center;}
.mt-0{margin-top:0;}
.mb-0{margin-bottom:0;}
.tag{display:inline-block;font-size:0.76rem;font-weight:600;padding:5px 12px;border-radius:100px;background:var(--violet-100);color:var(--violet-700);}
.divider-orbit{display:flex;align-items:center;justify-content:center;padding:6px 0;}
.skip-link{position:absolute;left:-999px;top:auto;background:var(--violet-600);color:var(--white);padding:10px 16px;border-radius:8px;z-index:200;}
.skip-link:focus{left:16px;top:16px;}

/* ---- Reveal animation ---- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity 0.6s ease, transform 0.6s ease;}
.reveal.in{opacity:1;transform:translateY(0);}

/* ---- Counter ---- */
.counter{font-family:var(--font-mono);}

/* ---- 404 / thank you ---- */
.state-page{min-height:60vh;display:flex;align-items:center;}
.state-code{font-family:var(--font-mono);color:var(--violet-200);font-size:6rem;line-height:1;margin-bottom:10px;}

/* ---- Cookie banner ---- */
.cookie-banner{
  position:fixed;left:20px;right:20px;bottom:20px;z-index:300;
  max-width:640px;margin:0 auto;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);
  padding:22px 24px;display:none;gap:16px;align-items:center;flex-wrap:wrap;
}
.cookie-banner.show{display:flex;}
.cookie-banner p{font-size:0.86rem;margin:0;flex:1 1 260px;}
.cookie-actions{display:flex;gap:10px;}

/* ---- Table (pricing/plans compare, sitemap) ---- */
table{width:100%;border-collapse:collapse;}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);font-size:0.92rem;}
th{font-family:var(--font-mono);font-size:0.74rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--ink-soft);}
