@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Work+Sans:wght@400;500;600&display=swap');

  :root{
    --ink:#241F1A;
    --paper:#EEE9DF;
    --paper-soft:#F6F2E9;
    --line: rgba(36,31,26,0.16);
    --bodas:#8C3B4A;
    --corporativo:#2E3A46;
    --fiestas:#B9812E;
    --sociales:#5B6E52;
    --accent: var(--bodas);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Work Sans', sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  .serif{font-family:'Fraunces', serif;}
  img{max-width:100%;display:block;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 24px;}
  a{color:inherit;}
  button{font-family:inherit; cursor:pointer;}

  /* NAV */
  header.nav{
    position:sticky; top:0; z-index:50;
    background:rgba(238,233,223,0.9);
    backdrop-filter: blur(6px);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{display:flex; align-items:center; justify-content:space-between; padding:18px 0; gap:20px;}
  .brand{font-size:1.3rem; letter-spacing:-0.02em;}
  .nav-links{display:flex; gap:32px; font-size:0.92rem;}
  .nav-links button{background:none;border:none;color:inherit;padding:4px 0;border-bottom:2px solid transparent;transition:border-color .2s ease, opacity .2s ease;}
  .nav-links button:hover{opacity:.6;}
  @media (max-width:720px){ .nav-links{display:none;} }
  .social-row{display:flex; gap:14px; align-items:center; flex-shrink:0;}
  .social-link{color:var(--ink); opacity:0.75; display:flex; transition:opacity .2s ease, color .2s ease;}
  .social-link:hover{opacity:1; color:var(--accent);}
  footer .social-link{color:var(--ink);}

  /* HERO */
  .hero{
    position:relative;
    min-height:88vh;
    display:flex;
    align-items:flex-end;
    overflow:hidden;
  }
  .hero-slide{
    position:absolute; inset:0;
    background-size:cover; background-position:center;
    opacity:0;
    transform:scale(1.08);
    transition:opacity 1.6s ease;
    animation: kenburns 16s ease-in-out infinite;
  }
  .hero-slide.active{opacity:1;}
  @keyframes kenburns{
    0%{transform:scale(1.08) translate(0,0);}
    50%{transform:scale(1.16) translate(-1%,-1%);}
    100%{transform:scale(1.08) translate(0,0);}
  }
  .hero-scrim{
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(20,16,12,0.15) 0%, rgba(20,16,12,0.55) 70%, rgba(20,16,12,0.78) 100%);
  }
  .hero-content{
    position:relative; z-index:2; color:#F6F2E9;
    width:100%; padding:64px 24px 56px;
    max-width:1180px; margin:0 auto;
  }
  .hero-dots{display:flex; gap:8px; margin-bottom:22px;}
  .hero-dot{width:26px; height:3px; background:rgba(246,242,233,0.35); transition:background .3s ease;}
  .hero-dot.active{background:#F6F2E9;}
  .hero h1{
    font-size:clamp(2.2rem, 5vw, 4rem);
    font-weight:500; line-height:1.05; margin:0 0 20px; max-width:14ch;
    opacity:0; transform:translateY(16px);
    animation: rise .9s ease forwards .2s;
  }
  .hero p{
    max-width:46ch; font-size:1.05rem; opacity:0.9; margin:0 0 30px;
    opacity:0; transform:translateY(16px);
    animation: rise .9s ease forwards .4s;
  }
  .hero-ctas{display:flex; flex-wrap:wrap; gap:14px;
    opacity:0; transform:translateY(16px);
    animation: rise .9s ease forwards .6s;
  }
  @keyframes rise{ to{ opacity:1; transform:translateY(0);} }
  .btn{
    padding:13px 26px; font-size:0.92rem; border:1px solid transparent; transition:background .2s ease, color .2s ease, border-color .2s ease;
  }
  .btn-primary{background:#F6F2E9; color:var(--ink);}
  .btn-primary:hover{background:var(--accent); color:#F6F2E9;}
  .btn-ghost{border-color:rgba(246,242,233,0.6); color:#F6F2E9; background:transparent;}
  .btn-ghost:hover{border-color:#F6F2E9; background:rgba(246,242,233,0.12);}
  .btn-dark{background:var(--ink); color:var(--paper);}
  .btn-dark:hover{background:var(--accent); color:#fff;}
  .btn-outline{border-color:var(--line); background:transparent; color:var(--ink);}
  .btn-outline:hover{border-color:var(--ink);}

  /* SECTION helpers */
  section{padding:88px 0;}
  .section-head{margin-bottom:44px; max-width:560px;}
  .eyebrow-free{font-size:0.85rem; opacity:0.55; margin:0 0 8px;}
  h2.serif{font-size:clamp(1.8rem,3.4vw,2.6rem); font-weight:500; margin:0 0 12px;}
  .lede{opacity:0.72; margin:0; font-size:1rem; max-width:46ch;}
  .reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
  .reveal.in-view{opacity:1; transform:translateY(0);}

  /* CATALOG */
  .cat-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}
  @media (max-width:820px){ .cat-grid{grid-template-columns:1fr;} }
  .cat-card{
    position:relative; border-radius:2px; overflow:hidden; min-height:300px;
    display:flex; flex-direction:column; justify-content:flex-end;
    background-size:cover; background-position:center;
    cursor:pointer;
  }
  .cat-card::before{
    content:''; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(20,16,12,0.05) 30%, rgba(20,16,12,0.82) 100%);
    transition:background .3s ease;
  }
  .cat-card::after{
    content:''; position:absolute; left:0; right:0; bottom:0; height:4px;
    background:var(--card-color); transform:scaleX(0); transform-origin:left; transition:transform .35s ease;
  }
  .cat-card:hover::after{transform:scaleX(1);}
  .cat-card img.zoomimg{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    transform:scale(1.02); transition:transform .6s ease;
  }
  .cat-card:hover img.zoomimg{transform:scale(1.1);}
  .cat-card-body{position:relative; z-index:2; padding:26px; color:#F6F2E9;}
  .cat-tag{display:inline-block; font-size:0.78rem; padding:4px 10px; background:var(--card-color); color:#fff; margin-bottom:10px;}
  .cat-card-body h3{font-size:1.5rem; margin:0 0 6px; font-weight:500;}
  .cat-card-body p{margin:0 0 14px; opacity:0.85; font-size:0.92rem; max-width:34ch;}
  .cat-card-body .from{font-size:0.85rem; opacity:0.75;}

  /* GALLERY strip */
  .gallery-strip{display:grid; grid-template-columns:repeat(6,1fr); gap:8px;}
  @media (max-width:820px){ .gallery-strip{grid-template-columns:repeat(3,1fr);} }
  .gallery-strip figure{margin:0; overflow:hidden; aspect-ratio:3/4; position:relative;}
  .gallery-strip img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
  .gallery-strip figure:hover img{transform:scale(1.08);}

  /* BUILDER */
  .builder-shell{border:1px solid var(--line); background:var(--paper-soft); padding:8px;}
  .steps-nav{display:flex; gap:6px; margin-bottom:6px;}
  .steps-nav div{flex:1; height:3px; background:var(--line); overflow:hidden;}
  .steps-nav div span{display:block; height:100%; width:0%; background:var(--accent); transition:width .4s ease;}
  .builder-inner{padding:30px;}
  @media (max-width:640px){ .builder-inner{padding:20px;} }
  .step-label{font-size:0.85rem; opacity:0.55; margin:0 0 14px; letter-spacing:0.01em;}
  .tabs{display:flex; flex-wrap:wrap; gap:4px; border-bottom:1px solid var(--line); margin-bottom:36px;}
  .tab{padding:12px 18px; font-size:0.92rem; background:none; border:none; border-bottom:3px solid transparent; color:inherit; opacity:0.6; transition:opacity .2s ease, border-color .2s ease;}
  .tab.active{opacity:1; border-color:var(--accent); font-weight:500;}

  .pkg-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:36px;}
  @media (max-width:760px){ .pkg-grid{grid-template-columns:1fr;} }
  .pkg-card{
    text-align:left; border:1px solid var(--line); background:transparent; padding:20px; transition:border-color .2s ease, box-shadow .2s ease;
  }
  .pkg-card.active{border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent);}
  .pkg-card h4{margin:0 0 8px; font-size:1.1rem; font-weight:500;}
  .pkg-card p{margin:0 0 14px; font-size:0.88rem; opacity:0.7; min-height:2.6em;}
  .pkg-card .price{font-size:0.92rem;}

  .guests-row{display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-bottom:36px;}
  .guests-row input[type=number]{
    width:110px; padding:11px 14px; border:1px solid var(--line); background:transparent; font-size:0.95rem; font-family:inherit; color:inherit;
  }
  .presets{display:flex; gap:8px;}
  .preset-btn{padding:8px 14px; border:1px solid var(--line); background:transparent; font-size:0.86rem; transition:border-color .2s ease, background .2s ease;}
  .preset-btn:hover{border-color:var(--accent);}

  .extras-list{margin-bottom:0;}
  .extra-row{
    display:flex; align-items:center; justify-content:space-between; gap:14px;
    padding:14px 4px; border-top:1px solid var(--line); font-size:0.92rem; cursor:pointer;
  }
  .extras-list .extra-row:last-child{border-bottom:1px solid var(--line);}
  .extra-row .left{display:flex; align-items:center; gap:12px;}
  .extra-row input{accent-color:var(--accent); width:16px; height:16px;}
  .extra-row .price{opacity:0.6; font-size:0.88rem; white-space:nowrap;}

  .summary{border:1px solid var(--line); background:#fff; padding:28px; margin-top:36px;}
  .summary-head{display:flex; align-items:center; gap:10px; margin-bottom:16px;}
  .swatch{width:12px; height:12px; border-radius:2px; background:var(--accent);}
  .summary-line{display:flex; justify-content:space-between; font-size:0.9rem; opacity:0.75; padding:4px 0;}
  .summary-total{
    display:flex; justify-content:space-between; align-items:baseline; margin-top:14px; padding-top:14px; border-top:1px solid var(--line);
  }
  .summary-total .num{font-size:2rem; font-family:'Fraunces',serif; transition:color .2s ease;}

  form.request{border:1px solid var(--line); background:#fff; padding:28px; margin-top:20px; display:grid; grid-template-columns:1fr 1fr; gap:14px;}
  @media (max-width:640px){ form.request{grid-template-columns:1fr;} }
  form.request .full{grid-column:1/-1;}
  form.request input, form.request textarea{
    width:100%; padding:12px 14px; border:1px solid var(--line); background:transparent; font-family:inherit; font-size:0.92rem; color:inherit;
  }
  form.request textarea{resize:vertical;}
  .confirm-box{border:1px solid var(--line); background:#fff; padding:28px; margin-top:20px;}

  footer{border-top:1px solid var(--line); padding:48px 0;}
  .footer-inner{display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px; font-size:0.9rem; opacity:0.75;}

  input:focus, button:focus, textarea:focus{outline:2px solid var(--accent); outline-offset:2px;}
  @media (prefers-reduced-motion: reduce){
    *{animation:none !important; transition:none !important;}
  }