:root{--brand:#0a2a66;--accent:#ffeb00;--ink:#0b1220;--muted:#5e6b86;}
*{box-sizing:border-box}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden;background:#fff;color:#10162f;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.55}
img{max-width:100%;height:auto}
a{text-decoration:none}
/* Hero */
header{background:linear-gradient(180deg,var(--brand),#08204e);color:#fff;padding:20px 16px 28px}
.wrap{max-width:1040px;margin:0 auto;padding:0 16px}
h1{margin:0 0 8px;font-size:clamp(1.4rem,2.6vw,2rem);max-width:800px;margin-left:auto;margin-right:auto;line-height:1.3;text-align:center}
p.lead{color:#cfe0ff;margin:0 0 14px;text-align:center}
/* CTA buttons only */
a.cta, button.cta {display:inline-block;background:var(--accent);color:#000;font-weight:800;padding:10px 14px;border-radius:10px;max-width:100%}
header .cta{display:inline-block;margin:6px auto 0}
header .logo{display:block;margin:0 auto 12px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15));max-width:180px;width:40%}
/* Sections / cards */
.section{padding:16px 0}
section {margin-top:20px !important;}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:18px;align-items:start;width:100%}
@media (max-width:460px){.grid{grid-template-columns:1fr}}
h2{margin:0 0 18px;font-size:1.6rem;color:var(--brand)}
h3{color:var(--brand);margin-top:0}
.card{border:1px solid #e7ecf5;border-radius:14px;padding:20px;box-shadow:0 2px 5px rgba(0,0,0,.03);width:100%;overflow-x:hidden; margin-top:8px;}
ul{margin:0 0 10px 18px;padding:0}
.muted{color:#5f6f97}
/* Footer */
footer{background:#071b44;color:#c7d2f3;padding:24px 0;margin-top:24px}
footer a{color:#c7d2f3}
/* Floating WhatsApp button */
.wa-float{
  position:fixed;right:20px;bottom:20px;z-index:999;
  width:56px;height:56px;border-radius:50%;
  background:#25D366;color:#fff;text-align:center;
  box-shadow:0 3px 8px rgba(0,0,0,.25);transition:transform .2s ease
}
.wa-float span{display:inline-block;line-height:56px;font-size:26px}
.wa-float:hover{transform:scale(1.08)}
@media (prefers-reduced-motion:reduce){.wa-float{transition:none}}
/* Safety nets for mobile overflow */
.grid,.card,.cta{overflow-x:hidden}
/* SUBPAGE CENTERED HEADER */
header.sub{padding:20px 16px 28px; }
header.sub .wrap{text-align:center}
header.sub .logo{display:block;margin:0 auto 12px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15));max-width:180px;width:40%}
header.sub h1{margin:0 0 8px;font-size:clamp(1.3rem,2.2vw,1.8rem);line-height:1.3}
header.sub nav{font-size:.9rem;margin-bottom:8px}
header.sub nav a{color:#cfe0ff;text-decoration:underline}
footer.sub{background:#071b44;color:#c7d2f3;padding:24px 0;margin-top:24px}
footer.sub a{color:#c7d2f3}
/* Make subpage H1 + lead match homepage layout */
header.sub h1{
  font-size: clamp(1.4rem, 2.6vw, 2rem); /* same as homepage */
  line-height: 1.3;
  max-width: 800px;            /* same width constraint */
  margin: 0 auto 8px; 
        margin-left: auto;
    margin-right: auto;/* center block + tidy spacing */
  text-align: center;          /* belt-and-braces */
}
header.sub .lead{
  max-width: 820px;            /* mirrors homepage feel */
  margin: 0 auto 10px;
  text-align: center;
}

/* breadcrumb polish + tighter hero spacing */
header.sub { padding: 20px 16px 20px; min-height: 240px; display:flex; flex-direction:column; justify-content:center; }
header.sub .logo { margin-bottom: 6px; }
header.sub nav { font-size: 0.9rem; opacity: .8; text-align:center; margin-bottom: 8px; }

/* Button stack inside cards */
.card .btn-stack { margin-top: 8px; }
.card .cta {
  display: block;        /* force full width */
  width: 100%;
  text-align: center;
  padding: 12px 14px;
  border-radius: 10px;
  font-weight: 800;
}
.card .cta + .cta { margin-top: 10px; } /* space between buttons */

/* primary vs secondary styles */
.card .cta.primary { background: var(--accent); color: #000; border: none; }
.card .cta.secondary { background: #fff; color: inherit; border: 1px solid #ccd6eb; }
/* Responsive, wider video */
.video-embed{
  position: relative;
  width: 100%;
  max-width: 1000px;           /* tweak: 900–1100px depending on taste */
  margin: 0 auto;              /* centers it in the content column */
}

/* Maintain 16:9 ratio (works everywhere) */
.video-embed::before{
  content: "";
  display: block;
  padding-top: 56.25%;         /* 16:9 */
}

.video-embed iframe{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* On very large screens, give it a touch more presence */
@media (min-width: 1400px){
  .video-embed{ max-width: 1100px; }
}

figcaption { font-size:11px;}

/* Click-to-load YouTube placeholder */
.yt-placeholder{
  background:#000 center/cover no-repeat;
  cursor:pointer;
  position:relative;
}
.yt-placeholder::after{
  content:"";
  position:absolute; inset:0; margin:auto;
  width:68px; height:48px;
  background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="68" height="48"><path d="M66.52 7.64a8 8 0 0 0-5.64-5.65C56.6 1 34 1 34 1s-22.6 0-26.88 1a8 8 0 0 0-5.64 5.65C0 12 0 24 0 24s0 12 1.48 16.36a8 8 0 0 0 5.64 5.65C11.4 47 34 47 34 47s22.6 0 26.88-1a8 8 0 0 0 5.64-5.65C68 36 68 24 68 24s0-12-1.48-16.36z" fill="%23e52d27"/><path d="M27 33V15l18 9-18 9z" fill="%23fff"/></svg>') center/68px 48px no-repeat;
  transition: transform .2s ease;
}
.yt-placeholder:hover::after,
.yt-placeholder:focus-visible::after{ transform: scale(1.06); }

.logo { height: auto; max-width: 100%; }

/* Defer rendering for later sections to speed first paint/LCP */
.section:nth-of-type(n+3){
  content-visibility: auto;
  contain-intrinsic-size: 600px; /* preserves space to avoid CLS */
}
.pill {
  display: inline-block;
  padding: .35rem .75rem;
  border: 1px solid #ccd6eb;
  border-radius: 999px;
  font-size: .92rem;
  background: #f8faff;
  color: #243a63;
  margin: .3rem .4rem .3rem 0;
  font-weight: 500;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pill:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
}

main .cta { display:inline-block; margin:0; text-align:center; }


/* Ensure Book section is visually centered like baseline */
#book .wrap{
  max-width:1040px;
  margin:0 auto;
  text-align:center;
}
#book h2{ text-align:center; }
#book p{ text-align:center; }



/* Hard center the Book section regardless of other rules */
.book-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  max-width:1040px;
  margin:0 auto;
  padding:0 16px;
}
.book-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
}
.book-actions .cta{ margin:0; }



/* === v6: CTA card visual elevation === */
.book-wrap{
  background:#fff9d6;
  border-radius:18px;
  box-shadow:0 4px 12px rgba(0,0,0,.12);
  padding:48px 36px;
  max-width:820px;
  margin:0 auto;
  text-align:center;
}
.book-wrap h2{ color:var(--brand); margin-bottom:10px; }
.book-wrap p{ color:#111; }