@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,400&family=Raleway:wght@400;500;600;700&family=Inter:wght@400&display=swap');

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff}
body{-webkit-font-smoothing:antialiased}
img{display:block;max-width:none}
p{margin:0}
button,select,input{font-family:inherit;color:inherit}
a{color:inherit;text-decoration:none}

/* ---- scale-to-fit wrapper: keeps the 1440px canvas pixel-identical to Figma on any screen ---- */
.viewport{width:100%;overflow:hidden}
.canvas{
  position:relative;width:1440px;height:4474px;
  background:#fff;transform-origin:top left;
  font-family:'Raleway',sans-serif;color:#5c504c;
  overflow:hidden;
}

.abs{position:absolute}

/* ============ HERO ============ */
.bg-cream{position:absolute;left:0;top:0;width:1440px;height:831px;background:#faf8f7}

.hero-photo-mask{position:absolute;left:72px;top:0;width:521px;height:751px;overflow:hidden}
.hero-photo-mask img,.hero-photo-mask video{
  position:absolute;left:-3.5px;top:-16.6px;width:527.875px;height:791.714px;max-width:none;
  object-fit:cover;
}
.hero-photo-tint{position:absolute;left:73px;top:0;width:519px;height:751px;background:rgba(234,218,211,.6);mix-blend-mode:multiply}

.ticker-bg{position:absolute;left:96px;top:751px;width:1373px;height:80px;background:#eadad3}
.ticker{
  position:absolute;left:96px;top:776px;width:1344px;height:30px;overflow:hidden;
  font-family:'Raleway',sans-serif;font-weight:600;font-size:22px;color:#4e4e4e;
}
.ticker-track{
  display:flex;align-items:center;gap:180px;width:max-content;
  animation:ticker-scroll 20s linear infinite;
}
.ticker-track span{white-space:nowrap}
@keyframes ticker-scroll{
  from{transform:translateX(0)}
  to{transform:translateX(-1339px)}
}
@media (prefers-reduced-motion: reduce){
  .ticker-track{animation:none}
}

.logo-lezalez{position:absolute;left:736px;top:81px;width:157px;height:41px}

.badge{position:absolute;top:60px;width:156px;height:73px;overflow:hidden}
.badge img{position:absolute;max-width:none;mix-blend-mode:multiply}
.badge-abf{left:937px}
.badge-abf img{left:-22px;top:13px;width:195px;height:56px}
.badge-lunelli{left:1110px}
.badge-lunelli img{left:0;top:9px;width:124px;height:64px}

.headline-highlight{display:none}
.headline{
  position:absolute;left:736px;top:175px;width:596px;
  font-family:'DM Sans',sans-serif;font-size:46px;text-transform:uppercase;line-height:1.15;color:#5c504c;
}
.headline .l1{display:block;font-weight:300}
.headline .l2{
  display:inline-flex;align-items:center;font-weight:700;color:#fff;
  background:#b1918b;height:67px;padding:0 18px;margin-left:-11px;box-sizing:border-box;
}

.hero-copy{position:absolute;left:736px;top:414px;width:596px;display:flex;flex-direction:column;gap:38px;align-items:flex-start}
.hero-lead{font-family:'Raleway',sans-serif;font-weight:400;font-size:22px;line-height:1.29;color:#4e4e4e;width:492px}
.hero-lead b{font-weight:500}
.hero-divider{width:100%;border:none;border-top:1px solid rgba(92,80,76,.5);margin:0}
.hero-bullets{display:flex;flex-direction:column;gap:13px;align-items:flex-start;width:466px;list-style:none;margin:0;padding:0}
.hero-bullets li{display:flex;gap:12px;align-items:center}
.hero-bullets img{width:20px;height:20px;flex-shrink:0}
.hero-bullets span{font-family:'Raleway',sans-serif;font-size:20px;color:#4e4e4e;white-space:nowrap}
.hero-bullets b{font-weight:700}

.hero-form{position:absolute;left:96px;top:543px;width:474px;background:#b1918b;padding:22px 15px;display:flex;flex-direction:column;align-items:center}
.hero-form-inner{width:444px;display:flex;flex-direction:column;gap:19px;align-items:center}
.hero-form-heading{font-family:'DM Sans',sans-serif;font-weight:500;font-size:20px;color:#fff;text-transform:uppercase;text-align:center;line-height:1.35}
.hero-form form{width:100%;display:flex;flex-direction:column;gap:22px}

.field-rows{display:flex;flex-direction:column;gap:14px;width:100%}
.field-row{display:flex;gap:10px;align-items:flex-end;width:100%}
.field{display:flex;flex-direction:column;gap:6px;align-items:flex-start;flex:1 1 0}
.field label{font-family:'DM Sans',sans-serif;font-weight:500;font-size:14px;color:#fff;text-transform:uppercase;line-height:1}
.field input,.field select{
  border:1px solid #fff;background:transparent;height:32px;padding:0 8px;color:#fff;
  font-family:'DM Sans',sans-serif;font-style:italic;font-size:12px;line-height:30px;width:100%;
  appearance:none;-webkit-appearance:none;border-radius:0;
}
.field input::placeholder{color:rgba(255,255,255,.8);font-style:italic;opacity:1}
.field select{
  color:rgba(255,255,255,.8);
  padding-right:26px;
  background-image:url('assets/icon-chevron-down.svg');
  background-repeat:no-repeat;background-position:right 8px center;background-size:11px 6px;
}
.field select option{color:#333;font-style:normal}
.field select:disabled{opacity:.65;cursor:not-allowed}

.btn{
  display:flex;align-items:center;justify-content:center;
  background:#584845;color:#fff;border:none;width:100%;
  font-family:'DM Sans',sans-serif;font-weight:500;font-size:16px;text-transform:uppercase;
  padding:10px;cursor:pointer;transition:background .15s ease;
}
.btn:hover{background:#463934}
.btn-auto{width:auto;flex:none}
.form-status{color:#fff;font-size:12px;text-align:center;min-height:14px;font-family:'Raleway',sans-serif}
.franqueado-form .form-status{color:#5c504c}

/* ============ REASONS ============ */
.eyebrow{
  display:inline-flex;align-items:center;background:#f2f0ef;color:#5c504c;
  font-family:'DM Sans',sans-serif;font-weight:300;font-size:16px;text-transform:uppercase;
  padding:5px 10px;line-height:1.35;
}
.reasons-head{position:absolute;left:72px;top:999px;display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.title-2line{font-family:'DM Sans',sans-serif;text-transform:uppercase;line-height:1.2;color:#5c504c}
.title-2line .l1{display:block;font-weight:300;font-size:32px}
.title-2line .l2{display:block;font-weight:500;font-size:52px}
.title-2line.center{text-align:center}

.reason-row{position:absolute;left:72px;top:1212px;display:flex;gap:32px;align-items:flex-start}
.reason-card{position:relative;width:300px;height:467px;border:1px solid rgba(88,72,69,.44)}
.reason-card .thumb{position:absolute;left:0;top:0;width:300px;height:318px;overflow:hidden}
.reason-card .thumb img{width:100%;height:100%;object-fit:cover}
.reason-card .copy{position:absolute;left:15px;top:344px;width:267px;display:flex;flex-direction:column;gap:12px}
.reason-card h3{margin:0;font-family:'DM Sans',sans-serif;font-weight:400;font-size:23px;color:#5c504c;line-height:1.2}
.reason-card p{font-family:'Raleway',sans-serif;font-weight:400;font-size:16px;color:#5c504c;line-height:1.2}
.reason-card .badge-abf-seal{position:absolute;left:138px;top:234px;width:177px;height:92px;overflow:hidden}
.reason-card .badge-abf-seal img{width:100%;height:100%;object-fit:cover}

/* ============ SUPPORT ============ */
.support-head{position:absolute;left:72px;top:1792px;width:800px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.support-head .title-2line{width:100%}

.support-bg{
  position:absolute;left:0;top:1886px;width:1440px;height:686px;background:#b1918b;
  clip-path:polygon(1440px 686px,0px 686px,0px 84px,1036px 84px,1036px 0px,1440px 0px);
}
.support-row{position:absolute;left:72px;top:2051px;display:flex;gap:22px;align-items:flex-start}
.support-col{display:flex;flex-direction:column;gap:52px;align-items:flex-start;width:411px;color:#fff}
.support-item{display:flex;flex-direction:column;gap:20px;align-items:flex-start;width:100%}
.support-item h3{margin:0;font-family:'DM Sans',sans-serif;font-weight:500;font-size:32px;text-transform:uppercase;line-height:1.2}
.support-item p{font-family:'Raleway',sans-serif;font-weight:400;font-size:22px;line-height:1.29}
.support-divider{width:1px;height:430px;background:rgba(255,255,255,.6);flex-shrink:0;align-self:center}

/* ============ NUMBERS ============ */
.numbers-wrap{position:absolute;left:0;top:2708px;width:1440px;display:flex;flex-direction:column;gap:52px;align-items:center}
.numbers-head{display:flex;flex-direction:column;gap:20px;align-items:center}
.numbers-card{position:relative;width:1440px;height:253px;background:#faf8f7;border:1px solid rgba(88,72,69,.5)}
.numbers-row{position:absolute;left:140px;top:62px;display:flex;gap:56px;align-items:flex-start;height:129px}
.numbers-stat{display:flex;flex-direction:column;gap:12px;align-items:flex-start;white-space:nowrap;color:#5c504c}
.numbers-stat .label{font-family:'DM Sans',sans-serif;font-weight:300;font-size:20px;line-height:1.09}
.numbers-stat .value{font-family:'DM Sans',sans-serif;font-weight:600;font-size:49px;text-transform:uppercase;line-height:1.09}
.numbers-stat .value .cur{font-size:36px}
.numbers-divider{width:1px;height:99px;background:rgba(92,80,76,.5);align-self:center}

/* ============ FAQ + FRANQUEADO ============ */
.faq-bg{
  position:absolute;left:0;top:3416px;width:1440px;background:#dcc6bb;
  height:calc(1058px + var(--faq-shift,0px));transition:height .35s ease;
}

.faq-row{position:absolute;left:72px;top:3478px;display:flex;gap:129px;align-items:flex-start}
.faq-intro{width:503px;display:flex;flex-direction:column;gap:56px;align-items:flex-start}
.faq-intro-head{display:flex;flex-direction:column;gap:20px;align-items:flex-start;width:100%}
.faq-intro .btn{padding:16px 40px;font-size:20px}

.faq-list{width:664px;display:flex;flex-direction:column;gap:43px}
.faq-list-row{display:flex;gap:23px;align-items:flex-start}
.faq-item{display:flex;flex-direction:column;gap:28px;align-items:flex-start}
.faq-item:nth-child(1){width:332px}
.faq-item:nth-child(2){width:309px}
.faq-item button{
  all:unset;display:flex;gap:19px;align-items:center;width:100%;cursor:pointer;
}
.faq-item p{font-family:'Raleway',sans-serif;font-weight:400;font-size:24px;line-height:1.2;color:#4e403d;width:276px}
.faq-item .chev{width:14px;height:7px;flex-shrink:0;transition:transform .2s ease}
.faq-item[data-open="true"] .chev{transform:rotate(180deg)}
.faq-item .answer{
  font-family:'Raleway',sans-serif;font-weight:400;font-size:16px;line-height:1.5;color:#5c504c;
  width:276px;max-height:0;overflow:hidden;opacity:0;margin-top:0;
  transition:max-height .35s ease,opacity .3s ease,margin-top .35s ease;
}
.faq-item[data-open="true"] .answer{opacity:1;margin-top:16px}
.faq-item hr{width:100%;border:none;border-top:1px solid rgba(92,80,76,.4);margin:0}

.franqueado-photo-mask{
  position:absolute;left:71px;top:3882px;width:554px;height:542px;overflow:hidden;
  transform:translateY(var(--faq-shift,0px));transition:transform .35s ease;
}
.franqueado-photo-mask img{position:absolute;left:-200px;top:-38px;width:906px;height:604px;max-width:none}

.franqueado-form{
  position:absolute;left:815px;top:3882px;width:553px;display:flex;flex-direction:column;gap:30px;align-items:flex-start;
  transform:translateY(var(--faq-shift,0px));transition:transform .35s ease;
}
.franqueado-form form{width:100%;display:flex;flex-direction:column;gap:17px}
.ff-rows{display:flex;flex-direction:column;gap:15px;width:100%}
.ff-row{display:flex;gap:12px;width:100%}
.ff-field{display:flex;flex-direction:column;gap:7px;align-items:flex-start;flex:1 1 0}
.ff-field label{font-family:'DM Sans',sans-serif;font-weight:500;font-size:16px;color:#5c504c;text-transform:uppercase;line-height:1.1}
.ff-field input,.ff-field select{
  border:1px solid #5c504c;background-color:#eadad3;height:38px;padding:0 9px;color:#5c504c;
  font-family:'DM Sans',sans-serif;font-style:italic;font-size:15px;line-height:36px;width:100%;
  appearance:none;-webkit-appearance:none;border-radius:0;
}
.ff-field input::placeholder{color:#5c504c;opacity:.85;font-style:italic}
.ff-field select{
  padding-right:28px;
  background-image:url('assets/icon-chevron-down-2.svg');
  background-repeat:no-repeat;background-position:right 9px center;background-size:12px 7px;
}
.ff-field select option{color:#333;font-style:normal}
.ff-field select:disabled{opacity:.65;cursor:not-allowed}
.franqueado-form .btn{padding:20px 10px;font-size:18px}

/* ============ FOOTER ============ */
.footer-row{
  position:absolute;left:815px;top:4411px;display:flex;gap:84px;align-items:center;color:#fff;
  transform:translateY(var(--faq-shift,0px));transition:transform .35s ease;
}
.footer-copy{font-family:'Inter',sans-serif;font-size:11px;white-space:nowrap}
.footer-credit{display:flex;gap:3px;align-items:center}
.footer-credit span{font-family:'Inter',sans-serif;font-size:11px;white-space:nowrap;text-align:right}
.footer-logo-mask{
  width:83px;height:13px;overflow:hidden;
  -webkit-mask-image:url(assets/footer-logo-mask.svg);mask-image:url(assets/footer-logo-mask.svg);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:83px 13px;mask-size:83px 13px;
}
.footer-logo-mask img{width:100%;height:100%;object-fit:contain}

@media (max-width:1023px){
  html,body{overflow-x:hidden;width:100%;max-width:100%}
  img{max-width:100%}
  .viewport{overflow-x:hidden!important;width:100%;max-width:100%;height:auto!important}
  .canvas{
    display:flex;flex-direction:column;align-items:stretch;
    width:100%!important;max-width:100%!important;height:auto!important;min-height:0;
    overflow:hidden;transform:none!important;padding:0 16px;box-sizing:border-box;
  }
  .canvas > *{left:auto!important;top:auto!important;max-width:100%}

  .bg-cream,.hero-photo-tint,.ticker-bg,.headline-highlight,.support-bg,.faq-bg{display:none}

  .hero-photo-mask{
    position:relative;order:3;
    width:calc(100% + 32px)!important;max-width:none!important;height:min(72vw,420px);
    margin:0 -16px;
  }
  .hero-photo-mask img,.hero-photo-mask video{
    left:0;top:0;width:100%;height:100%;
  }

  .ticker{
    position:relative;order:4;
    width:calc(100% + 32px)!important;max-width:none!important;height:44px;background:#eadad3;
    display:flex;align-items:center;margin:0 -16px;
    font-size:14px;
  }
  .ticker-track{gap:36px}

  .logo-lezalez{
    position:relative;order:1;
    width:120px;height:auto;margin:20px auto 0;align-self:center;
  }

  .badge{display:none}

  .headline{
    position:relative;order:2;
    width:100%;margin:16px 0 8px;text-align:center;
    font-size:28px;
  }
  .headline .l2{height:auto;min-height:44px;padding:6px 12px;margin:8px auto 0;font-size:26px}

  .hero-copy{
    position:relative;order:5;
    width:100%;margin:16px 0 8px;gap:16px;
  }
  .hero-lead{width:100%!important;font-size:16px}
  .hero-bullets{width:100%!important}
  .hero-bullets span{font-size:15px;white-space:normal}

  .hero-form{
    position:relative;order:6;
    width:100%!important;margin:8px 0 32px;padding:20px 16px;
  }
  .hero-form-inner{width:100%!important}
  .field-row{flex-direction:column;align-items:stretch;gap:12px}
  .field input,.field select{height:44px;font-size:16px;line-height:42px}

  .reasons-head{
    position:relative;order:7;
    margin:8px 0 16px;gap:12px;
  }
  .title-2line .l1{font-size:22px}
  .title-2line .l2{font-size:28px}

  .reason-row{
    position:relative;order:8;
    flex-direction:column;gap:20px;margin:0 0 36px;width:100%;
  }
  .reason-card{width:100%;height:auto}
  .reason-card .thumb{position:relative;width:100%;height:220px}
  .reason-card .copy{position:relative;left:auto;top:auto;width:auto;padding:16px}
  .reason-card .badge-abf-seal{left:auto;right:8px;top:160px;width:140px;height:72px}

  .support-head{
    position:relative;order:9;
    width:100%;margin:0 0 16px;gap:12px;
  }

  .support-row{
    position:relative;order:10;
    flex-direction:column;gap:28px;
    width:calc(100% + 32px)!important;max-width:none!important;margin:0 -16px;
    padding:28px 16px 36px;background:#b1918b;
  }
  .support-col{width:100%;gap:28px}
  .support-divider{display:none}
  .support-item h3{font-size:22px}
  .support-item p{font-size:16px}

  .numbers-wrap{
    position:relative;order:11;
    width:100%!important;gap:24px;margin:28px 0;padding:0;
  }
  .numbers-card{width:100%;height:auto;padding:20px 16px}
  .numbers-row{
    position:relative;left:auto;top:auto;height:auto;
    display:grid;grid-template-columns:1fr 1fr;gap:20px 16px;
  }
  .numbers-divider{display:none}
  .numbers-stat{white-space:normal}
  .numbers-stat .label{font-size:14px}
  .numbers-stat .value{font-size:28px}
  .numbers-stat .value .cur{font-size:20px}
  .numbers-wrap .btn{width:100%;font-size:16px!important;padding:14px 16px!important;text-align:center}

  .franqueado-photo-mask{
    position:relative;order:13;
    width:calc(100% + 32px)!important;max-width:none!important;height:220px;transform:none;margin:0 -16px;
  }
  .franqueado-photo-mask img{left:50%;top:0;width:auto;height:100%;transform:translateX(-50%)}

  .faq-row{
    position:relative;order:12;
    flex-direction:column;gap:24px;
    width:calc(100% + 32px)!important;max-width:none!important;margin:0 -16px;
    padding:32px 16px 24px;background:#dcc6bb;
  }
  .faq-intro{width:100%;gap:20px}
  .faq-intro .btn{width:100%;padding:14px 16px;font-size:16px;text-align:center}
  .faq-list{width:100%;gap:20px}
  .faq-list-row{flex-direction:column;gap:20px}
  .faq-item,.faq-item:nth-child(1),.faq-item:nth-child(2){width:100%}
  .faq-item p,.faq-item .answer{width:100%;font-size:16px}
  .faq-item button{gap:12px}

  .franqueado-form{
    position:relative;order:14;
    width:calc(100% + 32px)!important;max-width:none!important;margin:0 -16px;
    padding:24px 16px 28px;transform:none;background:#dcc6bb;
  }
  .franqueado-form .title-2line .l2{font-size:26px}
  .ff-row{flex-direction:column}
  .ff-field input,.ff-field select{height:44px;font-size:16px;line-height:42px}

  .footer-row{
    position:relative;order:15;
    flex-direction:column;gap:10px;align-items:flex-start;
    width:calc(100% + 32px)!important;max-width:none!important;margin:0 -16px;
    padding:0 16px 28px;transform:none;
    color:#5c504c;background:#dcc6bb;
  }
  .footer-copy,.footer-credit span{white-space:normal;font-size:12px}
}