@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&family=Roboto:ital,wght@0,400;0,500;0,700;1,400&family=Roboto+Slab:wght@400;500;700&display=swap');

/* ===== Design tokens (derived from BEGO logo + rescued site structure) ===== */
:root{
  --brand-blue:#4a71b6;
  --brand-blue-dark:#173f6e;
  --brand-green:#39aa35;
  --brand-green-light:#7dbe6c;
  --accent-blue:#1e73be;
  --contrast:#222222;
  --contrast-2:#575760;
  --contrast-3:#b2b2be;
  --base:#f0f0f0;
  --base-2:#f7f8f9;
  --base-3:#ffffff;

  --color-text-primary:var(--contrast);
  --color-text-secondary:var(--contrast-2);
  --color-text-tertiary:var(--contrast-3);
  --color-surface-page:var(--base-2);
  --color-surface-card:var(--base-3);
  --color-border:var(--contrast-3);
  --color-whatsapp:#25d366;
  --color-whatsapp-dark:#1ebd59;
  --color-danger:#c0392b;

  --font-display:'Montserrat',sans-serif;
  --font-body:'Roboto',sans-serif;

  --text-hero:clamp(2rem,5vw,3.5rem);
  --text-h2:clamp(1.5rem,3vw,2.25rem);
  --text-h4:1.125rem;
  --text-small:0.875rem;
  --text-legal:0.75rem;

  --leading-tight:1.15;
  --leading-snug:1.35;
  --leading-normal:1.6;

  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;

  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:16px;
  --radius-pill:999px;

  --shadow-card:0 1px 3px rgba(34,34,34,.08),0 4px 12px rgba(34,34,34,.06);
  --shadow-card-hover:0 2px 6px rgba(34,34,34,.10),0 8px 20px rgba(34,34,34,.10);
  --shadow-popover:0 8px 24px rgba(23,63,110,.18);

  --ease-standard:cubic-bezier(.4,0,.2,1);
  --duration-fast:120ms;
  --duration-base:200ms;
  --duration-slow:400ms;

  /* Bootstrap theme overrides */
  --bs-primary:#4a71b6;
  --bs-primary-rgb:74,113,182;
  --bs-body-font-family:'Roboto',sans-serif;
  --bs-link-color:var(--accent-blue);
  --bs-link-hover-color:var(--brand-blue-dark);
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ===== Base ===== */
html{ scroll-behavior:smooth; }
body{
  font-family:var(--font-body);
  color:var(--color-text-primary);
  background:var(--color-surface-page);
  line-height:var(--leading-normal);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{ font-family:var(--font-display); color:var(--color-text-primary); line-height:var(--leading-tight); }
[id]{ scroll-margin-top:90px; }

.skip-link{
  position:absolute; left:8px; top:-48px; background:var(--brand-blue-dark); color:#fff;
  padding:10px 16px; border-radius:var(--radius-sm); z-index:1000; transition:top var(--duration-base) var(--ease-standard);
  text-decoration:none; font-weight:600;
}
.skip-link:focus{ top:8px; }
:focus-visible{ outline:3px solid var(--accent-blue); outline-offset:2px; }

.section{ padding:var(--space-8) 0; }
.section-title{ font-size:var(--text-h2); font-weight:600; text-align:center; margin-bottom:var(--space-2); }
.section-subtitle{ font-size:1rem; color:var(--color-text-secondary); text-align:center; max-width:640px; margin:0 auto var(--space-6); }
.section--muted{ background:var(--color-surface-card); }
@media (min-width:992px){
  #cotizacion .section-title.text-lg-start,
  #cotizacion .section-subtitle.text-lg-start{ text-align:left; margin-left:0; }
}

/* ===== Buttons (kept custom for brand-exact styling) ===== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-body); font-weight:700; font-size:1rem;
  padding:14px 26px; border-radius:var(--radius-md); border:1.5px solid transparent;
  text-decoration:none; transition:background var(--duration-base) var(--ease-standard),
  box-shadow var(--duration-base) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);
  min-height:48px;
}
.btn svg{ width:20px; height:20px; flex-shrink:0; }
.btn:active{ transform:translateY(1px); }
.btn-lg{ padding:16px 32px; font-size:1.0625rem; }

.btn--primary{ background:var(--brand-blue); color:#fff; }
.btn--primary:hover{ background:var(--brand-blue-dark); color:#fff; }

.btn--secondary{ background:#fff; color:var(--brand-blue-dark); border-color:var(--brand-blue); }
.btn--secondary:hover{ background:var(--base-2); color:var(--brand-blue-dark); }

.btn--whatsapp{ background:var(--color-whatsapp); color:#fff; }
.btn--whatsapp:hover{ background:var(--color-whatsapp-dark); color:#fff; }

.btn--ghost{ background:transparent; color:var(--color-text-secondary); border-color:var(--color-border); }
.btn--ghost:hover{ background:var(--base); }

.btn--outline-light{ background:transparent; color:#fff; border-color:rgba(255,255,255,.6); }
.btn--outline-light:hover{ background:rgba(255,255,255,.15); color:#fff; }

.btn[disabled]{ opacity:.5; cursor:not-allowed; }

/* ===== Header ===== */
.header-phone{ color:var(--brand-blue-dark); }
#mainNav .nav-link{ color:var(--color-text-primary); }
#mainNav .nav-link:hover, #mainNav .nav-link:focus-visible{ color:var(--brand-blue-dark); }

/* ===== Hero ===== */
.hero{
  position:relative; overflow:hidden; background:linear-gradient(135deg,var(--brand-blue-dark),var(--brand-blue));
  color:#fff; min-height:min(560px,80vh);
}
.hero-bg-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-overlay{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(115deg, rgba(23,63,110,.88) 0%, rgba(74,113,182,.72) 55%, rgba(23,63,110,.55) 100%);
}
.hero .carousel, .hero .carousel-inner{ min-height:min(560px,80vh); }
.hero .carousel-item > .container{ width:100%; min-height:min(560px,80vh); display:flex; align-items:center; }

.hero-slide-inner{ max-width:640px; }
.hero-eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-size:var(--text-small); font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--brand-green-light); margin-bottom:var(--space-3);
}
.hero-title{ font-size:var(--text-hero); font-weight:800; margin-bottom:var(--space-4); color:#fff; }
.hero-text{ font-size:1.125rem; color:rgba(255,255,255,.9); margin-bottom:var(--space-6); max-width:560px; }
.hero-ctas{ display:flex; gap:var(--space-4); flex-wrap:wrap; }

.hero .carousel-indicators{ margin-bottom:1rem; }
.hero .carousel-indicators [data-bs-target]{
  width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.4); border:none;
  opacity:1; margin:0 5px; transition:background var(--duration-base) var(--ease-standard), transform var(--duration-base) var(--ease-standard);
}
.hero .carousel-indicators .active{ background:#fff; transform:scale(1.2); }

.hero-arrow{
  width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.35);
  color:#fff; display:flex; align-items:center; justify-content:center; transition:background var(--duration-base) var(--ease-standard);
}
.hero-arrow svg{ width:22px; height:22px; }
.carousel-control-prev:hover .hero-arrow, .carousel-control-next:hover .hero-arrow{ background:rgba(255,255,255,.3); }
@media (max-width:640px){ .hero .carousel-control-prev, .hero .carousel-control-next{ display:none; } }

