/* ===================================================
   KPRI — Sistema de Design
   Paper + ink + wine + blush + gold hairline
=================================================== */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500;1,600&family=Italiana&family=Jost:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

:root{
  --paper:#fffaf3;
  --paper-2:#f4ede5;
  --ink:#15110F;
  --ink-soft:rgba(21,17,15,0.78);
  --ink-faint:rgba(21,17,15,0.58);
  --wine:#6b1f2c;
  --wine-bright:#8d3341;
  --blush:#ead2cb;
  --blush-2:#dcb7ae;
  --plum:#1d0c10;
  --plum-2:#110609;
  --gold:#c49a63;
  --line:rgba(21,17,15,0.16);
  --line-on-dark:rgba(255,250,243,0.2);
  --radius:2px;
  --shadow:0 26px 70px rgba(29,12,16,0.18);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
html,body{max-width:100%; overflow-x:hidden;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Jost', sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  font-size:16px;
  line-height:1.5;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1160px; margin:0 auto; padding:0 32px;}

h1,h2,h3,.display{
  font-family:'Cormorant Garamond', 'Italiana', serif;
  font-weight:500;
  letter-spacing:0;
  line-height:1.12;
  text-rendering:geometricPrecision;
}

.eyebrow{
  font-size:11.5px; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--wine); font-weight:600;
  display:flex; align-items:center; gap:12px;
}
.eyebrow::before{content:''; width:28px; height:1px; background:var(--gold);}
.eyebrow.on-dark{color:var(--blush-2);}

/* ===== BUTTONS ===== */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'Jost', sans-serif; font-size:13px; font-weight:600;
  letter-spacing:0.05em; text-transform:uppercase;
  padding:14px 28px;
  border:1px solid var(--ink);
  transition:all .25s ease;
  cursor:pointer;
  white-space:nowrap;
}
.btn-dark{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.btn-dark:hover{background:transparent; color:var(--ink);}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--ink);}
.btn-ghost:hover{background:var(--ink); color:var(--paper);}
.btn-on-dark{border-color:var(--paper); color:var(--paper);}
.btn-on-dark:hover{background:var(--paper); color:var(--plum);}

