:root{
    --cream:#F5F1EB;
    --sand:#E7DED2;
    --sage:#A3B4A2;
    --sage-deep:#869a85;
    --terra:#D6A77A;        /* soft, for illustration fills */
    --clay:#BC5E3A;         /* stronger accent for life */
    --clay-deep:#9c4a2c;
    --olive:#434C3A;
    --olive-soft:#5b6650;
    --wa:#25D366;
    --wa-deep:#1ea952;
    --ink:#2E2E2E;
    --ink-soft:#5d5a54;
    --line:#d9cfc0;
    --shadow:rgba(46,46,46,.10);
    --maxw:1140px;
    --serif:"Playfair Display",Georgia,"Times New Roman",serif;
    --sans:"Lato","Segoe UI",system-ui,sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:var(--sans);color:var(--ink);background:var(--cream);line-height:1.65;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  h1,h2,h3,.serif{font-family:var(--serif)}
  h2{font-size:clamp(1.9rem,4.6vw,2.9rem);font-weight:600;line-height:1.12;color:var(--ink)}
  h3{font-weight:600}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}
  section{padding:84px 0}
  .eyebrow{font-family:var(--sans);text-transform:uppercase;letter-spacing:3px;font-size:.74rem;font-weight:700;color:var(--clay)}
  .lead{color:var(--ink-soft);font-size:1.08rem;max-width:60ch}
  .center{text-align:center}
  .sec-head{max-width:640px;margin:0 auto 52px}
  .sec-head.center h2{margin-top:10px}
  .sec-head.center p{margin:14px auto 0}

  /* buttons */
  .btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-weight:700;font-size:.98rem;
    padding:14px 26px;border-radius:40px;border:none;cursor:pointer;transition:transform .14s,box-shadow .14s;letter-spacing:.2px}
  .btn svg{width:18px;height:18px}
  .btn-primary{background:var(--clay);color:#fff;box-shadow:0 6px 18px rgba(156,74,44,.32)}
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(156,74,44,.4)}
  .btn-ghost{background:transparent;color:var(--olive);border:1.6px solid var(--sage)}
  .btn-ghost:hover{background:var(--sage);color:#fff}
  .btn-wa{background:var(--wa);color:#fff;box-shadow:0 6px 18px rgba(37,211,102,.32)}
  .btn-wa:hover{transform:translateY(-2px);background:var(--wa-deep)}
  .btn-olive{background:var(--olive);color:#fff}

  /* nav */
  nav{position:sticky;top:0;z-index:60;background:rgba(245,241,235,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 26px;max-width:var(--maxw);margin:0 auto}
  .brandmark{display:flex;align-items:center;gap:11px;flex-shrink:0}
  .brandmark .wordmark{font-family:var(--serif);font-size:1.35rem;font-weight:600;letter-spacing:1.5px;color:var(--olive)}
  .nav-links{display:flex;gap:24px;align-items:center;font-size:.93rem;font-weight:700;color:var(--ink-soft)}
  .nav-links a:hover{color:var(--clay)}
  .nav-right{display:flex;align-items:center;gap:14px;flex-shrink:0}
  .lang{display:inline-flex;border:1.4px solid var(--sage);border-radius:30px;overflow:hidden;font-weight:700;font-size:.8rem}
  .lang button{border:none;background:transparent;padding:6px 12px;cursor:pointer;color:var(--ink-soft);font-family:var(--sans);font-weight:700}
  .lang button.active{background:var(--sage);color:#fff}
  .nav-cta{padding:10px 20px;font-size:.9rem}
  @media(max-width:900px){.nav-links{display:none}}
  @media(max-width:520px){.nav-cta span{display:none}.nav-cta::after{content:"WhatsApp"}}

  /* hero */
  .hero{background:linear-gradient(180deg,var(--cream) 0%,var(--sand) 100%);position:relative;overflow:hidden}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding:64px 0 78px}
  .hero h1{font-size:clamp(2.5rem,6vw,4.1rem);font-weight:600;line-height:1.05;margin:16px 0 14px;color:var(--ink)}
  .hero .sub{font-size:1.22rem;color:var(--olive);font-weight:300;max-width:34ch}
  .hero .btn-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
  .hero-art{position:relative}
  .media svg,.hero-art svg{width:100%;height:auto;display:block}
  .hero-art svg{filter:drop-shadow(0 24px 40px rgba(46,46,46,.14))}
  .photo-tag{position:absolute;bottom:10px;right:10px;background:rgba(67,76,58,.82);color:#fff;font-size:.62rem;letter-spacing:.5px;padding:4px 9px;border-radius:20px;font-weight:700}
  @media(max-width:860px){.hero-grid{grid-template-columns:1fr;gap:28px;text-align:center;padding:44px 0 56px}
    .hero .sub{margin-left:auto;margin-right:auto}.hero .btn-row{justify-content:center}.hero-art{max-width:420px;margin:0 auto;order:-1}}

  /* alternating split rows */
  .split{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}
  .split .media{position:relative}
  .split .media svg{border-radius:18px;filter:drop-shadow(0 16px 30px rgba(46,46,46,.10))}
  .split.reverse .media{order:-1}
  @media(max-width:860px){.split{grid-template-columns:1fr;gap:32px}.split.reverse .media{order:0}.split .media{max-width:440px;margin:0 auto}}
  .emph{font-family:var(--serif);font-size:1.45rem;color:var(--clay);font-style:italic;margin-top:20px;line-height:1.35}
  .closing-line{margin-top:20px;font-weight:700;color:var(--olive)}

  .sand{background:var(--sand)}
  .creamy{background:var(--cream)}

  /* chips (who) */
  .chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
  .chip{display:flex;align-items:center;gap:9px;background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:12px 16px;font-weight:700;font-size:.94rem;box-shadow:0 3px 10px var(--shadow)}
  .chip .dot{width:9px;height:9px;border-radius:50%;background:var(--clay);flex-shrink:0}

  /* steps (how) */
  .steps{display:flex;flex-direction:column;gap:14px;margin-top:18px}
  .step{display:flex;gap:16px;align-items:flex-start}
  .step .num{font-family:var(--serif);font-size:1.3rem;color:#fff;background:var(--clay);min-width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:600}
  .step p{color:var(--ink-soft);padding-top:6px}

  /* benefits list (brings) */
  .benefits{display:flex;flex-direction:column;gap:18px;margin-top:18px}
  .benefit{display:flex;gap:16px;align-items:center}
  .benefit .ico{width:52px;height:52px;border-radius:50%;background:var(--sand);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:inset 0 0 0 2px var(--sage)}
  .benefit .ico svg{width:24px;height:24px;stroke:var(--olive)}
  .benefit h3{font-size:1.12rem}

  /* about me */
  .about-card{display:grid;grid-template-columns:.8fr 1.2fr;gap:54px;align-items:center}
  .about-card .portrait{position:relative}
  .about-card .portrait svg{width:100%;height:auto}
  .about-sign{font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--clay);margin-top:18px}
  @media(max-width:860px){.about-card{grid-template-columns:1fr;gap:30px}.about-card .portrait{max-width:320px;margin:0 auto}}

  /* pull quote band */
  .quoteband{background:var(--olive);color:var(--cream);text-align:center}
  .quoteband .wrap{padding-top:70px;padding-bottom:70px}
  .quoteband p{font-family:var(--serif);font-size:clamp(1.5rem,3.6vw,2.3rem);font-style:italic;line-height:1.4;max-width:20ch;margin:0 auto}
  .quoteband .leaf{margin:0 auto 18px;display:block}

  /* pricing */
  .price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
  .price-card{background:var(--cream);border:1px solid var(--line);border-radius:22px;padding:34px 28px;display:flex;flex-direction:column;box-shadow:0 8px 24px var(--shadow);position:relative;transition:transform .16s}
  .price-card:hover{transform:translateY(-5px)}
  .price-card.featured{border:2px solid var(--clay);box-shadow:0 14px 34px rgba(156,74,44,.2)}
  .ribbon{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--clay);color:#fff;font-size:.68rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:6px 16px;border-radius:20px;white-space:nowrap}
  .price-card .ptitle{font-family:var(--serif);font-size:1.4rem;font-weight:600}
  .price-card .pmeta{color:var(--clay);font-weight:700;font-size:.86rem;text-transform:uppercase;letter-spacing:1px;margin-top:4px}
  .price-card .amount{font-family:var(--serif);font-size:3rem;font-weight:600;margin:14px 0 6px;color:var(--ink)}
  .price-card .pdesc{color:var(--ink-soft);font-size:.95rem;flex:1}
  .price-card .btn{margin-top:22px;justify-content:center}
  .price-note{text-align:center;margin-top:26px;color:var(--ink-soft);font-size:.92rem;display:flex;align-items:center;justify-content:center;gap:8px}
  @media(max-width:820px){.price-grid{grid-template-columns:1fr;max-width:420px;margin:0 auto}.price-card.featured{order:-1}}

  /* do / dont */
  .dodont{display:grid;grid-template-columns:1fr 1fr;gap:26px}
  .panel{background:var(--cream);border-radius:20px;padding:34px 30px;box-shadow:0 6px 18px var(--shadow)}
  .panel.do{border-left:4px solid var(--sage)}
  .panel.dont{border-left:4px solid var(--clay)}
  .panel h3{font-size:1.4rem;margin-bottom:18px;display:flex;align-items:center;gap:10px}
  .panel ul{list-style:none;display:flex;flex-direction:column;gap:13px}
  .panel li{display:flex;align-items:flex-start;gap:12px;font-size:1rem}
  .panel li svg{width:20px;height:20px;flex-shrink:0;margin-top:3px}
  @media(max-width:720px){.dodont{grid-template-columns:1fr}}

  /* values */
  .values{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:8px}
  .value{background:var(--cream);border:1px solid var(--line);border-radius:40px;padding:12px 26px;font-family:var(--serif);font-size:1.15rem;color:var(--olive);font-weight:500}

  /* contact */
  .contact{background:var(--sand)}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
  @media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:34px}}
  .contact-actions{display:flex;flex-direction:column;gap:14px;margin:22px 0}
  .contact-btn{display:flex;align-items:center;gap:14px;background:var(--cream);border:1px solid var(--line);border-radius:16px;padding:16px 20px;font-weight:700;transition:transform .14s,border-color .14s}
  .contact-btn:hover{transform:translateX(4px);border-color:var(--sage)}
  .contact-btn.primary{background:var(--wa);color:#fff;border-color:var(--wa);box-shadow:0 8px 20px rgba(37,211,102,.3)}
  .contact-btn.primary small{color:rgba(255,255,255,.85)}
  .contact-btn.primary .ci{background:rgba(255,255,255,.2)}
  .contact-btn .ci{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
  .contact-btn .ci svg{width:21px;height:21px}
  .ci.mail{background:var(--clay)}.ci.call{background:var(--sage-deep)}
  .contact-btn small{display:block;font-weight:400;color:var(--ink-soft);font-size:.82rem}
  .meta-line{color:var(--ink-soft);font-size:.92rem;margin-top:18px}
  .socials{display:flex;gap:12px;margin-top:16px}
  .socials a{width:42px;height:42px;border-radius:50%;background:var(--olive);color:#fff;display:flex;align-items:center;justify-content:center;transition:transform .14s}
  .socials a:hover{transform:translateY(-3px);background:var(--clay)}
  .socials svg{width:20px;height:20px}

  form{background:var(--cream);border-radius:22px;padding:34px 30px;box-shadow:0 8px 24px var(--shadow)}
  form h3{font-size:1.4rem;margin-bottom:6px}
  form .fhint{color:var(--ink-soft);font-size:.9rem;margin-bottom:20px}
  .field{margin-bottom:16px}
  .field label{display:block;font-weight:700;font-size:.86rem;margin-bottom:6px}
  .field input,.field textarea{width:100%;border:1.4px solid var(--line);border-radius:12px;padding:12px 14px;font-family:var(--sans);font-size:1rem;background:#fffdfa;color:var(--ink);transition:border-color .14s}
  .field input:focus,.field textarea:focus{outline:none;border-color:var(--sage)}
  .field textarea{resize:vertical;min-height:110px}
  form .btn{width:100%;justify-content:center;margin-top:6px}
  .form-ok{display:none;background:var(--sage);color:#fff;border-radius:12px;padding:14px;text-align:center;font-weight:700;margin-top:14px}

  /* footer */
  footer{background:var(--olive);color:rgba(245,241,235,.78);text-align:center;padding:56px 0 34px}
  footer .ftag{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,3vw,1.7rem);color:var(--cream);max-width:24ch;margin:0 auto 26px;line-height:1.4}
  footer .fmark{font-family:var(--serif);letter-spacing:2px;font-size:1.1rem;color:var(--cream);margin-bottom:6px}
  .fnote{font-size:.78rem;opacity:.65;max-width:60ch;margin:16px auto 0;line-height:1.6}

  .leaf-divider{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--sage);margin-bottom:18px}
  .leaf-divider::before,.leaf-divider::after{content:"";height:1px;width:60px;background:var(--sage);opacity:.6}
  .ptag{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:rgba(67,76,58,.8);color:#fff;font-size:.6rem;letter-spacing:.5px;padding:3px 9px;border-radius:20px;font-weight:700;white-space:nowrap}