/* ===== Hero brand slides (per-brand background video) ===== */
.hero .carousel{ position:relative; z-index:2; }
.hero-slide--brand-video{ position:relative; }
.hero-brand-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-slide--brand-video .hero-overlay{ z-index:1; }
.hero-slide--brand-video > .container{ position:relative; z-index:2; }

.hero-brand-badge{
  display:inline-flex; align-items:center; background:#fff; border-radius:var(--radius-md);
  padding:10px 22px; margin-bottom:var(--space-4); box-shadow:var(--shadow-popover);
}
.hero-brand-badge img{ height:32px; width:auto; display:block; }
.hero-brand-badge--text{
  font-family:var(--font-display); font-weight:800; font-size:1.25rem; color:var(--brand-blue-dark);
  letter-spacing:.03em;
}

/* ===== Product cards ===== */
.product-card{
  background:var(--color-surface-card); border-radius:var(--radius-md); box-shadow:var(--shadow-card);
  padding:var(--space-5) var(--space-3); text-align:center; display:flex; flex-direction:column; align-items:center; gap:var(--space-3);
  transition:box-shadow var(--duration-base) var(--ease-standard), transform var(--duration-base) var(--ease-standard);
}
.product-card:hover{ box-shadow:var(--shadow-card-hover); transform:translateY(-2px); }
.product-image{
  width:100%; max-width:150px; aspect-ratio:1/1; margin:0 auto; border-radius:var(--radius-md);
  overflow:hidden; background:#fff; display:flex; align-items:center; justify-content:center;
  transition:transform var(--duration-base) var(--ease-standard);
}
.product-card:hover .product-image{ transform:scale(1.04); }
.product-image img{ width:100%; height:100%; object-fit:contain; }
.product-card h3{ font-size:var(--text-h4); font-weight:600; margin:0; }
.product-card--clickable{
  border:none; cursor:pointer; font-family:inherit;
}
.product-card--clickable:focus-visible{ outline:3px solid var(--accent-blue); outline-offset:2px; }

