/* Landing page styles, ported from the Dawni design (site/index.html). */
.hero { min-height:min(94vh, 880px); display:flex; flex-direction:column; overflow:hidden; }
  .hero .wrap { width:100%; }
  .hero-body { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding-block:40px 250px; position:relative; }
  .hero h1 { color:var(--linen); max-width:13em; margin:18px auto 22px; }
  .hero h1 em { color:var(--champagne); }
  .hero .lede { font-size:1.18rem; max-width:34em; margin:0 auto 34px; color:#F1E4DA; }
  .hero .eyebrow { color:var(--gold); }
  .hero .fine { color:#F1E4DA; font-size:.86rem; margin-top:18px; opacity:.9; }
  .sun { position:absolute; left:50%; bottom:-170px; width:340px; height:340px; margin-left:-170px; border-radius:50%;
    background:radial-gradient(circle at 50% 40%, #FFF1D6 0%, #F6C98F 38%, #E0894A 70%, rgba(224,137,74,0) 71%);
    box-shadow:0 0 120px 40px rgba(246,201,143,.35); animation:sunrise 3.2s var(--ease) both; }
  @keyframes sunrise { from { transform:translateY(60px); opacity:.6; } to { transform:none; opacity:1; } }
  .horizon { position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg, transparent, rgba(243,227,195,.8), transparent); }
  .hero-wren { position:absolute; left:50%; bottom:-6px; margin-left:-75px; z-index:2; }
  .alt-heads { margin-top:20px; font-size:.86rem; color:#F1E4DA; }
  .alt-heads summary { cursor:pointer; text-decoration:underline; text-underline-offset:4px; }
  .alt-heads ul { list-style:none; padding:0; margin:8px 0 0; font-family:var(--serif); font-style:italic; font-size:1.05rem; }
  section.block { padding-block:120px; }
  .intro { text-align:center; max-width:760px; margin:0 auto; }
  .intro p.big { font-family:var(--serif); font-size:clamp(1.5rem, 2.6vw, 2.1rem); line-height:1.35; font-weight:350; }
  .ritual { list-style:none; margin:56px 0 0; padding:0; display:grid; grid-template-columns:repeat(4, 1fr); border-top:1px solid var(--hair); }
  .ritual li { padding:28px 24px 0 0; }
  .ritual .n { font-family:var(--serif); font-style:italic; color:var(--clay); font-size:1.1rem; display:block; margin-bottom:14px; }
  .ritual p { color:var(--mauve); margin:0; font-size:.96rem; }
  .rules { margin-top:56px; display:grid; grid-template-columns:auto 1fr; gap:28px 48px; align-items:center; background:var(--white); border:1px solid var(--hair); border-radius:var(--r); padding:32px 36px; }
  .rules-intro { display:flex; gap:18px; align-items:center; }
  .timeline { list-style:none; margin:0; padding:0; display:flex; position:relative; }
  .timeline::before { content:""; position:absolute; left:12px; right:12px; top:11px; height:1px; background:var(--hair-strong); }
  .timeline li { flex:1; text-align:center; position:relative; font-size:.84rem; color:var(--mauve); }
  .timeline li::before { content:""; display:block; width:12px; height:12px; border-radius:50%; background:var(--plum); margin:5px auto 10px; position:relative; }
  .timeline li.first::before { background:var(--saffron); box-shadow:0 0 0 5px rgba(217,144,61,.2); }
  .timeline li.give::before { background:var(--linen); border:2px solid var(--clay); }
  .timeline b { display:block; font-family:var(--serif); font-weight:450; font-size:1.05rem; color:var(--espresso); }
  .voices-wrap { background:var(--oat); }
  .voices { display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:44px; }
  .voice { background:var(--linen); border:1px solid var(--hair); border-radius:var(--r); padding:34px 30px; display:flex; flex-direction:column; }
  .voice .k { font-family:var(--serif); font-style:italic; color:var(--clay); }
  .voice h3 { font-size:1.6rem; margin:6px 0 4px; }
  .voice .feel { color:var(--mauve); font-size:.92rem; margin-bottom:22px; }
  .voice blockquote { margin:0 0 18px; font-family:var(--serif); font-style:italic; font-size:1.15rem; line-height:1.5; font-weight:350; }
  .voice .lbl { font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700; color:var(--mauve); display:block; margin-bottom:6px; }
  .pricing { display:grid; grid-template-columns:1fr 1.1fr; gap:64px; align-items:center; }
  .plan { background:var(--plum); color:var(--linen); border-radius:32px; padding:48px 44px; position:relative; overflow:hidden; isolation:isolate; }
  .plan::after { content:""; position:absolute; inset:0; background-image:var(--grain); opacity:.1; mix-blend-mode:overlay; pointer-events:none; z-index:-1; }
  .plan .tag { margin-bottom:18px; }
  .plan h3 { font-size:2rem; color:var(--linen); margin-bottom:6px; }
  .plan .price { font-family:var(--serif); font-size:2.2rem; font-weight:340; color:var(--champagne); margin:18px 0 4px; line-height:1.1; }
  .plan .trial { color:#EADCE6; margin:0 0 24px; }
  .plan ul { list-style:none; padding:0; margin:0 0 30px; }
  .plan li { padding:10px 0 10px 28px; border-top:1px solid rgba(243,227,195,.18); position:relative; color:#F1E4DA; }
  .plan li::before { content:""; position:absolute; left:2px; top:19px; width:10px; height:10px; border-radius:50%; background:var(--gold); }
  .plan .plan-wren { position:absolute; right:26px; top:26px; }
  .faq-section { padding-block:110px 120px; }
  .faq { max-width:820px; margin:0 auto; }
  .faq details { border-top:1px solid var(--hair); padding:22px 0; }
  .faq details:last-of-type { border-bottom:1px solid var(--hair); }
  .faq summary { cursor:pointer; font-family:var(--serif); font-size:1.3rem; list-style:none; display:flex; justify-content:space-between; gap:20px; }
  .faq summary::-webkit-details-marker { display:none; }
  .faq summary::after { content:"+"; flex:none; align-self:flex-start; width:1em; height:1em; text-align:center; font-family:var(--sans); color:var(--clay); font-size:1.4rem; line-height:1; transition:transform .4s var(--ease); }
  .faq details[open] summary::after { transform:rotate(45deg); }
  .faq p { margin:12px 0 0; color:var(--mauve); max-width:60ch; }
  .closing { text-align:center; background:linear-gradient(180deg, var(--linen) 0%, var(--blush) 60%, var(--champagne) 100%); padding-block:110px; padding-inline:var(--gutter-l) var(--gutter-r); }
  .closing .wren { margin-bottom:12px; }
  .foot-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:32px; align-items:start; }
  .foot-grid h2 { font-family:var(--sans); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700; color:var(--heather); margin:0 0 12px; }
  .foot-grid ul { list-style:none; margin:0; padding:0; }
  .foot-grid li { padding:4px 0; }
  .foot-brand { display:flex; align-items:center; gap:14px; }
  @media (max-width:960px) {
    .ritual { grid-template-columns:repeat(2, 1fr); }
    .voices, .pricing { grid-template-columns:1fr; }
    .rules { grid-template-columns:1fr; }
    .foot-grid { grid-template-columns:1fr 1fr; }
    .foot-grid > :first-child { grid-column:1 / -1; }
  }
  @media (max-width:640px) {
    .hero { min-height:auto; }
    .hero-body { padding-block:24px 200px; }
    .sun { width:240px; height:240px; margin-left:-120px; bottom:-120px; }
    .hero-wren { margin-left:-55px; --wren-size:110px !important; }
    section.block, .faq-section { padding-block:72px; }
    .ritual { grid-template-columns:1fr; }
    .rules { padding:24px 18px; }
    .timeline li { font-size:.72rem; }
    .timeline b { font-size:.86rem; }
    .plan { padding:36px 24px; border-radius:24px; }
    .plan .plan-wren { display:none; }
    .closing { padding-block:72px; }
  }
