:root { --paper:#f3efe3; --paper-deep:#e8e1d1; --ink:#123d32; --soft:#41645a; --faint:#6c857d; --line:rgba(18,61,50,.2); --line-strong:rgba(18,61,50,.45); --lime:#c8ee55; --blue:#3763e7; --white:#fffdf7; --rust:#ba4f32; --serif:"Cormorant Garamond",Georgia,serif; --sans:"Manrope",sans-serif; --page:min(1320px,calc(100% - 64px)); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); line-height:1.55; }
a { color:inherit; }
button,input { font:inherit; }
:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
.skip-link { position:fixed; top:-80px; left:20px; z-index:20; padding:10px 14px; background:var(--ink); color:var(--white); }
.skip-link:focus { top:20px; }
.site-header { width:var(--page); min-height:82px; margin:auto; display:grid; grid-template-columns:1fr auto 1fr; gap:24px; align-items:center; border-bottom:1px solid var(--line-strong); }
.site-header > p { margin:0; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.back-link { font-size:10px; font-weight:800; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }
.budget-control { justify-self:end; display:grid; grid-template-columns:auto 120px auto; gap:10px; align-items:center; }
.budget-control label { font-size:9px; font-weight:800; text-transform:uppercase; }
.budget-control input { accent-color:var(--blue); }
.budget-control output { min-width:84px; font:700 18px/1 var(--serif); }
.campaign-switcher { width:var(--page); margin:26px auto 0; display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line-strong); }
.campaign-switcher a { padding:13px 16px; border-right:1px solid var(--line-strong); font-size:10px; font-weight:800; text-decoration:none; text-transform:uppercase; }
.campaign-switcher a:last-child { border-right:0; }
.campaign-switcher a span { margin-right:8px; color:var(--faint); }
.campaign-switcher a[aria-current="page"] { background:var(--ink); color:var(--paper); }
.campaign-switcher a[aria-current="page"] span { color:var(--lime); }
main { width:var(--page); margin:auto; }
.campaign-hero { min-height:500px; padding:85px 0 70px; display:grid; grid-template-columns:1.3fr .55fr; gap:8vw; align-items:end; border-bottom:1px solid var(--line-strong); }
.campaign-kicker { margin:0 0 26px; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.campaign-hero h1 { margin:0; font:700 clamp(76px,10vw,145px)/.75 var(--serif); letter-spacing:-.055em; }
.campaign-thesis { max-width:760px; margin:38px 0 0; color:var(--soft); font-size:19px; }
.campaign-hero aside { padding:26px; background:var(--blue); color:white; box-shadow:14px 14px 0 var(--lime); }
.campaign-hero aside span,.campaign-hero aside small { display:block; font-size:9px; font-weight:800; text-transform:uppercase; }
.campaign-hero aside strong { display:block; margin:22px 0 8px; font:700 clamp(36px,4vw,58px)/.9 var(--serif); }
.campaign-hero aside small { color:rgba(255,255,255,.72); }
.detail-section { padding:82px 0; border-bottom:1px solid var(--line-strong); }
.section-heading { display:grid; grid-template-columns:70px 1fr; gap:20px; margin-bottom:42px; }
.section-heading > span { color:var(--blue); font:700 42px/1 var(--serif); }
.section-heading p { margin:0 0 4px; font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.section-heading h2 { margin:0; font:700 clamp(38px,4vw,62px)/.9 var(--serif); }
.config-grid { margin:0; display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--ink); }
.config-row { min-height:88px; padding:18px 0; display:grid; grid-template-columns:150px 1fr; gap:20px; border-bottom:1px solid var(--line); }
.config-row:nth-child(odd) { padding-right:26px; border-right:1px solid var(--line); }
.config-row:nth-child(even) { padding-left:26px; }
.config-row dt { color:var(--faint); font-size:9px; font-weight:800; text-transform:uppercase; }
.config-row dd { margin:0; font-size:12px; font-weight:700; }
.config-code dd { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; overflow-wrap:anywhere; }
.adset-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.adset-card { min-height:260px; padding:24px; display:flex; flex-direction:column; border:1px solid var(--line-strong); background:rgba(255,253,247,.45); }
.adset-card > span { font-size:9px; font-weight:800; text-transform:uppercase; }
.adset-card h3 { margin:30px 0 0; font:700 30px/1 var(--serif); overflow-wrap:anywhere; }
.adset-card strong { margin-top:auto; font:700 28px/1 var(--serif); }
.adset-card p { margin:16px 0 0; padding-top:14px; border-top:1px solid var(--line); color:var(--soft); font-size:11px; }
.week-selector-panel { margin:42px 0 0; padding:34px; display:grid; grid-template-columns:minmax(260px,.7fr) 1.3fr; gap:42px; border:1px solid var(--line-strong); background:rgba(255,253,247,.45); }
.week-selector-panel.week-gate { margin-bottom:80px; border:2px solid var(--blue); box-shadow:12px 12px 0 var(--lime); }
.week-selector-copy > span,.copy-policy span { display:block; margin-bottom:9px; color:var(--blue); font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.week-selector-copy h2 { margin:0; font:700 clamp(38px,4vw,58px)/.9 var(--serif); }
.week-selector-copy p { max-width:490px; margin:18px 0 0; color:var(--soft); font-size:12px; }
.week-selector { display:grid; grid-template-columns:repeat(6,1fr); align-content:start; border-top:1px solid var(--line-strong); border-left:1px solid var(--line-strong); }
.week-option { min-height:78px; padding:12px; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; border:0; border-right:1px solid var(--line-strong); border-bottom:1px solid var(--line-strong); background:transparent; color:var(--ink); cursor:pointer; }
.week-option:hover { background:var(--paper-deep); }
.week-option[aria-pressed="true"] { background:var(--blue); color:white; }
.week-option span { font-size:8px; font-weight:800; text-transform:uppercase; }
.week-option strong { font:700 26px/1 var(--serif); }
.copy-policy { margin-bottom:28px; padding:24px; display:grid; grid-template-columns:220px 1fr; gap:30px; align-items:center; border-left:7px solid var(--lime); background:var(--ink); color:var(--white); }
.copy-policy h3 { margin:0; font:700 36px/1 var(--serif); }
.copy-policy p { margin:0; color:rgba(255,255,255,.75); font-size:12px; }
.lab-adset-grid { display:grid; gap:18px; }
.lab-adset { border:1px solid var(--line-strong); background:rgba(255,253,247,.45); }
.lab-adset > header { padding:22px 24px; display:flex; align-items:end; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line-strong); background:var(--paper-deep); }
.lab-adset > header > div:last-child { text-align:right; }
.lab-adset > header span,.lab-adset > header small { display:block; font-size:8px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.lab-adset > header h3 { margin:7px 0 0; font:700 32px/1 var(--serif); }
.lab-adset > header strong { display:block; font:700 28px/1 var(--serif); }
.lab-creative-list { display:grid; grid-template-columns:repeat(2,1fr); }
.lab-creative { min-width:0; padding:18px; display:grid; grid-template-columns:128px 1fr; gap:18px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.lab-creative:nth-child(even) { border-right:0; }
.lab-creative-media { position:relative; min-height:168px; background:var(--paper-deep); overflow:hidden; }
.lab-creative-media img { width:100%; height:100%; display:block; object-fit:cover; }
.lab-creative-media span { position:absolute; left:7px; bottom:7px; padding:4px 6px; background:var(--ink); color:white; font-size:7px; font-weight:800; text-transform:uppercase; }
.lab-creative-body { min-width:0; }
.lab-creative-body > header { display:flex; justify-content:space-between; gap:12px; }
.lab-creative-body header span { font-size:9px; font-weight:800; }
.lab-creative-body h4 { margin:5px 0 0; font:700 23px/1 var(--serif); }
.lab-creative-body em { height:max-content; padding:5px 7px; border:1px solid var(--ink); font-size:7px; font-style:normal; font-weight:800; text-transform:uppercase; white-space:nowrap; }
.lab-creative-body em[data-copy-mode="media-only"] { background:var(--lime); }
.lab-hook { margin:14px 0; color:var(--soft); font-size:10px; }
.lab-hook strong { display:block; color:var(--faint); font-size:7px; letter-spacing:.08em; text-transform:uppercase; }
.creative-ad-fields { margin:0; display:grid; gap:5px; }
.creative-ad-fields > div { display:grid; grid-template-columns:96px 1fr; gap:8px; }
.creative-ad-fields dt { color:var(--faint); font-size:7px; font-weight:800; text-transform:uppercase; }
.creative-ad-fields dd { margin:0; font-size:9px; font-weight:700; overflow-wrap:anywhere; }
.creative-ad-fields .blank-value { color:var(--rust); }
.lab-creative-footer { margin-top:14px; padding-top:10px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; border-top:1px solid var(--line); }
.lab-creative-footer a { font-size:8px; font-weight:800; text-decoration-thickness:1px; text-underline-offset:3px; }
.lab-creative-footer code { color:var(--faint); font-size:7px; overflow-wrap:anywhere; }
.split-section { display:grid; grid-template-columns:1fr 1fr; gap:6vw; }
.assignment-note { color:var(--soft); }
.assignment-list { display:flex; flex-wrap:wrap; gap:8px; }
.assignment-list span { padding:8px 11px; border:1px solid var(--ink); font-size:9px; font-weight:800; }
.decision-section ol { margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); list-style:none; counter-reset:rule; border:1px solid var(--line-strong); }
.decision-section li { min-height:170px; padding:24px; border-right:1px solid var(--line-strong); counter-increment:rule; font:600 18px/1.45 var(--serif); }
.decision-section li:last-child { border-right:0; }
.decision-section li::before { content:"0" counter(rule); display:block; margin-bottom:35px; color:var(--blue); font:800 10px/1 var(--sans); }
.checklist-section ul { margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); list-style:none; border-top:1px solid var(--ink); }
.checklist-section li { padding:18px 20px 18px 34px; border-bottom:1px solid var(--line); position:relative; font-size:11px; }
.checklist-section li::before { content:"□"; position:absolute; left:5px; font-size:17px; }
.confirm-note { margin:36px 0 0; padding:20px; border-left:5px solid var(--lime); background:var(--paper-deep); color:var(--soft); font-size:11px; }
.not-found,.loading { min-height:60vh; display:grid; align-content:center; justify-items:start; }
.not-found h1 { margin:0 0 24px; font:700 clamp(54px,7vw,100px)/.85 var(--serif); }
footer { width:var(--page); min-height:120px; margin:auto; display:flex; justify-content:space-between; align-items:center; gap:30px; color:var(--faint); font-size:9px; text-transform:uppercase; }
footer p { margin:0; }
@media (max-width:1050px) { .lab-creative { grid-template-columns:105px 1fr; } .creative-ad-fields > div { grid-template-columns:80px 1fr; } }
@media (max-width:900px) { .site-header { grid-template-columns:1fr 1fr; padding:14px 0; } .site-header > p { display:none; } .campaign-switcher { grid-template-columns:1fr 1fr; } .campaign-switcher a:nth-child(2) { border-right:0; } .campaign-switcher a:nth-child(-n+2) { border-bottom:1px solid var(--line-strong); } .campaign-hero { grid-template-columns:1fr; min-height:0; } .campaign-hero aside { max-width:420px; } .split-section { grid-template-columns:1fr; } .adset-grid { grid-template-columns:1fr; } .week-selector-panel { grid-template-columns:1fr; } .lab-creative-list { grid-template-columns:1fr; } .lab-creative { border-right:0; } }
@media (max-width:620px) { :root { --page:calc(100% - 30px); } .site-header { grid-template-columns:1fr; gap:10px; } .budget-control { justify-self:start; grid-template-columns:auto 1fr auto; width:100%; } .campaign-switcher { margin-top:14px; } .campaign-switcher a { padding:11px 9px; font-size:8px; } .campaign-hero { padding:60px 0; } .campaign-hero h1 { font-size:62px; } .detail-section { padding:62px 0; } .section-heading { grid-template-columns:48px 1fr; } .config-grid { grid-template-columns:1fr; } .config-row,.config-row:nth-child(odd),.config-row:nth-child(even) { padding:16px 0; border-right:0; grid-template-columns:105px 1fr; } .decision-section ol,.checklist-section ul { grid-template-columns:1fr; } .decision-section li { border-right:0; border-bottom:1px solid var(--line-strong); } .week-selector-panel { padding:22px; } .week-selector { grid-template-columns:repeat(4,1fr); } .copy-policy { grid-template-columns:1fr; } .lab-adset > header { align-items:flex-start; flex-direction:column; } .lab-adset > header > div:last-child { text-align:left; } .lab-creative { grid-template-columns:88px 1fr; padding:13px; gap:12px; } .creative-ad-fields > div { grid-template-columns:1fr; gap:1px; } .lab-creative-body > header { flex-direction:column; } .lab-creative-body em { align-self:flex-start; } footer { align-items:flex-start; flex-direction:column; justify-content:center; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; } }