:root {
  --black: #0a0d0f;
  --deep: #0e1721;
  --surface: #141e2b;
  --panel: #18273a;
  --blue: #2b7fff;
  --blue2: #5ba4ff;
  --gold: var(--blue);
  --gold2: var(--blue2);
  --avp: #a78bfa;
  --mp4: #38bdf8;
  --border2: #2b7fff4d;
}

.hero { min-height: 520px; flex-direction: column; align-items: stretch; justify-content: center; background: linear-gradient(90deg, #050b10ed 0%, #06172ba6 45%, #06172b40 100%), linear-gradient(0deg, #080d1190, transparent 60%), url('assets/hire/hero.webp') center 45% / cover no-repeat; }
.hero.subscribe-hero { background-image: linear-gradient(90deg, #050b10ed 0%, #06172ba6 45%, #06172b40 100%), linear-gradient(0deg, #080d1190, transparent 60%), url('assets/subscribe/hero.webp'); }
.hero-tagline .accent { color: var(--blue2); }
.hero-sub { color: var(--muted); }
.cross-link { margin-top: 24px; color: var(--muted); font-size: 11px; }
.cross-link a { color: var(--blue2); text-decoration: none; }
.cross-link a:hover { text-decoration: underline; }
.social-strip { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 24px; }
.social-strip a { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; text-decoration: none; }
.social-strip a:hover { color: var(--blue2); }
.social-strip svg { width: 16px; height: 16px; fill: currentColor; }
.social-divider { width: 1px; height: 16px; background: var(--border); }
.reveal { opacity: 1; }
.tiers-section { background: linear-gradient(120deg, #080d13, var(--deep)); }
.tiers-intro { max-width: 620px; margin-bottom: 24px; }
.tiers-intro p { margin-top: 16px; color: var(--muted); }
.tiers-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 520px)); gap: 24px; }
.tier-card { position: relative; overflow: hidden; padding: 28px; border: 1px solid var(--border2); border-radius: 9px; background: var(--surface); }
.tier-card.featured { border-top: 3px solid var(--blue); }
.tier-num { margin-bottom: 16px; color: var(--dim); text-transform: uppercase; font-size: 10px; letter-spacing: .15em; }
.tier-price, .tier-name, .social-card-name { font-family: 'Barlow', sans-serif; font-weight: 700; line-height: 1.06; }
.tier-price { margin-bottom: 12px; }
.tier-price .amount { font-size: 48px; color: var(--white); }
.tier-price .per { margin-left: 6px; color: var(--muted); font-family: 'Manrope', sans-serif; font-size: 12px; font-weight: 400; }
.tier-name { margin-bottom: 20px; color: var(--blue2); font-size: 26px; text-transform: uppercase; }
.tier-divider { height: 1px; margin-bottom: 20px; background: var(--border); }
.format-label { margin-bottom: 8px; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.tier-perks { list-style: none; margin-bottom: 24px; }
.tier-perks li { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); color: var(--muted); font-size: 13px; }
.tier-perks li::before { content: '▸'; flex-shrink: 0; color: var(--blue2); }
.tier-btn { display: flex; justify-content: center; padding: 14px 24px; border: 1px solid var(--blue); border-radius: 100px; background: var(--blue); color: var(--white); font-size: 12px; font-weight: 700; text-align: center; text-decoration: none; transition: background .2s, transform .2s; }
.tier-btn:hover { background: var(--blue2); transform: translateY(-2px); }
.recent-videos-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.recent-videos-heading .work-link { flex-shrink: 0; }
.recent-videos-section .work-grid { row-gap: 24px; }
.recent-videos-scroll { max-height: var(--recent-videos-height, none); overflow-y: auto; scrollbar-gutter: stable; padding: 6px; }
.recent-videos-scroll:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }
.recent-videos-hint { margin-bottom: 12px; color: #555e67; font-size: 12px; }
.recent-videos-status { margin-bottom: 18px; color: #555e67; font-size: 12px; }
.recent-videos-status[hidden] { display: none; }
.recent-videos-placeholder { aspect-ratio: 16 / 9; border-radius: 7px; background: #e9edf1; }
.social-section { background: var(--black); }
.social-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.social-card { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 24px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); text-decoration: none; transition: background .2s, border-color .2s, transform .2s; }
.social-card:hover { border-color: var(--blue2); background: var(--panel); transform: translateY(-2px); }
.social-card-icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--border2); border-radius: 50%; }
.social-card-icon svg { width: 20px; height: 20px; fill: var(--blue2); }
.social-card-name { color: var(--white); font-size: 24px; text-transform: uppercase; }
.social-card-handle { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.social-card-arrow { margin-top: auto; color: var(--blue2); font-size: 11px; font-weight: 600; }
.faq-section { background: #f4f6f8; color: #17202a; text-align: center; }
.faq-section .section-label { color: #1a5fd4; }
.faq-section p { color: #58636d !important; }
.faq-section .btn-ghost { color: #17202a; border-color: #c9d1d8; }
.faq-section .btn-ghost:hover { background: #e9edf1; }
.contact-section { background: #edf1f4; color: #17202a; }
.contact-section .section-label { color: #1a5fd4; }
.contact-inner { display: grid; grid-template-columns: .85fr 1.15fr; gap: 75px; align-items: start; }
.contact-info { margin-top: 20px; }
.contact-info p { margin-bottom: 30px; color: #58636d; }
.contact-info a { color: #1a5fd4 !important; }
.contact-detail { margin: 16px 0; }
.contact-detail-label { display: block; margin-bottom: 4px; color: #65717b; font-size: 10px; text-transform: uppercase; letter-spacing: .15em; }
.contact-detail a { font-size: 13px; text-decoration: none; overflow-wrap: anywhere; }
.contact-detail a:hover { text-decoration: underline; }
.contact-form { display: flex; flex-direction: column; gap: 18px; }
.contact-form .form-group label { color: #17202a; }
.contact-form .form-group input, .contact-form .form-group textarea { color: #151b20; background: var(--white); }
.contact-form textarea { resize: vertical; }
.submit-btn { align-self: flex-start; border-color: var(--blue); background: var(--blue); color: var(--white); cursor: pointer; }
.submit-btn:hover { color: var(--white); }

@media (max-width: 1050px) {
  .social-card { padding: 20px; }
}
@media (max-width: 800px) {
  .hero { min-height: 520px; }
  .tiers-grid { grid-template-columns: minmax(0, 520px); }
  .social-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-inner { grid-template-columns: 1fr; gap: 35px; }
}
@media (max-width: 480px) {
  .hero { padding-bottom: 30px; }
  .hero-tagline br { display: revert; }
  .social-strip { gap: 14px; }
  .social-divider { display: none; }
  .social-cards { grid-template-columns: 1fr; }
  .tier-card { padding: 22px; }
}