/* The Prize Master — theprizemaster.com
   Palette = option 6 of the owner's laurel mockups (2026-09-26): deep teal and copper.
   Cormorant Garamond for the display face, Inter for thin spaced caps, Georgia body. */

:root{
  --ink:#0e3a40; --panel:#0b3136; --raise:#124850; --line:#1f565d;
  --text:#eaf1ef; --dim:#a9c3c0; --steel:#6f9a95;
  --copper:#d08a5a; --copper-hi:#dda077;
  --display:'Cormorant Garamond',Georgia,serif;
  --serif:Georgia,'Times New Roman',serif;
  --sans:Inter,'Segoe UI',Arial,sans-serif;
}

*{box-sizing:border-box}
html{background:var(--ink);scroll-behavior:smooth}
section[id]{scroll-margin-top:24px}
body{
  background:var(--ink);color:var(--text);
  font-family:var(--serif);font-size:16px;line-height:1.7;
  margin:0;-webkit-font-smoothing:antialiased;
}
a{color:var(--copper);text-decoration:none;border-bottom:1px dotted var(--steel)}
a:hover{border-bottom-color:var(--copper)}

.wrap{max-width:1060px;margin:0 auto;padding:0 24px}

/* ---------- nav: two doors, Path and Consultation (owner 2026-09-26) ---------- */
.topbar{border-bottom:1px solid rgba(208,138,90,.33)}
.nav{display:flex;align-items:center;gap:28px;padding:20px 0 18px;font-family:var(--sans)}
.nav .mark{display:flex;align-items:center;gap:12px;border:0;color:var(--copper)}
.mark svg{display:block;width:26px;height:32px}
.mark span{font-family:var(--display);font-size:20px;font-weight:500;letter-spacing:.04em;color:var(--text);white-space:nowrap}
.nav-links{display:flex;gap:28px;margin-left:auto}
.nav-links a{
  font-size:11px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;
  color:var(--copper);border-bottom:1px solid transparent;padding-bottom:3px;
}
.nav-links a:hover{color:var(--copper-hi);border-bottom-color:var(--copper)}
.nav-links a.on{color:var(--text);border-bottom-color:var(--copper)}

.cta{
  display:inline-block;font-family:var(--sans);font-size:11px;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink);
  background:var(--copper);padding:13px 24px;border:0;border-radius:2px;white-space:nowrap;
}
.cta:hover{background:var(--copper-hi);border:0}
.cta.ghost{background:none;color:var(--copper);box-shadow:inset 0 0 0 1px var(--copper)}
.cta.ghost:hover{color:var(--ink);background:var(--copper)}

/* ---------- shared atoms ---------- */
section{padding:64px 0 8px;display:flow-root}
h2{font-family:var(--display);font-weight:500;font-size:34px;line-height:1.2;margin:0 0 20px;color:var(--text)}
p{margin:0 0 18px;color:var(--dim);max-width:64ch}
p strong{color:var(--text)}
.rule{width:64px;height:1px;background:var(--copper);margin:0 auto}
/* Placeholder copy waiting on the owner's text — dashed copper edge so it can't pass for final. */
.ph{border-left:1px dashed var(--copper);padding-left:16px}

