
  :root{
    --marfil:#FAF8F3; --crema:#F2ECE3; --taupe:#8A7968; --olivo:#8B947E; --olivo-dk:#6F7867;
    --blush:#EADCD3; --carbon:#3E3E3E; --oro:#B99B67; --line:#E4DBCF;
    --serif:'Playfair Display',Georgia,serif; --sans:'Montserrat',system-ui,sans-serif; --script:'Cormorant Garamond',serif;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:var(--sans);color:var(--carbon);background:var(--marfil);font-weight:300;line-height:1.65;-webkit-font-smoothing:antialiased}
  img{max-width:100%;display:block}
  a{color:inherit;text-decoration:none}
  h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.12;color:var(--carbon)}
  .wrap{max-width:1200px;margin:0 auto;padding:0 28px}
  .eyebrow{font-size:.68rem;letter-spacing:.34em;text-transform:uppercase;color:var(--taupe);font-weight:500}
  .btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500;padding:15px 34px;border-radius:2px;transition:.3s;cursor:pointer;border:1px solid transparent}
  .btn-olive{background:var(--olivo);color:#fff}
  .btn-olive:hover{background:var(--olivo-dk)}
  .btn-ghost{border-color:var(--carbon);color:var(--carbon);background:transparent}
  .btn-ghost:hover{background:var(--carbon);color:#fff}
  .btn-outline-cream{border-color:rgba(255,255,255,.6);color:#fff}
  .btn-outline-cream:hover{background:#fff;color:var(--olivo-dk)}
  .link-arrow{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--carbon);font-weight:500;display:inline-flex;align-items:center;gap:10px;transition:.3s}
  .link-arrow:hover{gap:16px;color:var(--taupe)}
  .italic{font-style:italic}

  /* placeholder cálido con motivo botánico */
  .ph{position:relative;background:linear-gradient(135deg,var(--crema),var(--blush));overflow:hidden}
  .ph::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%238B947E' stroke-width='1.1' stroke-linecap='round' opacity='.42'%3E%3Cpath d='M60 96 C60 74 60 52 60 30'/%3E%3Cpath d='M60 40 C50 34 42 36 38 30'/%3E%3Cpath d='M60 40 C70 34 78 36 82 30'/%3E%3Cpath d='M60 54 C49 49 40 51 35 45'/%3E%3Cpath d='M60 54 C71 49 80 51 85 45'/%3E%3Cpath d='M60 68 C50 63 43 65 39 60'/%3E%3Cpath d='M60 68 C70 63 77 65 81 60'/%3E%3Cpath d='M60 82 C52 78 46 79 43 75'/%3E%3Cpath d='M60 82 C68 78 74 79 77 75'/%3E%3C/g%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:44%}
  .ph .ph-label{position:absolute;left:0;right:0;bottom:16px;text-align:center;font-family:var(--script);font-style:italic;font-size:1.15rem;color:var(--taupe);opacity:.8}
  .ph.has-img::after{display:none}
  .ph>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .cel .lucide,.cel svg{width:42px;height:42px;stroke:var(--taupe);fill:none;stroke-width:1.3}

  /* ===== HEADER ===== */
  header{position:sticky;top:0;z-index:50;background:rgba(250,248,243,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav{display:flex;align-items:center;justify-content:space-between;height:84px}
  .logo{font-family:var(--serif);letter-spacing:.14em;font-size:1.5rem;color:var(--taupe);line-height:1}
  .logo small{display:block;font-family:var(--sans);font-size:.44rem;letter-spacing:.36em;color:var(--taupe);margin-top:5px;font-weight:400}
  .menu{display:flex;gap:30px;list-style:none}
  .menu a{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:400;color:var(--carbon);transition:.25s}
  .menu a:hover{color:var(--taupe)}
  .nav-icons{display:flex;gap:20px;align-items:center;color:var(--carbon)}
  .nav-icons svg{width:19px;height:19px;stroke:var(--carbon);fill:none;stroke-width:1.4;cursor:pointer}
  .burger{display:none;background:none;border:none;cursor:pointer;padding:6px}
  .burger span{display:block;width:23px;height:1.6px;background:var(--carbon);margin:5px 0;transition:.3s}

  /* ===== HERO ===== */
  .hero{position:relative;padding:0;min-height:min(90vh,780px);display:flex;align-items:center;background:url("img/hero.jpg") center right/cover no-repeat}
  .hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(250,248,243,.97) 0%,rgba(250,248,243,.84) 30%,rgba(250,248,243,.38) 52%,rgba(250,248,243,0) 72%)}
  .hero .wrap{position:relative;z-index:2;width:100%}
  .hero-txt{display:flex;flex-direction:column;justify-content:center;max-width:540px;padding:60px 0}
  .hero-txt .eyebrow{margin-bottom:26px}
  .hero-txt h1{font-size:clamp(2.6rem,5.2vw,4.4rem);letter-spacing:-.01em}
  .hero-rule{width:54px;height:1px;background:var(--taupe);margin:30px 0 26px}
  .hero-txt p{max-width:400px;color:#5c5750;margin-bottom:36px;font-size:1.02rem}
  .hero-cta{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
  .hero-dots{position:absolute;right:34px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;font-size:.62rem;letter-spacing:.2em;color:var(--taupe);z-index:3}
  .hero-dots span{opacity:.45}.hero-dots span.on{opacity:1;color:var(--carbon)}

  /* ===== CELEBRACIÓN ===== */
  section{padding:90px 0}
  .sec-title{text-align:center;margin-bottom:56px}
  .celebra{background:var(--marfil)}
  .celebra-row{display:grid;grid-template-columns:repeat(6,1fr);gap:24px}
  .cel{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
  .cel svg{width:44px;height:44px;stroke:var(--taupe);fill:none;stroke-width:1.2}
  .cel span{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--carbon)}

  /* ===== TIENDA ===== */
  .tienda{background:var(--crema)}
  .tienda-head{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:center;margin-bottom:52px}
  .tienda-head h2{font-size:clamp(2rem,3.4vw,2.9rem)}
  .tienda-head .rule{width:44px;height:1px;background:var(--taupe);margin:22px 0}
  .tienda-head p{color:#5c5750;max-width:320px;margin-bottom:26px}
  .prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
  .prod{display:block;transition:.35s}
  .prod:hover{transform:translateY(-5px)}
  .prod .ph{aspect-ratio:4/5;border-radius:2px}
  .prod .name{margin-top:16px;text-align:center;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--carbon)}
  .prod .price{text-align:center;font-family:var(--serif);color:var(--taupe);font-size:1.05rem;margin-top:5px}

  /* ===== PERSONALIZADO ===== */
  .perso{background:var(--olivo);color:#fff;padding:0}
  .perso-grid{display:grid;grid-template-columns:1fr 1.3fr}
  .perso-img{min-height:520px;position:relative}
  .perso-img .ph{position:absolute;inset:0;background:linear-gradient(135deg,#9aa28d,#7c866f)}
  .perso-img .ph::after{opacity:.3;filter:brightness(3)}
  .perso-txt{padding:80px 70px;display:flex;flex-direction:column;justify-content:center}
  .perso-txt .eyebrow{color:rgba(255,255,255,.7);margin-bottom:22px}
  .perso-txt h2{color:#fff;font-size:clamp(2.1rem,3.4vw,3rem);margin-bottom:22px}
  .perso-txt>p{color:rgba(255,255,255,.85);max-width:380px;margin-bottom:36px}
  .steps{display:flex;flex-direction:column;gap:20px;margin-bottom:40px}
  .step{display:flex;gap:20px;align-items:baseline}
  .step b{font-family:var(--serif);font-size:1.05rem;color:rgba(255,255,255,.6);min-width:28px}
  .step span{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.92)}

  /* ===== QUOTE ===== */
  .quote{background:var(--marfil)}
  .quote-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}
  .quote blockquote{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,2.6vw,2.15rem);line-height:1.35;color:var(--carbon)}
  .quote .sprig{width:34px;margin-bottom:22px}
  .quote-imgs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .quote-imgs .ph{aspect-ratio:3/4;border-radius:2px}

  /* ===== NOSOTROS ===== */
  .nosotros{background:var(--crema);text-align:center}
  .nosotros .wrap{max-width:760px}
  .nosotros h2{font-size:clamp(2rem,3.4vw,2.8rem);margin-bottom:24px}
  .nosotros p{color:#5c5750;font-size:1.05rem;margin-bottom:16px}

  /* ===== CONTACTO ===== */
  .contacto{background:var(--marfil);text-align:center}
  .contacto h2{font-size:clamp(2rem,3.4vw,2.8rem);margin-bottom:16px}
  .contacto p{color:#5c5750;margin-bottom:32px}
  .contacto .btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

  /* ===== FOOTER ===== */
  footer{background:var(--crema);border-top:1px solid var(--line);padding:56px 0 28px}
  .foot-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap;padding-bottom:36px;border-bottom:1px solid var(--line)}
  .foot-logo{font-family:var(--serif);letter-spacing:.14em;font-size:1.4rem;color:var(--taupe)}
  .foot-logo small{display:block;font-family:var(--sans);font-size:.44rem;letter-spacing:.34em;margin-top:5px}
  .foot-nav{display:flex;gap:24px;flex-wrap:wrap}
  .foot-nav a{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase}
  .socials{display:flex;gap:16px}
  .socials svg{width:19px;height:19px;stroke:var(--taupe);fill:none;stroke-width:1.4}
  .foot-script{font-family:var(--script);font-style:italic;font-size:1.4rem;color:var(--taupe)}
  .foot-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-top:24px;font-size:.68rem;letter-spacing:.12em;color:var(--taupe);text-transform:uppercase}

  @media(max-width:900px){
    .menu,.nav-icons .ico-hide{display:none}
    .burger{display:block}
    .tienda-head,.perso-grid,.quote-grid{grid-template-columns:1fr}
    .hero{min-height:78vh;background-position:center center}
    .hero::before{background:linear-gradient(180deg,rgba(250,248,243,.55),rgba(250,248,243,.9) 55%,rgba(250,248,243,.98))}
    .hero-txt{padding:40px 0;max-width:none}
    .hero-dots{display:none}
    .celebra-row{grid-template-columns:repeat(3,1fr);gap:34px 16px}
    .prod-grid{grid-template-columns:repeat(2,1fr)}
    .perso-img{min-height:340px}
    .perso-txt{padding:52px 28px}
    .quote-imgs{margin-top:10px}
    .menu.open{display:flex;position:absolute;top:84px;left:0;right:0;flex-direction:column;background:var(--marfil);border-bottom:1px solid var(--line);padding:20px 28px;gap:18px}
  }

  /* ===== STORE ===== */
  .store{padding:120px 0 90px;background:var(--marfil)}
  .store-head{text-align:center;margin-bottom:56px}
  .store-head h1{font-size:clamp(2.4rem,4vw,3.4rem);margin-top:14px}
  .store-head p{color:#5c5750;max-width:540px;margin:18px auto 0}
  .store-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 26px}
  .pcard{display:block;transition:.35s}
  .pcard:hover{transform:translateY(-5px)}
  .pcard .ph{aspect-ratio:4/5;border-radius:2px}
  .pcard .name{margin-top:16px;text-align:center;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--carbon)}
  .pcard .price{text-align:center;font-family:var(--serif);color:var(--taupe);font-size:1.02rem;margin-top:6px}
  .price-old{text-decoration:line-through;color:#b9ad9c;font-size:.82em;margin-right:8px}
  .pcard .ph{position:relative}
  .promo-tag{position:absolute;top:12px;left:12px;z-index:2;background:var(--olivo);color:#fff;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:999px}
  .pd-promo{background:var(--crema);color:#6b6459;font-size:.78rem;letter-spacing:.02em;line-height:1.6;padding:12px 16px;border-radius:3px;margin:0 0 22px}
  .pd-promo::before{content:"✦ ";color:var(--olivo)}
  /* product detail */
  .pd{padding:120px 0 40px;background:var(--marfil)}
  .pd-crumb{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--taupe);margin-bottom:34px}
  .pd-crumb a:hover{color:var(--carbon)}
  .pd-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
  .pd-img .ph{aspect-ratio:4/5;border-radius:3px}
  .pd-info h1{font-size:clamp(2.1rem,3.6vw,3rem)}
  .pd-price{font-family:var(--serif);font-size:1.55rem;color:var(--taupe);margin:16px 0 22px}
  .pd-desc{color:#5c5750;font-size:1.05rem;line-height:1.75;margin-bottom:32px}
  .field{margin-bottom:22px}
  .field label{display:block;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--taupe);margin-bottom:12px}
  .chips{display:flex;flex-wrap:wrap;gap:10px}
  .chip-c{cursor:pointer;font-size:.72rem;letter-spacing:.06em;padding:9px 18px;border:1px solid var(--line);border-radius:999px;background:#fff;transition:.25s}
  .chip-c.on,.chip-c:hover{border-color:var(--olivo);background:var(--olivo);color:#fff}
  .field input{width:100%;max-width:260px;font-family:var(--sans);font-size:.9rem;padding:12px 16px;border:1px solid var(--line);border-radius:2px;background:#fff;color:var(--carbon)}
  .field input:focus{outline:none;border-color:var(--olivo)}
  .pd-note{font-family:var(--script);font-style:italic;font-size:1.2rem;color:var(--taupe);margin-top:24px}
  .related{background:var(--crema);padding:90px 0}
  .related h2{text-align:center;font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:44px}
  @media(max-width:900px){
    .store-grid{grid-template-columns:repeat(2,1fr)}
    .pd-grid{grid-template-columns:1fr;gap:30px}
  }