/* ===== HEADER ===== */
.topbar{
  background:linear-gradient(90deg,var(--plum),var(--wine),var(--plum));
  color:#fff7ec;
  border-bottom:1px solid rgba(196,154,99,0.28);
  box-shadow:0 10px 30px rgba(29,12,16,0.16);
}
.topbar .wrap{
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding-top:8px;
  padding-bottom:8px;
  overflow:hidden;
}
.topbar-text{
  color:#fffaf3;
  font-size:11px;
  font-weight:700;
  letter-spacing:0.11em;
  text-transform:uppercase;
  white-space:nowrap;
  flex:0 0 auto;
}
.brand-ticker{
  position:relative;
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.brand-track{
  display:flex;
  align-items:center;
  width:max-content;
  gap:8px;
  animation:kpriTicker 24s linear infinite;
}
.brand-ticker:hover .brand-track{animation-play-state:paused;}
.brand-track a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:6px 14px;
  border:1px solid rgba(196,154,99,0.86);
  border-radius:999px;
  background:linear-gradient(180deg,#fffaf3,#ead7bd);
  color:var(--wine);
  font-size:10.5px;
  font-weight:800;
  letter-spacing:0.08em;
  text-transform:uppercase;
  backdrop-filter:blur(10px);
  box-shadow:0 4px 14px rgba(17,6,9,0.18), inset 0 1px 0 rgba(255,255,255,0.7);
  transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.brand-track a:hover{
  background:linear-gradient(180deg,#f8ead1,#c49a63);
  border-color:#fffaf3;
  color:var(--plum);
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(17,6,9,0.26), inset 0 1px 0 rgba(255,255,255,0.76);
}
.brand-track a:nth-child(6n+1){
  background:linear-gradient(180deg,#fff6f4,#f0c8bf);
  color:#6b1f2c;
}
.brand-track a:nth-child(6n+2){
  background:linear-gradient(180deg,#fff9ef,#f1d79d);
  color:#553019;
}
.brand-track a:nth-child(6n+3){
  background:linear-gradient(180deg,#fff2f6,#e8adc0);
  color:#76243b;
}
.brand-track a:nth-child(6n+4){
  background:linear-gradient(180deg,#eff9ef,#b8dcb1);
  color:#24572f;
}
.brand-track a:nth-child(6n+5){
  background:linear-gradient(180deg,#f8f1ff,#d8c2f0);
  color:#4a2f68;
}
.brand-track a:nth-child(6n+6){
  background:linear-gradient(180deg,#fff4e7,#e4b576);
  color:#5a2a16;
}
@keyframes kpriTicker{
  from{transform:translateX(0);}
  to{transform:translateX(calc(-50% - 4px));}
}
@media(max-width:760px){
  .topbar .wrap{align-items:center; flex-direction:column; gap:8px;}
  .topbar-text{white-space:normal; line-height:1.35;}
  .brand-ticker{width:100%;}
  .brand-track{animation-duration:20s;}
}
header.site{
  position:sticky; top:0; z-index:100;
  background:rgba(255,250,243,0.9);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
  box-shadow:0 12px 42px rgba(29,12,16,0.06);
}
header.site .wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:20px; padding-bottom:20px;
}
.logo{
  font-family:'Italiana', serif; font-size:24px; letter-spacing:0.14em;
}
nav.mainnav{display:flex; align-items:center; gap:34px;}
nav.mainnav a{
  font-size:13px; letter-spacing:0.04em; text-transform:uppercase;
  color:rgba(21,17,15,0.82); font-weight:600;
  padding-bottom:4px; border-bottom:1px solid transparent;
  transition:all .2s ease;
}
nav.mainnav a:hover, nav.mainnav a.active{color:var(--ink); border-color:var(--gold);}
.navtoggle{display:none;}

@media(max-width:860px){
  nav.mainnav{
    position:fixed; inset:0 0 0 auto; width:78%; max-width:320px;
    background:var(--paper); flex-direction:column; align-items:flex-start;
    padding:100px 32px 32px; gap:26px; transform:translateX(100%);
    transition:transform .35s ease; box-shadow:-10px 0 30px rgba(0,0,0,0.08);
  }
  nav.mainnav.open{transform:translateX(0);}
  .navtoggle{
    display:block; background:none; border:none; cursor:pointer;
    font-family:'Jost'; font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--ink);
  }
}

@media(max-width:640px){
  .wrap{padding-left:22px; padding-right:22px;}
  h1,h2,h3,.display{
    line-height:1.16;
    padding-left:0.03em;
    overflow:visible;
  }
  .section{padding:72px 0;}
  .section-tight{padding:48px 0;}
  .pagehero{padding:46px 0 42px;}
  .pagehero h1{font-size:clamp(30px,10vw,42px);}
}

/* ===== FOOTER ===== */
footer.site{
  background:linear-gradient(145deg,var(--plum),var(--plum-2));
  color:rgba(255,250,243,0.78);
  padding:64px 0 32px; margin-top:0;
}
footer.site .foot-grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px;
  padding-bottom:44px; border-bottom:1px solid var(--line-on-dark);
}
footer.site .logo{color:var(--paper); margin-bottom:14px;}
footer.site p{font-size:13.5px; line-height:1.7; max-width:320px; color:rgba(255,250,243,0.72);}
footer.site h4{
  font-family:'Jost'; font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--gold); font-weight:600; margin-bottom:16px;
}
footer.site ul{list-style:none;}
footer.site li{margin-bottom:10px;}
footer.site a{color:rgba(255,250,243,0.78);}
footer.site a:hover{color:#fff7ec;}
.foot-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:26px; font-size:12px; color:rgba(255,250,243,0.62); flex-wrap:wrap; gap:12px;
}
@media(max-width:700px){
  footer.site .foot-grid{grid-template-columns:1fr; gap:32px;}
}

/* ===== SHARED SECTIONS ===== */
.section{padding:96px 0;}
.section-tight{padding:64px 0;}
.section.on-blush{background:linear-gradient(180deg,#f0dbd3,#ead2cb);}
.section.on-plum{background:var(--plum); color:rgba(251,250,248,0.85);}
.section.on-plum h2, .section.on-plum h3{color:var(--paper);}

.divider{height:1px; background:var(--line); border:none; margin:0;}

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;}
@media(max-width:800px){.grid-2{grid-template-columns:1fr; gap:40px;}}

.tag{
  display:inline-block; font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
  font-weight:600; color:var(--wine); background:var(--blush);
  padding:5px 12px; border-radius:100px; margin-bottom:14px;
}

/* ===== VER LOJA (caixa flutuante) ===== */
.verloja{
  position:fixed; right:22px; bottom:22px; z-index:200;
  display:flex; align-items:center; gap:10px;
  background:var(--wine); color:var(--paper);
  padding:14px 20px; border-radius:100px;
  box-shadow:0 10px 24px rgba(21,17,15,0.22);
  font-size:13px; font-weight:600; letter-spacing:0.03em; text-transform:uppercase;
  transition:transform .2s ease, box-shadow .2s ease;
}
.verloja:hover{transform:translateY(-2px); box-shadow:0 14px 30px rgba(21,17,15,0.28);}
.verloja .dot{width:7px; height:7px; border-radius:50%; background:var(--gold); flex-shrink:0;}
@media(max-width:600px){
  .verloja{right:14px; bottom:14px; padding:12px 16px; font-size:12px;}
}

/* Page hero (interior pages) */
.pagehero{padding:64px 0 56px; border-bottom:1px solid var(--line);}
.pagehero h1{font-size:clamp(34px,5vw,52px); font-style:italic; max-width:640px;}
.pagehero p{margin-top:18px; max-width:480px; color:var(--ink-soft); font-size:15.5px; line-height:1.65;}

.photo-panel{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(196,154,99,0.34);
  box-shadow:var(--shadow);
  background:var(--plum);
}
.photo-panel::before{
  content:"";
  position:absolute;
  inset:10px;
  border:1px solid rgba(255,250,243,0.34);
  z-index:1;
  pointer-events:none;
}
.photo-panel img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.photo-panel::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(29,12,16,0.02),rgba(29,12,16,0.18));
  pointer-events:none;
}
.luxury-image-grid{
  display:grid;
  grid-template-columns:1.15fr 0.85fr;
  gap:18px;
  margin-top:54px;
}
.luxury-image-grid .photo-panel{min-height:280px;}
.luxury-image-grid .photo-panel:first-child{min-height:420px;}
@media(max-width:800px){
  .luxury-image-grid{grid-template-columns:1fr;}
  .luxury-image-grid .photo-panel,
  .luxury-image-grid .photo-panel:first-child{min-height:260px;}
}

.whatsapp-float{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:240;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#1f8f55;
  color:#fff;
  box-shadow:0 16px 34px rgba(21,17,15,0.24);
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}
.whatsapp-float:hover{
  transform:translateY(-3px);
  background:#177a48;
  box-shadow:0 20px 42px rgba(21,17,15,0.3);
}
.whatsapp-float svg{
  width:28px;
  height:28px;
  fill:currentColor;
}
@media(max-width:600px){
  .whatsapp-float{right:15px; bottom:15px; width:54px; height:54px;}
}

@media(max-width:640px){
  .wrap{padding-left:22px; padding-right:22px;}
  h1,h2,h3,.display{
    line-height:1.16;
    padding-left:0.03em;
    overflow:visible;
  }
  .section{padding:72px 0;}
  .section-tight{padding:48px 0;}
  .pagehero{padding:46px 0 42px;}
  .pagehero h1{font-size:clamp(30px,10vw,42px);}
}
