@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

:root{
  --ink:#142433;
  --ink-soft:#3E5266;
  --paper:#EEF1EF;
  --paper-2:#FFFFFF;
  --signal:#E2A344;
  --teal:#1F5C56;
  --line:#D8DEDC;
  --radius:6px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif;
  font-size:17px;
  line-height:1.6;
}
h1,h2,h3,.brand{
  font-family:'Fraunces', serif;
  color:var(--ink);
  line-height:1.15;
  margin:0 0 0.5em 0;
  font-weight:600;
}
h1{font-size:2.6rem; font-optical-sizing:auto;}
h2{font-size:1.7rem;}
h3{font-size:1.25rem;}
p{margin:0 0 1em 0; max-width:66ch; color:var(--ink-soft);}
a{color:var(--teal);}
img{max-width:100%; display:block;}

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

header.site{border-bottom:1px solid var(--line); background:var(--paper-2);}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; padding-top:18px; padding-bottom:18px; flex-wrap:wrap; gap:10px;}
.brand{font-size:1.35rem; text-decoration:none; display:flex; align-items:baseline; gap:8px;}
.brand span.dot{width:9px; height:9px; border-radius:50%; background:var(--signal); display:inline-block; margin-right:2px;}
nav.main a{margin-left:22px; color:var(--ink); text-decoration:none; font-size:0.94rem; font-weight:500; border-bottom:2px solid transparent; padding-bottom:3px;}
nav.main a:hover{border-bottom-color:var(--signal);}

.hero{position:relative; overflow:hidden; background:var(--ink); color:#fff;}
.hero .wrap{padding-top:64px; padding-bottom:64px; position:relative; z-index:2;}
.hero h1{color:#fff; max-width:14ch;}
.hero p.lead{color:#C9D3D8; max-width:52ch; font-size:1.1rem;}
.epg-grid{position:absolute; inset:0; z-index:1; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(6,1fr); gap:2px; opacity:0.5;}
.epg-grid div{background:rgba(255,255,255,0.045);}
.epg-grid div:nth-child(3n){background:rgba(226,163,68,0.10);}
.epg-grid div:nth-child(7n){background:rgba(31,92,86,0.18);}

.btn{display:inline-block; padding:11px 22px; border-radius:var(--radius); text-decoration:none; font-weight:600; font-size:0.95rem; border:1px solid transparent;}
.btn-primary{background:var(--signal); color:var(--ink);}
.btn-primary:hover{background:#cf9236;}
.btn-outline{border-color:rgba(255,255,255,0.5); color:#fff;}
.btn-outline:hover{border-color:#fff;}
.btn-teal{background:var(--teal); color:#fff;}
.btn-teal:hover{background:#164943;}

.grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(230px,1fr)); gap:18px; margin:32px 0;}
.card{background:var(--paper-2); border:1px solid var(--line); border-radius:var(--radius); padding:20px; text-decoration:none; display:block;}
.card h3{margin-bottom:6px; font-size:1.15rem;}
.card p{font-size:0.92rem; margin:0; color:var(--ink-soft);}
.card .tag{display:inline-block; font-size:0.78rem; color:var(--teal); background:#E5F0EE; padding:2px 9px; border-radius:20px; margin-bottom:10px;}

section{padding:44px 0;}
section.alt{background:var(--paper-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}

.page-head{border-bottom:1px solid var(--line); background:var(--paper-2); padding:40px 0;}
.page-head .tag{display:inline-block; font-size:0.8rem; color:var(--teal); background:#E5F0EE; padding:3px 10px; border-radius:20px; margin-bottom:12px;}
.action-row{display:flex; gap:12px; margin-top:20px; flex-wrap:wrap;}
.action-row a.btn-primary{color:var(--ink);}
.action-row a.btn-teal{color:#fff;}

.steps{counter-reset:step; padding:0; margin:24px 0; list-style:none;}
.steps li{counter-increment:step; position:relative; padding-left:44px; margin-bottom:20px;}
.steps li::before{content:counter(step); position:absolute; left:0; top:0; width:30px; height:30px; background:var(--ink); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.85rem; font-weight:600; font-family:'IBM Plex Sans', sans-serif;}
.steps li h3{margin-bottom:4px; font-size:1.05rem;}
.steps li p{margin:0; font-size:0.96rem;}

.info-list{list-style:none; padding:0; margin:0 0 1em 0;}
.info-list li{padding:10px 0; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; gap:20px; font-size:0.96rem;}
.info-list li strong{color:var(--ink); font-weight:600; min-width:150px;}

.note{background:#FBF3E4; border:1px solid #EBD9AE; border-radius:var(--radius); padding:16px 18px; font-size:0.92rem; color:var(--ink-soft); margin:24px 0;}
.note strong{color:var(--ink);}

.price-badge{display:inline-block; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:14px 18px; margin:8px 0 20px 0;}
.price-badge .amount{font-family:'Fraunces',serif; font-size:1.6rem; color:var(--ink); font-weight:600;}
.price-badge .label{font-size:0.85rem; color:var(--ink-soft); display:block;}

footer{background:var(--ink); color:#B9C4CC; padding:40px 0; margin-top:40px; font-size:0.9rem;}
footer a{color:#DCE4E7;}
footer .cols{display:flex; gap:50px; flex-wrap:wrap;}
footer h4{color:#fff; font-family:'IBM Plex Sans',sans-serif; font-size:0.95rem; margin:0 0 10px 0;}
footer ul{list-style:none; padding:0; margin:0;}
footer li{margin-bottom:6px;}
footer .disclaimer{margin-top:28px; padding-top:20px; border-top:1px solid rgba(255,255,255,0.12); font-size:0.82rem; color:#8CA0AA;}

@media (max-width:640px){
  h1{font-size:1.9rem;}
  nav.main a{margin-left:12px; font-size:0.84rem;}
  .hero .wrap{padding-top:44px; padding-bottom:44px;}
  footer .cols{gap:26px;}
}