/* ---------- home hero (the chosen laurel layout) ---------- */
.lhero{text-align:center;padding:84px 0 70px}
.lhero .medal{display:block;width:30px;height:38px;margin:0 auto;color:var(--copper)}
.lhero h1{font-family:var(--display);font-weight:500;font-size:clamp(44px,8vw,78px);line-height:1.04;margin:16px 0 18px;color:var(--text)}
.lhero .under{
  font-family:var(--display);font-style:italic;font-size:clamp(20px,2.6vw,26px);line-height:1.4;
  color:var(--text);margin:20px auto 34px;max-width:560px;
}
.cats{
  display:flex;justify-content:center;gap:28px;flex-wrap:wrap;padding:16px 16px;
  border-top:1px solid rgba(208,138,90,.33);border-bottom:1px solid rgba(208,138,90,.33);
  font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--copper);
}
.home-copy{max-width:720px;margin:0 auto}
.home-copy p{max-width:none}
.home-copy .lead{font-size:19px;line-height:1.65;color:var(--text)}
.home-copy ol{margin:0 0 18px;padding-left:22px;color:var(--dim)}
.home-copy ol li{margin:0 0 6px;padding-left:4px}
.home-copy ol li::marker{color:var(--copper);font-family:var(--sans);font-size:13px}
/* The two "I help" lists side by side, the fee line under them (owner copy 2026-09-26). */
.helps{display:grid;grid-template-columns:1fr 1fr;gap:10px 40px}
.helps-h{font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--copper);margin:0 0 12px}
.helps li{color:var(--text)}
.fees-line{margin:14px 0 0;padding-top:18px;border-top:1px solid var(--line);font-size:15px;color:var(--text)}
/* Free tips: numbered, each with its own title. */
.home-copy ol.tips{list-style:none;padding:0;counter-reset:tip}
/* ol.tips in every selector: the generic ".home-copy ol li" padding outranked plain ".tips li" and
   slid the number under the title (owner 2026-09-26). Inter numerals: Cormorant's old-style 1 reads as an I. */
.home-copy ol.tips li{counter-increment:tip;position:relative;padding:22px 0 6px 52px;border-top:1px solid var(--line);margin:0}
.home-copy ol.tips li::before{content:counter(tip);position:absolute;left:0;top:26px;font-family:var(--sans);font-weight:400;font-size:24px;line-height:1;color:var(--copper)}
.tips h3{font-family:var(--display);font-weight:500;font-size:24px;line-height:1.25;color:var(--text);margin:0 0 10px}
/* The Fox interview: click-to-play still (fox-video.js, shared with the other brand sites). */
.video{position:relative;aspect-ratio:16/9;border:1px solid var(--line);background:var(--raise);overflow:hidden;cursor:pointer;margin:6px 0 10px}
.video img{display:block;width:100%;height:100%;object-fit:cover}
.video .scrim{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;background:rgba(14,58,64,.25)}
.video:hover .scrim{background:rgba(14,58,64,.1)}
.play{width:54px;height:54px;border-radius:50%;border:1px solid var(--copper);display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--sans);font-size:16px;padding-left:5px;background:rgba(14,58,64,.8)}
.video .vlabel{font-family:var(--sans);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- closing doors: Consultation and Path, again at the bottom ---------- */
.doors{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:64px}
.door{display:block;border:1px solid var(--line);background:var(--panel);padding:28px 30px;color:var(--text)}
.door:hover{border-color:var(--copper)}
.door b{display:block;font-family:var(--display);font-weight:500;font-size:28px;line-height:1.2;color:var(--text)}
.door span{display:block;margin-top:8px;font-size:14.5px;color:var(--dim)}
.door i{display:block;margin-top:16px;font-style:normal;font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--copper)}

/* ---------- footer ---------- */
footer{margin-top:70px;border-top:1px solid rgba(208,138,90,.33);padding:30px 0 48px}
footer .wrap{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
footer .fmark{font-family:var(--display);font-size:18px;font-weight:500;color:var(--text)}
footer .flinks{display:flex;gap:26px;margin-left:auto;font-family:var(--sans)}
footer .flinks a{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--copper);border-bottom:0}
footer .flinks a:hover{color:var(--copper-hi)}

/* ---------- The Path hero (replica of ivyhacker.com/path) ---------- */
.hero{padding:64px 0 28px}
.hero h1{font-family:var(--display);font-weight:500;font-size:clamp(40px,6vw,64px);line-height:1.1;margin:0;color:var(--text)}
.hero h1 .hl{color:var(--copper)}
.hero .tagline{
  font-family:var(--sans);font-weight:400;font-size:13px;letter-spacing:.12em;line-height:1.6;
  text-transform:uppercase;color:var(--copper);margin:20px 0 0;max-width:none;
}

