/* VUGA Agency landing (agency.vugamediagroup.com) — B2B door on the Newsstand design system. Loaded after newsstand.css; storefront.js later appends accessibility.css, which rewrites --gold on :root, so the palette is re-pinned on here. */ body[data-door="agency"]{--gold:#b8860b;--goldlt:#d4a017;--goldtext:#7a5906;--gold-light:#d4a017} /* HERO: copy left, commitment card right */ .hero-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.6fr);gap:48px;align-items:end} .agency-hero h1{font-size:54px;max-width:none} .agency-hero .commitment{background:#1a1a1a;border:1px solid rgba(255,255,255,.14);border-top:3px solid var(--goldlt);border-radius:8px;padding:28px 26px;margin:0;box-shadow:0 24px 60px rgba(0,0,0,.35)} .agency-hero .commitment span{display:block;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--goldlt)} .agency-hero .commitment strong{display:block;font-family:var(--serif);font-size:40px;line-height:1.1;color:#fff;margin:10px 0 8px} .agency-hero .commitment p{color:rgba(233,228,216,.75);font-size:14.5px;margin:0} .agency-hero .commitment a{display:inline-block;margin-top:14px;color:var(--goldlt);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase} /* COVER WALL: the "more" control is a link here (no catalog modal on the agency door) */ .covers a.more{text-decoration:none} .covers a.more:hover{text-decoration:underline} /* BUILT FOR AGENCIES */ .fit{padding:58px 0 10px} .fit h2{font-size:34px;margin:8px 0 10px;text-align:center} .fit .kicker{text-align:center} .fit .sub{text-align:center;color:var(--muted);max-width:640px;margin:0 auto 36px} .fit .step .ic{font-size:30px;line-height:1;color:var(--gold)} /* HOW: agency copy is a touch longer */ .how{padding-top:44px} /* APPROVAL CRITERIA */ .criteria{padding:58px 0 20px} .crit-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start} .criteria h2{font-size:32px;margin:8px 0 10px} .criteria .sub{color:var(--muted);font-size:16px} .crit-list{list-style:none;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:10px 26px} .crit-list li{padding:12px 0 12px 30px;position:relative;font-size:16px;border-bottom:1px dashed var(--line)} .crit-list li:last-child{border-bottom:0} .crit-list li::before{content:"✓";position:absolute;left:0;color:var(--red);font-weight:800} .crit-note{margin-top:16px;font-size:14.5px;color:var(--muted)} .crit-note a{color:var(--red);font-weight:700;text-decoration:none} .crit-note a:hover{text-decoration:underline} /* APPLY: application card + sign-in card */ .apply .acct-grid{align-items:start} .acct-card.signin{margin-top:28px;box-shadow:none;padding:28px} .acct-card.signin h3{font-size:20px} .acct-card input[type=url],.acct-card select{width:100%;padding:13px;border:1px solid var(--line);border-radius:2px;font-size:15px;font-family:inherit;background:#fff;color:var(--ink)} .acct-card input::placeholder{color:#9a9285} .btn.ghost-ink{background:transparent;color:var(--ink);border-color:var(--ink);width:100%} .btn.ghost-ink:hover{background:var(--ink);color:#fff;border-color:var(--ink);transform:none} .acct-card .status:empty{min-height:0;margin:0} .acct-card .status.coupon-ineligible{color:var(--red)} /* RTL */ html[dir="rtl"] .crit-list li{padding:12px 30px 12px 0} html[dir="rtl"] .crit-list li::before{left:auto;right:0} /* RESPONSIVE */ @media(max-width:900px){ .hero-grid,.crit-grid{grid-template-columns:1fr;gap:32px} .agency-hero h1{font-size:42px} .agency-hero .commitment{max-width:520px} .apply .acct-grid>div:first-child{order:2} .acct-card.signin{margin-top:8px} } @media(max-width:480px){ .agency-hero h1{font-size:34px} .agency-hero .commitment strong{font-size:32px} .fit h2,.criteria h2{font-size:28px} .crit-list{padding:6px 18px} } /* Client-first application brief (2026-09-22): mirrors the B2C start wizard tone. */ #agency-form fieldset { border: 0; margin: 0 0 8px; padding: 0; } #agency-form legend.serif { font-family: var(--serif, "Playfair Display", Georgia, serif); font-weight: 700; font-size: 1.15rem; color: var(--ink, #171310); padding: 0; margin-bottom: 10px; } #agency-form fieldset.client-brief { background: var(--paper-2, #faf6f0); border: 1px solid var(--line, #e7dfd2); border-radius: 12px; padding: 14px 14px 6px; margin-bottom: 16px; } #agency-form fieldset.client-brief label { margin-top: 10px; } #agency-form fieldset.client-brief input, #agency-form fieldset.client-brief select { margin-bottom: 4px; }