/* ===== Catalog items (inside product-category modals) ===== */
.catalog-item{
  background:var(--color-surface-card); border:1px solid var(--color-border); border-radius:var(--radius-md);
  padding:var(--space-3); display:flex; flex-direction:column; gap:var(--space-2); text-align:center;
}
.catalog-item-img{
  width:100%; aspect-ratio:1/1; border-radius:var(--radius-sm); overflow:hidden; background:#fff;
  display:flex; align-items:center; justify-content:center; border:1px solid var(--base);
}
.catalog-item-img img{ width:100%; height:100%; object-fit:contain; }
.catalog-item-img--empty{ background:var(--base); }
.catalog-item-img--empty::before{
  content:''; width:36px; height:36px; opacity:.35;
  background:var(--brand-blue) center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V5zm2 12 4-4 3 3 5-6 3 4v3H6z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V5zm2 12 4-4 3 3 5-6 3 4v3H6z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.catalog-item-name{ font-size:var(--text-small); font-weight:600; color:var(--color-text-primary); flex:1; line-height:var(--leading-snug); }

/* ===== Stats / cifras (matching product-icon ring style) ===== */
.stat-badge{
  width:88px; height:88px; border-radius:50%; border:3px solid var(--brand-blue);
  background:#fff; display:flex; align-items:center; justify-content:center;
  transition:transform var(--duration-base) var(--ease-standard), border-color var(--duration-base) var(--ease-standard);
}
.col:hover .stat-badge{ border-color:var(--brand-blue-dark); transform:translateY(-2px); }
.stat-badge svg{ width:40px; height:40px; color:var(--brand-blue-dark); }
.stat-value{ font-family:var(--font-display); font-weight:800; font-size:1.125rem; color:var(--brand-blue-dark); line-height:var(--leading-tight); }
.stat-label{ font-size:var(--text-small); color:var(--color-text-secondary); max-width:190px; line-height:var(--leading-snug); margin:0 auto; }

/* ===== Cotizacion / contact ===== */
.quote-lead{ color:var(--color-text-secondary); font-size:1.0625rem; }
.quote-fact{ display:flex; gap:var(--space-3); align-items:flex-start; margin-bottom:var(--space-3); }
.quote-fact svg{ width:24px; height:24px; color:var(--brand-blue); flex-shrink:0; margin-top:2px; }
.quote-fact strong{ display:block; font-size:var(--text-small); color:var(--color-text-primary); }
.quote-fact span{ font-size:var(--text-small); color:var(--color-text-secondary); }

.form-card{
  background:var(--color-surface-card); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); padding:var(--space-6);
}
.form-control:focus{ border-color:var(--brand-blue); box-shadow:0 0 0 .2rem rgba(74,113,182,.25); }