/* ---------- The Path list ---------- */
.pathlist{margin-top:10px}
.pgrade{margin-top:40px;scroll-margin-top:24px}
#grades .pgrade:first-child{margin-top:0}
.pgrade-h{
  font-family:var(--display);font-weight:500;font-size:28px;line-height:1.2;
  color:var(--copper);margin:0 0 4px;padding-bottom:10px;border-bottom:1px solid var(--line);
}
.pblock{margin-top:18px}
.pblock-h{font-family:var(--sans);font-weight:400;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--dim);margin:0 0 2px}
.plist{list-style:none;margin:0;padding:0}
.prow{padding:16px 0 14px;border-bottom:1px solid var(--line)}
.phead{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.pname{font-family:var(--sans);font-weight:500;font-size:15px;color:var(--text);border-bottom:1px dotted var(--steel)}
.pname:hover{color:var(--copper)}
.pgrades{font-family:var(--sans);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--copper);margin-left:auto;text-align:right;max-width:100%}
.pmeta{font-family:var(--sans);font-size:12px;color:var(--steel);margin-top:2px}
.pfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:6px 22px;margin-top:10px;max-width:none}
.pf{font-size:13.5px;line-height:1.55}
.pk{font-family:var(--sans);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--steel);display:block}
.pv{color:var(--text)}
.pnotes{font-size:13.5px;color:var(--dim);margin:8px 0 0;max-width:72ch}
.pstate{font-size:17px;color:var(--text);margin:26px 0 0;max-width:none}
.pstate.pgradeq{margin:30px 0 10px}
.pstate select{
  font-family:var(--sans);font-size:14px;color:var(--copper);
  background:var(--raise);border:1px solid var(--steel);padding:6px 10px;margin-left:6px;
}
.pstate select:focus{outline:none;border-color:var(--copper)}
.gradebar{display:flex;flex-wrap:wrap;border:1px solid var(--steel);margin:0 0 34px;font-family:var(--sans)}
.gradebar a{
  flex:1 1 auto;text-align:center;padding:13px 10px;font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--dim);border-right:1px solid var(--steel);border-bottom:0;white-space:nowrap;
}
.gradebar a:last-child{border-right:0}
.gradebar a:hover{color:var(--copper);background:var(--raise)}

/* ---------- suggestion form ---------- */
.cform{max-width:560px;margin-top:34px;display:flex;flex-direction:column;gap:18px}
.cform label{display:flex;flex-direction:column;gap:8px}
.cform label span{font-family:var(--sans);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.cform input{
  font-family:var(--serif);font-size:15px;color:var(--text);
  background:var(--raise);border:1px solid var(--line);padding:12px 14px;border-radius:0;outline:none;
}
.cform input:focus{border-color:var(--copper)}
.cform .hp{position:absolute;left:-9999px;top:-9999px}
.cform-foot{display:flex;align-items:center;gap:20px;margin-top:6px}
.cform-foot .cta{cursor:pointer}
.cform-foot .cta:disabled{opacity:.5;cursor:default}
.cform-foot p{margin:0;font-size:13.5px;color:var(--copper)}
.cform.is-sent{justify-content:center;align-items:center;text-align:center;border:1px solid var(--line);background:var(--panel)}
.cform.is-sent > :not(.sent-panel){display:none}
.sent-panel{display:flex;flex-direction:column;align-items:center;gap:10px;padding:30px 16px;outline:none}
.sent-panel[hidden]{display:none}
.sent-panel .eyebrow{font-family:var(--sans);font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--copper);margin:0}

/* ---------- responsive ---------- */
@media(max-width:700px){
  .doors{grid-template-columns:1fr}
  .helps{grid-template-columns:1fr}
  .home-copy ol.tips li{padding-left:40px}
}
@media(max-width:640px){
  .nav{gap:16px}
  .nav-links{gap:18px}
  .mark span{font-size:18px}
  .lhero{padding:56px 0 48px}
  .pgrades{margin-left:0;text-align:left}
  .hero .tagline{font-size:12px}
  footer .flinks{margin-left:0}
}
@media(max-width:400px){
  .mark span{display:none}
}