/* Ad Intelligence OS – subpages, footer, tablet navigation (5.15.0) */

/* accessibility */
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px}
.skip:focus{left:16px}

/* active nav item */
.links a[aria-current=page]{color:var(--blue);font-weight:600}
.mnav a[aria-current=page]{color:var(--blue);font-weight:600}

/* page hero */
.page-hero{padding:72px 0 40px;text-align:center;background:linear-gradient(180deg,var(--alt),var(--bg))}
.page-hero .pill{display:inline-block}
.page-hero h1{font-size:clamp(32px,4.6vw,52px);line-height:1.08;font-weight:800;letter-spacing:-.02em;margin:18px auto 16px;max-width:820px}
.page-hero .lead{margin:0 auto;max-width:680px}
.page-hero .cta{justify-content:center;margin-top:28px}
.page-top{padding-top:64px}
.h2{font-size:clamp(28px,3.4vw,40px);line-height:1.12;font-weight:800;letter-spacing:-.02em;margin:8px 0 12px}

/* helpers */
.center{text-align:center}
.muted{color:var(--muted)}
.sec .center.muted{margin:28px auto 0;max-width:760px;font-size:15px}
.small-note{font-size:14px;margin-top:18px}
.note{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:24px 26px}
.note p{color:var(--ink2);margin:0 0 12px}.note p:last-child{margin:0}
.big-who{justify-content:center;margin:0 auto 12px}

/* feature rows */
.feats{display:grid;gap:28px}
.feat{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding:36px 0;border-bottom:1px solid var(--line)}
.feat:last-child{border-bottom:0}
.feat.flip .feat-copy{order:2}
.feat-copy .ic{margin-bottom:14px}
.feat-copy .eyebrow{display:block;margin-bottom:6px}
.feat-copy h3{font-size:clamp(22px,2.4vw,28px);line-height:1.2;margin:0 0 12px}
.feat-copy p{color:var(--ink2);margin:0 0 16px}
.feat-art{display:flex;justify-content:center}
.art{width:100%;max-width:340px;aspect-ratio:4/3;border-radius:24px;display:grid;place-items:center;box-shadow:var(--shadow);border:1px solid var(--line);background:var(--alt);position:relative;overflow:hidden}
.art::before{content:"";position:absolute;inset:auto -20% -40% auto;width:70%;aspect-ratio:1;border-radius:50%;background:currentColor;opacity:.10}
.art span{font-size:64px;line-height:1}
.art.c1{color:var(--blue)}.art.c2{color:var(--green)}.art.c3{color:var(--yellow)}
.art.c4{color:var(--red)}.art.c5{color:var(--blue2)}.art.c6{color:var(--green)}

/* process flow */
.flow{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;counter-reset:f}
.flow li{position:relative;background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:18px 16px;counter-increment:f}
.flow li::before{content:counter(f);display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--blue);color:#fff;font-size:13px;font-weight:700;margin-bottom:10px}
.flow b{display:block;font-size:16px}
.flow span{display:block;color:var(--muted);font-size:14px;margin-top:4px}

/* "mehr" links on the home page */
.more{margin-top:36px}

/* plans */
.plans{align-items:stretch}

/* footer */
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
.foot-brand p{color:var(--muted);font-size:14px;margin:8px 0 0;max-width:320px}
.foot-grid nav{display:flex;flex-direction:column;gap:10px}
.foot-grid nav b{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:4px}
.foot-grid nav a{color:var(--ink2);font-size:14.5px}
.foot-grid nav a:hover{color:var(--blue)}

/* tablet: show the burger menu as soon as the desktop links are hidden */
@media (max-width:1024px){
  .burger{display:flex}
  .go{margin-left:auto;margin-right:12px}
  .feat{grid-template-columns:1fr 1fr;gap:32px}
  .flow{grid-template-columns:repeat(3,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr 1fr}
  .foot-brand{grid-column:1/-1}
}
@media (max-width:720px){
  .go{display:none}
  .page-hero{padding:48px 0 28px}
  .page-top{padding-top:40px}
  .feat,.feat.flip{grid-template-columns:1fr;gap:20px;padding:24px 0}
  .feat.flip .feat-copy{order:0}
  .feat-art{display:none}
  .flow{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:420px){
  .foot-grid{grid-template-columns:1fr}
}

/* billing toggle (5.16.0) */
.billing{display:flex;width:max-content;max-width:100%;margin:0 auto 36px;padding:4px;border:1px solid var(--line);border-radius:999px;background:var(--alt)}
.billing button{font:inherit;font-weight:600;font-size:15px;border:0;background:transparent;color:var(--ink2);padding:10px 20px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.billing button[aria-pressed=true]{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(60,64,67,.18)}
.billing button span{font-size:12px;font-weight:700;color:var(--green);background:#e6f4ea;border-radius:999px;padding:2px 8px}
.plan .price small{font-size:15px;font-weight:500;color:var(--muted)}
.plan .bill{color:var(--muted);font-size:13.5px;margin:-4px 0 14px}
@media (max-width:420px){.billing button{padding:9px 14px;font-size:14px}}