/* ===== Brands strip ===== */
.brand-tile{
  background:var(--color-surface-card); border:1px solid var(--color-border); border-radius:var(--radius-md);
  display:flex; align-items:center; justify-content:center; padding:var(--space-4) var(--space-5); min-height:88px;
  filter:grayscale(1); opacity:.75; transition:filter var(--duration-base) var(--ease-standard), opacity var(--duration-base) var(--ease-standard), box-shadow var(--duration-base) var(--ease-standard);
}
.brand-tile:hover{ filter:grayscale(0); opacity:1; box-shadow:var(--shadow-card-hover); }
.brand-tile img{ max-height:40px; max-width: 100%; }
.brand-tile.brand-tile--text{ font-family:var(--font-display); font-weight:800; font-size:1.25rem; color:var(--brand-blue-dark); letter-spacing:.02em; }

/* ===== Catalogs ===== */
.catalog-card{
  background:var(--color-surface-card); border-radius:var(--radius-md); box-shadow:var(--shadow-card); overflow:hidden;
  display:flex; flex-direction:column; transition:box-shadow var(--duration-base) var(--ease-standard), transform var(--duration-base) var(--ease-standard);
}
.catalog-card:hover{ box-shadow:var(--shadow-card-hover); transform:translateY(-2px); }
.catalog-cover{ height:180px; background:var(--base); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.catalog-cover img{ width:100%; height:100%; object-fit:cover; }
.catalog-cover.catalog-cover--brand{ /*background:var(--brand-blue-dark);*/ }
.catalog-cover.catalog-cover--brand img{ object-fit:contain; padding:var(--space-6); }
.catalog-cover-text{
  font-family:var(--font-display); font-weight:800; font-size:1.5rem; color:#fff; letter-spacing:.03em;
}
.catalog-body{ padding:var(--space-5); display:flex; flex-direction:column; gap:var(--space-3); flex:1; }
.catalog-body h3{ font-size:var(--text-h4); font-weight:700; margin:0; }
.catalog-body p{ font-size:var(--text-small); color:var(--color-text-secondary); flex:1; margin:0; }

/* ===== Wizard ===== */
.wizard{
  background:var(--color-surface-card); border-radius:var(--radius-lg); box-shadow:var(--shadow-card);
  padding:var(--space-7) var(--space-5); display:flex; flex-direction:column; align-items:center; gap:var(--space-5);
  text-align:center; max-width:680px;
}
.wizard-step{ font-size:var(--text-small); color:var(--color-text-secondary); font-weight:600; }
.wizard-progress{ width:100%; max-width:320px; height:6px; }
.wizard-progress-bar{ background-color:var(--brand-blue); }
.wizard-question{ font-size:1.25rem; font-weight:700; }
.wizard-options{ display:flex; gap:var(--space-3); flex-wrap:wrap; justify-content:center; }
.wizard-option{
  font-size:var(--text-small); font-weight:600; padding:12px 20px; border-radius:var(--radius-md);
  border:1.5px solid var(--color-border); background:#fff; color:var(--color-text-primary);
  transition:border-color var(--duration-base) var(--ease-standard), background var(--duration-base) var(--ease-standard);
  min-height:48px;
}
.wizard-option:hover{ border-color:var(--brand-blue); background:var(--base-2); }
.wizard-result-icon{ width:56px; height:56px; color:var(--brand-green); }
.wizard-result-label{ font-size:var(--text-small); color:var(--color-text-secondary); }
.wizard-result-value{ font-size:1.25rem; font-weight:700; color:var(--brand-blue-dark); }
.wizard-actions{ display:flex; gap:var(--space-3); flex-wrap:wrap; justify-content:center; }

/* ===== FAQ (Bootstrap accordion, restyled) ===== */
.faq-accordion{ max-width:800px; }
.faq-accordion .accordion-item{
  border:none; box-shadow:var(--shadow-card); border-radius:var(--radius-md) !important; overflow:hidden; margin-bottom:var(--space-3);
}
.faq-accordion .accordion-button{ font-weight:700; font-size:1.0625rem; color:var(--color-text-primary); padding:var(--space-4) var(--space-5); }
.faq-accordion .accordion-button:not(.collapsed){ background:#fff; color:var(--brand-blue-dark); box-shadow:none; }
.faq-accordion .accordion-button:focus{ box-shadow:0 0 0 .2rem rgba(74,113,182,.25); border-color:var(--brand-blue); }
.faq-accordion .accordion-body{ color:var(--color-text-secondary); }

/* ===== Footer ===== */
.site-footer{ background:var(--brand-blue-dark); color:#fff; }
.site-footer h4{ font-size:var(--text-h4); font-weight:700; margin-bottom:var(--space-3); color:#fff; }
.site-footer a{ color:rgba(255,255,255,.85); font-size:var(--text-small); text-decoration:none; }
.footer-contact{ display:flex; flex-direction:column; gap:var(--space-2); margin-bottom:var(--space-3); }
.footer-contact a{ display:flex; align-items:center; gap:10px; }
.footer-contact svg{ width:18px; height:18px; flex-shrink:0; }
.footer-legal-list{ display:flex; flex-direction:column; gap:8px; }
.footer-legal-list button{
  background:none; border:none; padding:0; margin:0; text-align:left; cursor:pointer;
  color:rgba(255,255,255,.85); font-size:var(--text-small); font-family:inherit;
  transition:color var(--duration-base) var(--ease-standard);
}
.footer-legal-list button:hover{ color:#fff; text-decoration:underline; }

.mobile-legal-link{
  background:none; border:none; padding:6px 0; margin:0; text-align:left; cursor:pointer;
  color:var(--color-text-primary); font-size:1rem; font-family:inherit; font-weight:500;
}
.mobile-legal-link:hover{ color:var(--brand-blue-dark); }

/* ===== Legal modal content ===== */
.legal-content h3{ font-size:1.0625rem; font-weight:700; margin-top:var(--space-5); margin-bottom:var(--space-2); }
.legal-content h3:first-of-type{ margin-top:var(--space-3); }
.legal-content p{ margin-bottom:var(--space-3); line-height:var(--leading-normal); }
.legal-disclaimer{
  margin-top:var(--space-5); padding:var(--space-3) var(--space-4); border-radius:var(--radius-sm);
  background:var(--base); border-left:3px solid var(--brand-blue); font-size:var(--text-small);
  color:var(--color-text-secondary); font-style:italic;
}
.footer-social{ display:flex; gap:var(--space-3); }
.footer-social a{ width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; transition:background var(--duration-base) var(--ease-standard); }
.footer-social a:hover{ background:rgba(255,255,255,.25); }
.footer-social svg{ width:20px; height:20px; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.15); padding:var(--space-4) 0; text-align:center; font-size:var(--text-legal); color:rgba(255,255,255,.7); }

/* ===== WhatsApp FAB ===== */
.whatsapp-fab{
  position:fixed; bottom:20px; right:20px; z-index:120; width:60px; height:60px; border-radius:50%;
  background:var(--color-whatsapp); color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 16px rgba(0,0,0,.25); transition:transform var(--duration-base) var(--ease-standard), background var(--duration-base) var(--ease-standard);
  text-decoration:none;
}
.whatsapp-fab:hover{ background:var(--color-whatsapp-dark); transform:scale(1.06); color:#fff; }
.whatsapp-fab svg{ width:30px; height:30px; }
.whatsapp-fab::before{
  content:''; position:absolute; inset:0; border-radius:50%; background:var(--color-whatsapp);
  animation:pulse 2.4s var(--ease-standard) infinite; z-index:-1;
}
@keyframes pulse{
  0%{ transform:scale(1); opacity:.55; }
  100%{ transform:scale(1.8); opacity:0; }
}
@media (prefers-reduced-motion: reduce){ .whatsapp-fab::before{ animation:none; } }

/* =====================================================================
   Scroll reveal motion
   Progressive enhancement: only takes effect once <html> has
   .js-reveal-ready (added by an inline <script> in <head>, before first
   paint). Without JS, every section/card/icon renders normally, visible.
   ===================================================================== */

/* per-item stagger delay, inherited from the nth-child'd wrapper down to
   nested icons via CSS custom property inheritance */
[data-reveal-section] > .container > :is(.row, .accordion) > *:nth-child(1){ --stagger-delay:0ms; }
[data-reveal-section] > .container > :is(.row, .accordion) > *:nth-child(2){ --stagger-delay:50ms; }
[data-reveal-section] > .container > :is(.row, .accordion) > *:nth-child(3){ --stagger-delay:100ms; }
[data-reveal-section] > .container > :is(.row, .accordion) > *:nth-child(4){ --stagger-delay:150ms; }
[data-reveal-section] > .container > :is(.row, .accordion) > *:nth-child(5){ --stagger-delay:200ms; }
[data-reveal-section] > .container > :is(.row, .accordion) > *:nth-child(6){ --stagger-delay:250ms; }
[data-reveal-section] > .container > :is(.row, .accordion) > *:nth-child(7){ --stagger-delay:300ms; }
[data-reveal-section] > .container > :is(.row, .accordion) > *:nth-child(8){ --stagger-delay:350ms; }

/* section heading + standalone cards (wizard): fade + rise */
.js-reveal-ready [data-reveal-section] .section-title,
.js-reveal-ready [data-reveal-section] .section-subtitle,
.js-reveal-ready [data-reveal-section] > .container > .wizard{
  opacity:0; transform:translateY(24px);
  transition:opacity 500ms var(--ease-standard), transform 500ms var(--ease-standard);
}
[data-reveal-section].is-visible .section-title,
[data-reveal-section].is-visible .section-subtitle,
[data-reveal-section].is-visible > .container > .wizard{ opacity:1; transform:none; }

/* grid/list items: staggered fade + rise */
.js-reveal-ready [data-reveal-section] > .container > :is(.row, .accordion) > *{
  opacity:0; transform:translateY(20px);
  transition:opacity 420ms var(--ease-standard), transform 420ms var(--ease-standard);
  transition-delay:var(--stagger-delay, 0ms);
}
[data-reveal-section].is-visible > .container > :is(.row, .accordion) > *{ opacity:1; transform:none; }

/* icon badges: springy pop-in, slightly after their card/row settles */
.js-reveal-ready [data-reveal-section] .stat-badge{
  opacity:0; transform:scale(.5) rotate(-15deg);
  transition:opacity 450ms cubic-bezier(.34,1.56,.64,1), transform 450ms cubic-bezier(.34,1.56,.64,1);
  transition-delay:calc(var(--stagger-delay, 0ms) + 80ms);
}
[data-reveal-section].is-visible .stat-badge{ opacity:1; transform:none; }

/* product images: gentler scale + fade, no rotation (looks better on photos than on icon glyphs) */
.js-reveal-ready [data-reveal-section] .product-image{
  opacity:0; transform:scale(.88);
  transition:opacity 420ms cubic-bezier(.34,1.2,.64,1), transform 420ms cubic-bezier(.34,1.2,.64,1);
  transition-delay:calc(var(--stagger-delay, 0ms) + 80ms);
}
[data-reveal-section].is-visible .product-image{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .js-reveal-ready [data-reveal-section] .section-title,
  .js-reveal-ready [data-reveal-section] .section-subtitle,
  .js-reveal-ready [data-reveal-section] > .container > .wizard,
  .js-reveal-ready [data-reveal-section] > .container > :is(.row, .accordion) > *,
  .js-reveal-ready [data-reveal-section] .stat-badge,
  .js-reveal-ready [data-reveal-section] .product-image{
    opacity:1; transform:none; transition:none;
  }
}

/* ===== Expo Ferretera promo modal ===== */
.expo-modal-content{ border:none; border-radius:var(--radius-lg); overflow:hidden; background:transparent; }
.expo-modal-close{
  position:absolute; top:10px; right:10px; z-index:5; width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,.9); border:none; color:var(--brand-blue-dark);
  display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.25);
  transition:background var(--duration-base) var(--ease-standard);
}
.expo-modal-close:hover{ background:#fff; }
.expo-modal-close svg{ width:20px; height:20px; }
