
:root{
  --ink:#11232d;
  --dark:#06131a;
  --red:#b9172f;
  --red2:#e2485f;
  --green:#78ad45;
  --gold:#d4ad56;
  --paper:#f3f6f7;
  --white:#fff;
  --muted:#62747e;
  --line:#dbe3e7;
  --shadow:0 18px 46px rgba(6,19,26,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:min(1180px,calc(100% - 40px));margin:auto}
.top{background:#031018;color:#dce6ea;font-size:.82rem}
.top .wrap{display:flex;justify-content:space-between;gap:20px;padding:8px 0}
.top a{text-decoration:none;color:#fff}
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.nav .wrap{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand img{width:78px;height:62px;object-fit:contain}
.links{display:flex;gap:20px;align-items:center}
.links a{text-decoration:none;font-weight:850;font-size:.88rem}
.links a:last-child{background:var(--ink);color:#fff;padding:10px 14px;border-radius:8px}
.hero{color:#fff;overflow:hidden;background:
 radial-gradient(circle at 80% 37%,rgba(185,23,47,.34),transparent 28%),
 linear-gradient(125deg,#04080b 0%,#111a20 58%,#310710 100%)}
.hero-grid{min-height:650px;display:grid;grid-template-columns:.95fr 1.05fr;gap:32px;align-items:center}
.hero-copy{padding:70px 0}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.75rem;color:#f0c66c;font-weight:900}
.eyebrow.accent{color:var(--red)}
.hero h1{font-size:clamp(3rem,6.2vw,6rem);line-height:.94;letter-spacing:-.052em;margin:14px 0 22px}
.hero p{color:#d8e3e7;max-width:690px}
.hero .lead{font-size:1.2rem}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 18px;border-radius:8px;text-decoration:none;font-weight:900}
.primary{background:var(--red);color:#fff}
.outline{border:1px solid #82949d;color:#fff}
.hero-art{position:relative;min-height:560px}
.hero-art img{position:absolute;object-fit:contain;filter:drop-shadow(0 30px 38px rgba(0,0,0,.5))}
.hero-vertex{width:52%;left:24%;top:20px;z-index:3}
.hero-771{width:48%;left:-2%;bottom:-2px;transform:rotate(-7deg);z-index:2}
.hero-585{width:46%;right:-1%;bottom:8px;transform:rotate(7deg);z-index:2}

section{padding:82px 0}
.section-head{max-width:880px;margin-bottom:34px}
.section-head h2,.tony h2,.wedge-grid h2,.value h2,.cta h2{font-size:clamp(2.2rem,4.2vw,3.8rem);line-height:1.04;letter-spacing:-.035em;margin:8px 0 15px}
.section-head p{color:var(--muted);font-size:1.05rem}
.opening{background:#fff}
.priority-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.priority-grid article{border:1px solid var(--line);border-radius:18px;padding:26px;background:#f8fafb;box-shadow:0 9px 25px rgba(6,19,26,.07)}
.priority-grid span{font-size:2.6rem;color:#dce3e6;font-weight:900}
.priority-grid h3{font-size:1.5rem;margin:3px 0 7px}
.priority-grid p{color:var(--muted);margin:0}

.selection-guide{background:var(--paper)}
.design-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.design-card{background:#fff;border-radius:22px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.design-graphic{height:255px;background:linear-gradient(145deg,#0c2532,#16465a);display:flex;align-items:flex-end;justify-content:center;gap:9px;padding:30px 18px 25px}
.club{width:28px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}
.club i{display:block;width:5px;background:linear-gradient(#d9e0e3,#6f8089);border-radius:5px 5px 0 0;position:relative}
.club i:after{content:"";position:absolute;bottom:-7px;left:-8px;width:20px;height:10px;border-radius:2px 8px 4px 3px;background:linear-gradient(145deg,#e7ecee,#7b8b93)}
.club b{margin-top:12px;color:#fff;font-size:.72rem}
.c1 i{height:170px}.c2 i{height:158px}.c3 i{height:146px}.c4 i{height:134px}.c5 i{height:122px}.c6 i{height:110px}.c7 i{height:98px}
.single .design-graphic{background:linear-gradient(145deg,#27370d,#69872f)}
.dual .design-graphic{background:linear-gradient(145deg,#2e1015,#9b2637);gap:7px}
.dual-graphic .long i{height:155px}
.dual-graphic .short i{height:122px}
.dual-graphic .divider{height:185px;width:1px;background:rgba(255,255,255,.45);margin:0 3px}
.design-body{padding:25px}
.design-tag{display:inline-block;padding:6px 10px;border-radius:999px;background:#edf1f3;color:#425963;font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.design-body h3{font-size:1.7rem;margin:12px 0 8px}
.design-body p{color:var(--muted)}
.design-body ul{padding-left:20px;color:#344b55}
.design-body strong{color:var(--red)}

.head-designs{background:#fff}
.head-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.head-card{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 10px 28px rgba(6,19,26,.08)}
.head-card img{height:270px;width:100%;object-fit:contain;padding:22px;background:linear-gradient(145deg,#edf1f3,#fff)}
.head-card div{padding:24px}
.head-card span{color:var(--red);font-size:.75rem;font-weight:900;text-transform:uppercase;letter-spacing:.09em}
.head-card h3{font-size:1.55rem;margin:8px 0}
.head-card p{color:var(--muted)}
.head-card strong{display:block;color:#273d47}

.decision-guide{background:linear-gradient(130deg,#071720,#123748);color:#fff}
.light-head p{color:#cbd9df}
.decision-flow{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.decision-flow article{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:16px;overflow:hidden}
.question{padding:20px;font-weight:900;font-size:1.05rem}
.answer{padding:17px 20px;background:rgba(255,255,255,.08);color:#d7e4e9}
.answer strong{color:#f2cc75}

.tony{background:#f3f6f7}
.tony-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:45px;align-items:center}
.tony-quote{position:relative;background:#fff;padding:35px;border-radius:22px;border:1px solid var(--line);box-shadow:var(--shadow)}
.tony-quote span{position:absolute;right:25px;top:10px;font-size:6rem;line-height:1;color:#e0e6e8}
.tony-quote blockquote{margin:0 0 18px;font-size:1.2rem;font-style:italic;position:relative;z-index:1}
.tony-quote strong{color:var(--red)}

.families{background:#fff}
.family-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.family-card{display:grid;grid-template-columns:42% 58%;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 10px 28px rgba(6,19,26,.08)}
.family-image{background:linear-gradient(145deg,#edf1f3,#fff);display:flex;align-items:center;justify-content:center;padding:18px}
.family-image img{max-height:265px;object-fit:contain}
.family-body{padding:25px}
.family-body span{font-size:.74rem;color:var(--red);text-transform:uppercase;letter-spacing:.09em;font-weight:900}
.family-body h3{font-size:1.45rem;margin:7px 0 9px}
.family-body p{color:var(--muted)}
.family-body a{color:var(--red);font-weight:900;text-decoration:none}

.wedges{background:#eef2f3}
.wedge-grid{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center}
.wedge-grid ul{padding-left:22px}
.wedge-art{min-height:430px;position:relative}
.wedge-art img{position:absolute;object-fit:contain;filter:drop-shadow(0 22px 28px rgba(6,19,26,.22))}
.wedge-art img:first-child{width:55%;left:4%;top:5px}
.wedge-art img:last-child{width:55%;right:0;bottom:0}

.value{background:#0b2b3a;color:#fff}
.value-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}
.value p{color:#d3e0e5}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:11px;list-style:none;padding:0}
.checks li:before{content:"✓";color:#ff6b7e;font-weight:900;margin-right:8px}

.cta{text-align:center;background:linear-gradient(125deg,#061720,#17465e);color:#fff}
.cta .wrap{max-width:820px}
.cta p{color:#d6e2e7;font-size:1.08rem}
.footer{background:#031018;color:#9eafb7;padding:27px 0;font-size:.9rem}
.footer .wrap{display:flex;justify-content:space-between;gap:20px}
.footer a{color:#fff;text-decoration:none}

@media(max-width:950px){
  .links{display:none}
  .hero-grid,.tony-grid,.wedge-grid,.value-grid{grid-template-columns:1fr}
  .hero-grid{padding:45px 0}
  .hero-art{min-height:460px}
  .design-grid,.head-grid{grid-template-columns:1fr}
  .family-card{grid-template-columns:1fr}
}
@media(max-width:700px){
  .wrap{width:min(100% - 26px,1180px)}
  .top .wrap,.footer .wrap{display:block}
  section{padding:60px 0}
  .priority-grid,.decision-flow,.family-grid,.checks{grid-template-columns:1fr}
  .hero-art{min-height:355px}
  .hero-vertex{width:58%;left:22%}
  .hero-771,.hero-585{width:52%}
  .design-graphic{height:220px}
  .club{width:22px}
  .wedge-art{min-height:330px}
}


/* Sprint 5 Revision 1 */
.priority-grid article{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,#ffffff,#edf3f5);
  border:1px solid #cfdbe0;
  padding:28px;
}
.priority-grid article:after{
  content:"";
  position:absolute;
  width:125px;
  height:125px;
  right:-48px;
  top:-46px;
  border-radius:50%;
  background:rgba(185,23,47,.07);
}
.priority-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#102b38;
  color:#fff;
  box-shadow:0 9px 20px rgba(6,19,26,.17);
  margin-bottom:17px;
  position:relative;
  z-index:1;
}
.priority-icon svg{width:35px;height:35px}
.priority-label{
  color:var(--red);
  text-transform:uppercase;
  letter-spacing:.11em;
  font-size:.72rem;
  font-weight:900;
  margin-bottom:4px;
}
.priority-grid h3{
  color:#10232d;
  font-size:1.65rem;
}
.priority-grid p{
  color:#465b65;
  font-size:1rem;
}
.hero-vertex{
  background:transparent;
}
.family-image img[src*="pinhawk-vertex-clean"]{
  background:transparent;
}


/* Sprint 5 V2: approved hero replacement only */
.hero-image-only{background:#000;overflow:hidden;line-height:0;}
.hero-image-only img{display:block;width:100%;height:auto;margin:0 auto;}
