/*
Theme Name: Media Performance Insights Preview Match
Theme URI: https://mediaperformanceinsights.com
Author: James A. Brown
Description: WordPress implementation of the approved Media Performance Insights preview.
Version: 2.6.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: mpi
*/

:root { --paper:#f4ecd8; --ink:#111; --mid:#514d43; --light:#6f6a5e; --rule:#d6cbab; --accent:#a42b00; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--paper); }
body { margin:0; color:var(--ink); background:var(--paper); font-family:'Libre Franklin',sans-serif; font-size:16px; line-height:1.55; }
.container { max-width:820px; margin:0 auto; padding:0 24px; }
.site-nav { padding:22px 0; border-bottom:1px solid var(--rule); }
.nav-inner { max-width:1080px; margin:0 auto; padding:0 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { color:var(--ink); font:700 20px/1.2 'Cormorant Garamond',serif; text-decoration:none; }
.nav-cta { color:var(--accent); text-decoration:none; border-bottom:1px solid var(--accent); padding-bottom:2px; font-size:12px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; }
.nav-actions { display:flex; align-items:center; gap:20px; }
.primary-links { display:flex; gap:16px; margin:0; padding:0; list-style:none; }
.primary-links a { color:var(--mid); font-size:13px; text-decoration:none; }
.hero { padding:90px 0 80px; border-bottom:1px solid var(--rule); }
.kicker { margin:0 0 16px; color:var(--light); font-size:13px; letter-spacing:2px; text-transform:uppercase; }
h1,h2,h3 { margin:0; font-family:'Cormorant Garamond',serif; font-weight:700; line-height:1.15; }
h1 { max-width:720px; margin-bottom:28px; font-size:clamp(42px,6vw,64px); letter-spacing:-.5px; }
h1 span { display:inline-block; animation:word-fade .7s ease both; }
h1 span:nth-child(1){animation-delay:.00s}h1 span:nth-child(2){animation-delay:.11s}h1 span:nth-child(3){animation-delay:.22s}h1 span:nth-child(4){animation-delay:.33s}h1 span:nth-child(5){animation-delay:.44s}h1 span:nth-child(6){animation-delay:.55s}h1 span:nth-child(7){animation-delay:.66s}h1 span:nth-child(8){animation-delay:.77s}h1 span:nth-child(9){animation-delay:.88s}h1 span:nth-child(10){animation-delay:.99s}h1 span:nth-child(11){animation-delay:1.10s}h1 span:nth-child(12){animation-delay:1.21s}
@keyframes word-fade { from { opacity:0; transform:translateY(.28em) } to { opacity:1; transform:translateY(0) } }
.deck { max-width:640px; margin:0; color:var(--mid); font-size:19px; font-weight:300; }
.button-row { display:flex; flex-wrap:wrap; gap:16px; margin-top:28px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 26px; border:2px solid var(--accent); color:var(--accent); background:transparent; text-decoration:none; font-size:13px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; }
.button.solid { color:var(--paper); background:var(--accent); }
section { padding:80px 0; border-bottom:1px solid var(--rule); }
h2 { margin-bottom:18px; font-size:36px; } h3 { margin-bottom:12px; font-size:27px; }
section p { max-width:660px; margin:0 0 20px; color:var(--mid); }
.service-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.service-card { padding:34px 30px; border:1px solid var(--rule); }
.service-card p { font-size:15px; }
.service-card .button { margin-top:4px; }
ul { max-width:620px; margin:8px 0 0; padding:0; list-style:none; }
li { position:relative; padding:8px 0 8px 26px; color:var(--mid); border-bottom:1px solid var(--rule); }
li::before { content:""; position:absolute; left:0; top:18px; width:12px; height:2px; background:var(--accent); }
.callout { max-width:660px; margin-top:34px; padding:30px 32px; border:1px solid var(--rule); background:rgba(233,222,195,.36); }
.callout .button { margin-top:8px; }
.final { border-bottom:0; }
footer { padding:32px 0; border-top:1px solid var(--rule); color:var(--light); font-size:13px; }
@media (max-width:700px) { .service-grid { grid-template-columns:1fr; } }
@media (max-width:520px) { .container,.nav-inner { padding:0 20px; } .site-nav { padding:18px 0; } .nav-inner { align-items:flex-start; } .brand { max-width:58%; font-size:19px; } .primary-links { display:none; } .hero { padding:58px 0; } h1 { font-size:clamp(34px,10.5vw,42px); } h2 { font-size:32px; } .deck { font-size:17px; } section { padding:60px 0; } .button { width:100%; } .service-card { padding:28px 24px; } footer .nav-inner { flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } h1 span { animation:none; } }

/* WordPress editing output uses the same preview layout. */
.entry-content > p { max-width:660px; margin:0 0 20px; color:var(--mid); }
.entry-content > p:last-child { margin-bottom:0; }
.entry-content a:not(.button) { color:var(--accent); }
.entry-content .callout p { font-size:15px; }
.includes { max-width:620px; margin:8px 0 0; padding:0; list-style:none; }
.includes li { position:relative; padding:8px 0 8px 26px; color:var(--mid); border-bottom:1px solid var(--rule); }
.includes li::before { content:""; position:absolute; left:0; top:18px; width:12px; height:2px; background:var(--accent); }
.mobile-sticky-cta { display:none; }