
/* ================================================================
   Infinitoline Examples v12 — responsive + theme + contact utility
   ================================================================ */
:root{color-scheme:light dark}
html{overflow-x:hidden;scroll-behavior:smooth;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{min-height:100svh;overflow-x:hidden;transition:background-color .25s ease,color .25s ease}
img{max-width:100%;height:auto}
a,button,input,select,textarea{font:inherit}
a,button{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,#4f7cff 65%,white);outline-offset:3px}
button,.btn,.button,.reserve,.navcta,.book,.order{min-height:44px}
table{max-width:100%}

.site-theme-tools{position:fixed;left:max(14px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));z-index:9997;display:flex;align-items:center;gap:6px;padding:6px;border-radius:999px;background:rgba(255,255,255,.88);border:1px solid rgba(20,20,24,.14);box-shadow:0 12px 34px rgba(0,0,0,.16);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.site-theme-tools button{border:0;background:transparent;color:#24242a;border-radius:999px;min-height:38px;padding:7px 10px;display:flex;align-items:center;gap:6px;cursor:pointer;font-size:12px;font-weight:800;white-space:nowrap}
.site-theme-tools button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.site-theme-tools button[aria-pressed="true"]{background:#202126;color:#fff}
html[data-theme="dark"] .site-theme-tools{background:rgba(24,25,29,.9);border-color:rgba(255,255,255,.16);box-shadow:0 14px 38px rgba(0,0,0,.38)}
html[data-theme="dark"] .site-theme-tools button{color:#f4f4f6}
html[data-theme="dark"] .site-theme-tools button[aria-pressed="true"]{background:#fff;color:#17181b}

.whatsapp-float{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:9998;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border-radius:999px;background:#147a3b;color:#fff!important;text-decoration:none!important;box-shadow:0 14px 34px rgba(0,0,0,.24);font:800 14px/1 Arial,sans-serif;letter-spacing:0;transition:transform .18s ease,box-shadow .18s ease}
.whatsapp-float:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,0,0,.30)}
.whatsapp-float img{width:42px;height:42px;display:block;flex:0 0 42px}
.whatsapp-float small{display:block;font-size:10px;opacity:.82;margin-bottom:3px;font-weight:700}
.whatsapp-float span{display:block}

@media(min-width:1500px){.wrap,.shell{width:min(1320px,calc(100% - 64px))}.hero{padding-top:90px}.section{padding-top:96px;padding-bottom:96px}}
@media(max-width:980px){
  .wrap,.shell{width:min(100% - 32px,1180px)}
  .hero{padding-top:48px;padding-bottom:54px}
  .section{padding-top:56px;padding-bottom:56px}
  .hero-grid,.process-grid,.consult-grid,.editorial-grid,.atendimento-grid,.inspect-grid,.scene-grid,.ambiance-grid,.care-grid,.feature-grid,.story-grid,.split-grid,.evidence,.experience,.real{gap:28px!important}
  .hero img,.hero-img img{max-height:560px;object-fit:cover;width:100%}
  h1{overflow-wrap:anywhere}
}
@media(max-width:850px){
  header .top{height:auto!important;min-height:68px!important;display:flex!important;flex-wrap:wrap!important;gap:10px!important;padding:10px 0!important}
  header nav,.nav{display:flex!important;width:100%;order:3;gap:8px!important;overflow-x:auto;padding:6px 0 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  header nav::-webkit-scrollbar,.nav::-webkit-scrollbar{display:none}
  header nav a,.nav a{flex:0 0 auto;min-height:40px;display:inline-flex;align-items:center;justify-content:center;padding:9px 12px!important;border-radius:999px;white-space:nowrap}
  .hero-grid,.process-grid,.consult-grid,.editorial-grid,.atendimento-grid,.inspect-grid,.scene-grid,.ambiance-grid,.care-grid,.feature-grid,.story-grid,.split-grid,.evidence,.experience,.real,.delivery,.rfqbox{grid-template-columns:1fr!important}
  .services,.caps,.menu-grid,.proof,.service,.info,.quick,.servicebar{grid-template-columns:1fr!important}
  .collection{grid-template-columns:1fr 1fr!important}
  .offers{grid-template-columns:1fr 1fr!important}
  .cats{grid-template-columns:repeat(3,1fr)!important}
  .hero h1,.copy h1{font-size:clamp(2.55rem,12vw,4.4rem)!important}
  h2,.section h2,.copy h2{font-size:clamp(2rem,8.5vw,3.2rem)!important}
  .copy{padding:36px 24px!important}
  .hero-card{grid-template-columns:1fr!important}
  .hero-copy{padding:32px 24px!important}
  .mini{position:static!important;margin-top:12px!important;max-width:none!important}
  .bar{overflow-x:auto!important}
  .bar .shell{width:max-content!important;min-width:100%;padding-inline:16px}
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media(max-width:620px){
  .wrap,.shell{width:min(100% - 24px,1180px)}
  .hero{padding-top:32px!important;padding-bottom:40px!important}
  .section{padding-top:44px!important;padding-bottom:44px!important}
  .collection,.offers,.cats,.proofgrid{grid-template-columns:1fr!important}
  .product img{aspect-ratio:4/5!important}
  .actions{display:grid!important;grid-template-columns:1fr!important}
  .actions .btn,.actions .button{width:100%;text-align:center}
  .site-theme-tools{left:10px;bottom:10px;padding:5px;gap:2px;max-width:calc(100vw - 84px)}
  .site-theme-tools button{padding:7px 8px;min-width:36px;justify-content:center}
  .site-theme-tools button span{display:none}
  .whatsapp-float{right:10px;bottom:10px;padding:6px;border-radius:50%}
  .whatsapp-float img{width:46px;height:46px;flex-basis:46px}
  .whatsapp-float .wa-copy{display:none}
  body{padding-bottom:70px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


html[data-theme="dark"] body{background:#101711;color:#eef8f0}
html[data-theme="dark"] .header{background:#142019;border-color:#2b4334}
html[data-theme="dark"] .search,html[data-theme="dark"] .cat,html[data-theme="dark"] .offer,html[data-theme="dark"] .tile,html[data-theme="dark"] .atendimento-grid{background:#18241c;border-color:#304738;color:#edf7ef}
html[data-theme="dark"] .hero-card{background:#77640f;color:#fff}
html[data-theme="dark"] .badge{background:#17251c;color:#f4f8e8}
html[data-theme="dark"] .atendimento-grid p,html[data-theme="dark"] .atendimento-grid li{color:#bed1c3}
html[data-theme="dark"] footer{background:#0a2415}


/* ================================================================
   Infinitoline Examples v14 — natural image proportions
   - no forced aspect-ratio on photographs
   - no stretching
   - smaller visual footprint on desktop and phone
   - robust theme controls
   - cleaner WhatsApp floating contact
   ================================================================ */

html[data-theme="light"]{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}

img{
  display:block;
  max-width:100%;
  height:auto!important;
  aspect-ratio:auto!important;
}

/* Header logos remain crisp but compact. */
.brand img,.logo img{
  width:auto!important;
  height:auto!important;
  max-width:210px!important;
  max-height:58px!important;
  object-fit:contain!important;
  object-position:center!important;
}

/* Photographs are shown at their natural ratio. */
.hero-img,
.hero-grid>img,
.hero-card>img,
.hero>img,
.process-grid>img,
.consult-grid>img,
.editorial-grid>img,
.atendimento-grid>img,
.inspect-grid>img,
.scene-grid>img,
.ambiance-grid>img,
.care-grid>img,
.feature-grid>img,
.story-grid>img,
.split-grid>img,
.evidence>img,
.experience>img,
.real img{
  justify-self:center;
}

.hero-img{
  width:min(100%,540px)!important;
  max-width:540px!important;
}

.hero-img img{
  width:100%!important;
  max-width:540px!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center!important;
}

/* Hero images directly inside grids/sections. */
.hero-grid>img,
.hero-card>img{
  width:min(100%,540px)!important;
  max-width:540px!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center!important;
}

/* Secondary editorial/service photographs. */
.process-grid>img,
.consult-grid>img,
.editorial-grid>img,
.atendimento-grid>img,
.inspect-grid>img,
.scene-grid>img,
.ambiance-grid>img,
.care-grid>img,
.feature-grid>img,
.story-grid>img,
.split-grid>img,
.evidence>img,
.experience>img,
.real img{
  width:min(100%,480px)!important;
  max-width:480px!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center!important;
}

/* Product photography: no stretching; cards stay compact. */
.product img{
  width:min(100%,320px)!important;
  max-width:320px!important;
  height:auto!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  margin-inline:auto;
}

/* More human-scale visual rhythm on desktop. */
@media(min-width:851px){
  .hero-grid,
  .process-grid,.consult-grid,.editorial-grid,.atendimento-grid,
  .inspect-grid,.scene-grid,.ambiance-grid,.care-grid,.feature-grid,
  .story-grid,.split-grid,.evidence,.experience,.real{
    align-items:center!important;
  }
  .hero{padding-top:48px!important;padding-bottom:52px!important}
  .section{padding-top:62px!important;padding-bottom:62px!important}
}

/* Aurora is a special full-width editorial layout in the base theme. */
@media(min-width:851px){
  body .hero>img{
    width:min(52vw,650px)!important;
    max-width:650px!important;
    height:auto!important;
    min-height:0!important;
    object-fit:contain!important;
    align-self:center!important;
    justify-self:center!important;
  }
}

/* Tablet. */
@media(max-width:850px){
  .hero{min-height:0!important}
  .hero-img,
  .hero-grid>img,
  .hero-card>img,
  .hero>img{
    width:min(100%,520px)!important;
    max-width:520px!important;
    height:auto!important;
    margin-inline:auto!important;
  }
  .process-grid>img,
  .consult-grid>img,
  .editorial-grid>img,
  .atendimento-grid>img,
  .inspect-grid>img,
  .scene-grid>img,
  .ambiance-grid>img,
  .care-grid>img,
  .feature-grid>img,
  .story-grid>img,
  .split-grid>img,
  .evidence>img,
  .experience>img,
  .real img{
    width:min(100%,460px)!important;
    max-width:460px!important;
    margin-inline:auto!important;
  }
}

/* Phone: photographs are intentionally smaller than the whole viewport
   when space permits. This makes text/services the primary content. */
@media(max-width:620px){
  .hero{padding-top:26px!important;padding-bottom:34px!important}
  .section{padding-top:38px!important;padding-bottom:38px!important}

  .hero-img,
  .hero-grid>img,
  .hero-card>img,
  .hero>img{
    width:min(100%,390px)!important;
    max-width:390px!important;
    height:auto!important;
    margin-inline:auto!important;
    border-radius:16px!important;
  }

  .process-grid>img,
  .consult-grid>img,
  .editorial-grid>img,
  .atendimento-grid>img,
  .inspect-grid>img,
  .scene-grid>img,
  .ambiance-grid>img,
  .care-grid>img,
  .feature-grid>img,
  .story-grid>img,
  .split-grid>img,
  .evidence>img,
  .experience>img,
  .real img{
    width:min(100%,350px)!important;
    max-width:350px!important;
    height:auto!important;
    margin-inline:auto!important;
  }

  .product img{
    width:min(100%,300px)!important;
    max-width:300px!important;
  }

  .brand img,.logo img{
    max-width:168px!important;
    max-height:46px!important;
  }
}

/* Tiny phones. */
@media(max-width:390px){
  .hero-img,
  .hero-grid>img,
  .hero-card>img,
  .hero>img,
  .process-grid>img,
  .consult-grid>img,
  .editorial-grid>img,
  .atendimento-grid>img,
  .inspect-grid>img,
  .scene-grid>img,
  .ambiance-grid>img,
  .care-grid>img,
  .feature-grid>img,
  .story-grid>img,
  .split-grid>img,
  .evidence>img,
  .experience>img,
  .real img{
    width:min(100%,320px)!important;
    max-width:320px!important;
  }
}

/* -------- Theme selector: fixed, readable and visibly active -------- */
.site-theme-tools{
  position:fixed!important;
  left:max(12px,env(safe-area-inset-left))!important;
  bottom:max(12px,env(safe-area-inset-bottom))!important;
  z-index:9997!important;
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  padding:5px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.94)!important;
  color:#25262a!important;
  border:1px solid rgba(20,20,24,.13)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.16)!important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.site-theme-tools button{
  appearance:none!important;
  border:0!important;
  background:transparent!important;
  color:inherit!important;
  min-height:38px!important;
  padding:7px 10px!important;
  border-radius:11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  cursor:pointer!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
}
.site-theme-tools button svg{
  width:16px!important;
  height:16px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
}
.site-theme-tools button[aria-pressed="true"],
.site-theme-tools button.is-active{
  background:#202126!important;
  color:#fff!important;
}
html[data-theme="dark"] .site-theme-tools{
  background:rgba(27,28,32,.95)!important;
  color:#f4f5f6!important;
  border-color:rgba(255,255,255,.14)!important;
}
html[data-theme="dark"] .site-theme-tools button[aria-pressed="true"],
html[data-theme="dark"] .site-theme-tools button.is-active{
  background:#fff!important;
  color:#18191c!important;
}

/* -------- WhatsApp: standard round icon + separate clean label -------- */
.whatsapp-float{
  position:fixed!important;
  right:max(14px,env(safe-area-inset-right))!important;
  bottom:max(14px,env(safe-area-inset-bottom))!important;
  z-index:9998!important;
  display:flex!important;
  flex-direction:row-reverse!important;
  align-items:center!important;
  gap:8px!important;
  padding:0!important;
  background:transparent!important;
  color:inherit!important;
  text-decoration:none!important;
  box-shadow:none!important;
  transform:none!important;
}
.whatsapp-float:hover{transform:none!important}
.whatsapp-float img{
  width:54px!important;
  height:54px!important;
  flex:0 0 54px!important;
  border-radius:50%!important;
  border:3px solid #fff!important;
  background:#25d366!important;
  box-shadow:0 8px 22px rgba(0,0,0,.25)!important;
}
.whatsapp-float .wa-copy{
  display:block!important;
  padding:9px 12px!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.96)!important;
  color:#172019!important;
  border:1px solid rgba(0,0,0,.10)!important;
  box-shadow:0 7px 20px rgba(0,0,0,.14)!important;
  font:800 13px/1.15 Arial,sans-serif!important;
  white-space:nowrap!important;
}
.whatsapp-float .wa-copy small{display:none!important}
.whatsapp-float .wa-copy span{display:block!important}
html[data-theme="dark"] .whatsapp-float .wa-copy{
  background:rgba(28,29,32,.96)!important;
  color:#f7f8f8!important;
  border-color:rgba(255,255,255,.13)!important;
}

@media(max-width:620px){
  .site-theme-tools{
    left:8px!important;
    bottom:8px!important;
    max-width:calc(100vw - 78px)!important;
    gap:1px!important;
    padding:4px!important;
  }
  .site-theme-tools button{
    min-width:36px!important;
    padding:7px!important;
  }
  .site-theme-tools button span{display:none!important}

  .whatsapp-float{
    right:9px!important;
    bottom:9px!important;
  }
  .whatsapp-float img{
    width:52px!important;
    height:52px!important;
    flex-basis:52px!important;
  }
  .whatsapp-float .wa-copy{display:none!important}
  body{padding-bottom:70px!important}
}
