/* Artes Flores · Identidade "Terracota Viva"
   Base compartilhada pelas 4 propostas de site. */
:root{
  --terracota:#9F452D;      /* cor exata do fundo do logo */
  --terracota-esc:#7E3421;
  --nogueira:#5B3424;
  --couro:#D9B48F;
  --linho:#F3E9DF;
  --linho-2:#EADCCD;
  --cafe:#2A1A14;
  --tinta:#3A2219;
  --muted:#7C6153;
  --line:#DCC7B6;

  --display:"Cormorant Garamond", "Times New Roman", Georgia, serif;
  --body:"Jost", "Segoe UI", system-ui, sans-serif;

  --gx-l:max(20px, env(safe-area-inset-left, 0px));
  --gx-r:max(20px, env(safe-area-inset-right, 0px));
  --max:1200px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--linho);color:var(--tinta);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.05;margin:0;text-wrap:balance;letter-spacing:-.01em}
p{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--terracota);outline-offset:3px}

.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gx-l);padding-right:var(--gx-r)}
.eyebrow{font-family:var(--body);font-size:.74rem;font-weight:500;letter-spacing:.32em;text-transform:uppercase;color:var(--terracota)}
.lead{font-size:1.1rem;color:var(--muted);max-width:56ch}
.it{font-style:italic}

/* Logo original extraído de logo.jpg com fundo transparente (scripts/extrair_logo.py).
   Padrão terracota para fundos claros; .on-dark usa linho para fundos escuros ou terracota. */
.logo{display:block;flex:none;width:clamp(150px,17vw,200px);aspect-ratio:996/234;
  background:url("logo-terracota.png") center/contain no-repeat}
.logo.on-dark,.foot .logo{background-image:url("logo-linho.png")}
.logo-a{font-family:var(--display);font-style:italic;font-weight:600}

/* Botões */
.btn{display:inline-flex;align-items:center;gap:.6em;font-family:var(--body);font-weight:500;font-size:.95rem;letter-spacing:.02em;
  padding:.85em 1.5em;border-radius:2px;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn-primary{background:var(--terracota);color:#fff}
.btn-primary:hover{background:var(--terracota-esc)}
.btn-light{background:var(--linho);color:var(--terracota)}
.btn-light:hover{background:#fff}
.btn-ghost{border-color:currentColor;background:transparent}
.btn-ghost:hover{background:rgba(159,69,45,.08)}
.btn svg{width:1.15em;height:1.15em;flex:none}

/* Carrossel (comportamento em carousel.js) */
.car{position:relative}
.car-track{position:relative;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.car-track::-webkit-scrollbar{display:none}
.car-slide{flex:0 0 100%;scroll-snap-align:center;margin:0}
.car-slide img{width:100%;height:auto;aspect-ratio:1080/1350;object-fit:contain;background:var(--linho-2)}
.car-btn{width:46px;height:46px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;
  background:rgba(243,233,223,.92);color:var(--terracota);box-shadow:0 2px 10px rgba(42,26,20,.18);transition:transform .2s,opacity .2s}
.car-btn:hover{transform:scale(1.06)}
.car-btn[disabled]{opacity:.35;cursor:default;transform:none}
.car-btn svg{width:20px;height:20px}
.car-dots{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.car-dots button{width:8px;height:8px;border-radius:99px;border:0;padding:0;background:var(--line);cursor:pointer;transition:width .25s,background .25s}
.car-dots button[aria-current="true"]{width:26px;background:var(--terracota)}
.car-count{font-variant-numeric:tabular-nums;font-size:.85rem;letter-spacing:.12em}

/* Rodapé comum */
.foot{background:var(--cafe);color:#E9DCCE;padding-block:56px 32px;font-size:.92rem}
.foot .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.foot h4{font-family:var(--body);font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--couro);margin:0 0 12px;font-weight:500}
.foot a{color:#E9DCCE;text-decoration:none;border-bottom:1px solid rgba(233,220,206,.25)}
.foot a:hover{border-color:var(--couro)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.foot .legal{grid-column:1/-1;border-top:1px solid rgba(233,220,206,.15);padding-top:20px;color:#A8917F;font-size:.8rem}
@media (max-width:760px){.foot .wrap{grid-template-columns:1fr}}

/* Botão flutuante de WhatsApp */
.wa-float{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:40;
  width:56px;height:56px;border-radius:50%;background:var(--terracota);color:#fff;display:grid;place-items:center;box-shadow:0 6px 20px rgba(42,26,20,.3)}
.wa-float svg{width:28px;height:28px}
