/* For Dads page styles. Generated by scripts/build-css.py from the WPBakery page CSS on the
   live page; unchanged except image URLs point at local WebP files. */
/* Jost 300: on the live site only these pages linked it (from their pasted blocks). */
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(/assets/fonts/jost-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(/assets/fonts/jost-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(/assets/fonts/jost-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* ============================================================
   THE LADYBIRD CLUB — "FOR DADS" LANDING PAGE   (/for-dads/)
   Primary keyword: understanding your teenage daughter

   DESIGN SYSTEM (matches homepage + blog):
   · Everything sits in a centred 1100px container.
   · Colour lives in ROUNDED, CONTAINED cards/bands (32px radius)
     on a white page — never full-bleed edge-to-edge.
   · Bauhaus/lace headings, Jost body, brand pastels.
   All classes namespaced "fd-" so they can't clash with tlc-site.css.
   ============================================================ */

/* .tlc-bauhaus / .tlc-lace already exist site-wide —
   safe to DELETE these two lines when pasting into your stylesheet. */
.tlc-bauhaus{font-family:'Bauhaus Lace Bolt',sans-serif;display:inline;vertical-align:baseline;}
.tlc-lace{font-family:'Bauhaus Lace',serif;display:inline;vertical-align:baseline;color:#db99d3;}

.fd-page{font-family:'Jost',sans-serif;color:#2D2521;line-height:1.6;background:#fff;}
.fd-page *{box-sizing:border-box;}

.fd-ey{
  display:block;font-size:11px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;
  color:rgba(45,37,33,.42);margin-bottom:16px;
}

/* ============================================================
   HERO — contained rounded card (identical pattern to the blog hero)
   ============================================================ */
.fd-hero{
  position:relative;overflow:hidden;
  width:min(1100px, calc(100vw - 4rem));
  margin:40px auto 0;
  border-radius:32px;
  background:#fff;
  box-shadow:0 12px 30px rgba(45,37,33,.05),0 32px 70px rgba(45,37,33,.05);
  display:flex;flex-direction:column;
}
.fd-hero-media{
  order:2;position:relative;
  margin:0 20px 22px;height:300px;
  border-radius:22px;overflow:hidden;
  background-image:url('/assets/img/fd-hero-mobile-1000.webp');
  background-size:cover;background-position:center;
}
.fd-hero-text{
  order:1;position:relative;z-index:2;
  padding:44px 28px 34px;text-align:center;
}
#fd-h1{
  display:block;line-height:1.1;margin:0 0 16px;
  /* size inherits from the Neve theme, like the homepage #tlcH1.
     For an explicit preview size add e.g. font-size:clamp(38px,5.5vw,64px); */
}
.fd-hero-p{
  font-size:17px;line-height:1.75;color:#6b5752;
  max-width:480px;margin:0 auto 26px;
}
.fd-hero .fd-btns{justify-content:center;margin-bottom:14px;}
.fd-hero-note{font-size:13px;color:rgba(45,37,33,.5);}

@media(min-width:761px){
  .fd-hero{display:block;min-height:480px;}
  .fd-hero-media{
    position:absolute;inset:0;margin:0;height:auto;border-radius:0;
    background-image:url('/assets/img/fd-hero-1920.webp');
    background-position:center right;
  }
  .fd-hero-text{max-width:54%;text-align:left;padding:84px 0 84px 60px;}
  .fd-hero-p{margin:0 0 26px;}
  .fd-hero .fd-btns{justify-content:flex-start;}
}
@media(max-width:760px){
  .fd-hero{margin:24px auto 0;border-radius:24px;}
}

/* ============================================================
   BODY WRAP — holds everything after the hero (like .blog-sections)
   ============================================================ */
.fd-wrap{max-width:1100px;margin:0 auto;padding:72px 24px 96px;}
@media(max-width:700px){.fd-wrap{padding:56px 20px 72px;}}

.fd-block{margin-bottom:80px;}
@media(max-width:700px){.fd-block{margin-bottom:60px;}}

.fd-head{text-align:center;max-width:680px;margin:0 auto 44px;}
.fd-h2{display:block;font-size:clamp(32px,4vw,52px);line-height:1.08;margin:0;}
.fd-sub{font-size:16px;line-height:1.8;color:#6b5752;max-width:560px;margin:18px auto 0;}

/* ============================================================
   EMPATHY — rounded, contained pastel card (no more full bleed)
   ============================================================ */
.fd-empathy{
  background:linear-gradient(135deg,#fef0f3 0%,#f3e8f6 55%,#e8eef7 100%);
  border-radius:32px;
  padding:64px 48px;text-align:center;
  margin-bottom:80px;
}
@media(max-width:700px){.fd-empathy{padding:48px 26px;border-radius:24px;margin-bottom:60px;}}
.fd-empathy-inner{max-width:640px;margin:0 auto;}
.fd-empathy p{font-size:clamp(19px,2.2vw,24px);line-height:1.6;color:#2D2521;}
.fd-empathy p + p{margin-top:16px;font-size:16px;color:#6b5752;line-height:1.8;}

/* ============================================================
   EXPLAINER CARDS — "it's not attitude, it's her hormones"
   ============================================================ */
.fd-egrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
@media(max-width:700px){.fd-egrid{grid-template-columns:1fr;}}
.fd-ecard{
  position:relative;overflow:hidden;
  border-radius:22px;padding:32px 30px;
  box-shadow:0 2px 4px rgba(45,37,33,.05),0 10px 30px rgba(45,37,33,.06);
}
.fd-ecard h3{
  position:relative;z-index:1;
  font-family:'Bauhaus Lace Bolt',sans-serif;font-weight:600;
  font-size:22px;line-height:1.18;margin:0 0 10px;color:#2D2521;
}
.fd-ecard p{position:relative;z-index:1;font-size:15px;line-height:1.7;color:#5a4a46;}

/* soft brand bubbles — identical recipe to the blog .cat-bubble */
.fd-bubble{position:absolute;border-radius:50%;opacity:.55;z-index:0;pointer-events:none;}

/* ============================================================
   HOW THE APP HELPS — rounded contained card, features + screenshot
   ============================================================ */
.fd-help{
  background:#faf7f5;
  border:1px solid rgba(45,37,33,.05);
  border-radius:32px;
  padding:56px;margin-bottom:80px;
  box-shadow:0 8px 28px rgba(45,37,33,.05);
}
@media(max-width:860px){.fd-help{padding:40px 28px;border-radius:24px;margin-bottom:60px;}}
.fd-help-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;}
@media(max-width:860px){.fd-help-inner{grid-template-columns:1fr;gap:36px;}}
.fd-help .fd-head{text-align:left;margin:0 0 26px;max-width:none;}
@media(max-width:860px){.fd-help .fd-head{text-align:center;}}
.fd-help-h2{display:block;font-size:clamp(28px,3.4vw,42px);line-height:1.12;margin:0 0 14px;}
.fd-help-sub{font-size:16px;line-height:1.8;color:#6b5752;margin:0;max-width:480px;}
.fd-feats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.fd-feat{
  display:flex;align-items:flex-start;gap:14px;
  background:#fff;border:1px solid rgba(45,37,33,.06);
  border-radius:16px;padding:16px 18px;
}
.fd-ficon{
  width:40px;height:40px;border-radius:12px;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
}
.fd-feat b{display:block;font-size:15px;color:#2D2521;margin-bottom:2px;}
.fd-feat span{font-size:14px;line-height:1.55;color:#6b5752;}
.fd-help-shot{display:flex;justify-content:center;}
.fd-help-shot img{
  width:100%;max-width:280px;height:auto;display:block;border-radius:24px;
  filter:drop-shadow(0 30px 40px rgba(45,37,33,.18)) drop-shadow(0 8px 16px rgba(45,37,33,.08));
}
@media(max-width:860px){.fd-help-shot{order:-1;}}

/* ============================================================
   ARTICLE CLUSTER — "start here, dad" (live URLs, SEO links)
   ============================================================ */
.fd-agrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:36px;}
@media(max-width:900px){.fd-agrid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.fd-agrid{grid-template-columns:1fr;}}
.fd-acard{
  position:relative;overflow:hidden;
  display:flex;flex-direction:column;
  border-radius:18px;padding:26px 24px;min-height:170px;
  box-shadow:0 2px 4px rgba(45,37,33,.05),0 8px 24px rgba(45,37,33,.07);
  transition:transform .3s ease,box-shadow .3s ease;
}
.fd-acard:hover{transform:translateY(-5px);box-shadow:0 4px 8px rgba(45,37,33,.08),0 16px 38px rgba(45,37,33,.12);}
.fd-atag{position:relative;z-index:1;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(45,37,33,.5);margin-bottom:10px;}
.fd-atitle{position:relative;z-index:1;font-family:'Bauhaus Lace Bolt',sans-serif;font-weight:600;font-size:19px;line-height:1.22;color:#2D2521;margin-bottom:auto;}
.fd-alink{position:relative;z-index:1;margin-top:16px;font-weight:700;font-size:13px;color:#2D2521;border-bottom:2px solid #db99d3;padding-bottom:2px;align-self:flex-start;}
.fd-acta-row{text-align:center;}

/* ============================================================
   DOWNLOAD CTA — rounded contained pastel band (matches blog app-cta)
   ============================================================ */
.fd-cta{
  border-radius:32px;
  background:linear-gradient(135deg,#fef0f3 0%,#f3e8f6 55%,#e8eef7 100%);
  padding:64px 56px;text-align:center;
}
@media(max-width:700px){.fd-cta{padding:48px 28px;border-radius:24px;}}
.fd-cta-h2{display:block;font-size:clamp(30px,3.6vw,48px);line-height:1.1;margin:0 0 14px;color:#2D2521;}
.fd-cta-p{font-size:16px;line-height:1.8;color:#5a4a46;max-width:480px;margin:0 auto 28px;}
.fd-cta .fd-btns{justify-content:center;margin-bottom:22px;}

/* store buttons — one dark pill style everywhere (self-contained, no clash) */
.fd-btns{display:flex;gap:10px;flex-wrap:wrap;}
.fd-btn{
  display:inline-flex;align-items:center;gap:9px;
  padding:12px 24px;border-radius:100px;font-weight:700;font-size:15px;
  background:#2D2521;color:#fff;text-decoration:none;
  box-shadow:0 6px 22px rgba(45,37,33,.18);transition:transform .2s;
}
.fd-btn:hover{transform:translateY(-2px);}
.fd-btn svg{flex-shrink:0;display:block;}

.fd-trust{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:center;}
.fd-ti{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(45,37,33,.42);}
.fd-ti-sep{font-family:'Bauhaus Lace',serif;color:#db99d3;font-size:1.2em;line-height:1;}