/* =========================================================
   GRAFIDOON — Gráfica em Condeixa
   Conceito: "prova de impressão" — o site como uma folha
   saída da máquina: papel rasgado, marcas de corte/registo,
   desregisto CMYK, grão, tipografia de cartaz.
   ========================================================= */

:root{
  --k: #0b0b0c;          /* rich black */
  --k-soft: #17171a;
  --paper: #f6f3ec;      /* papel */
  --paper-2: #ffffff;
  --gold: #d4af37;
  --gold-soft: #f1dc9a;
  --cyan: #00aeef;
  --magenta: #ec008c;
  --yellow: #ffc20e;
  --ink-grey: #55555c;
  --radius: 16px;
  --shadow: 0 20px 50px -20px rgba(0,0,0,.4);
  --maxw: 1180px;
  --ff-poster: 'Anton', 'Space Grotesk', system-ui, sans-serif;
  --ff-display: 'Space Grotesk', 'Poppins', system-ui, sans-serif;
  --ff-body: 'Inter', system-ui, -apple-system, sans-serif;
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--ff-body);
  color: var(--k);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  position: relative;
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Ccircle cx='14' cy='14' r='9' fill='none' stroke='%230b0b0c' stroke-width='1.4'/%3E%3Cline x1='14' y1='0' x2='14' y2='7' stroke='%230b0b0c' stroke-width='1.4'/%3E%3Cline x1='14' y1='21' x2='14' y2='28' stroke='%230b0b0c' stroke-width='1.4'/%3E%3Cline x1='0' y1='14' x2='7' y2='14' stroke='%230b0b0c' stroke-width='1.4'/%3E%3Cline x1='21' y1='14' x2='28' y2='14' stroke='%230b0b0c' stroke-width='1.4'/%3E%3Ccircle cx='14' cy='14' r='1.6' fill='%23ec008c'/%3E%3C/svg%3E") 14 14, crosshair;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4{ font-family: var(--ff-display); margin:0 0 .4em; line-height:1.1; letter-spacing:-.01em; }
p{ margin:0 0 1em; color: var(--ink-grey); line-height:1.65; }
button{ font-family: inherit; cursor:pointer; }
.container{ max-width: var(--maxw); margin:0 auto; padding: 0 24px; position:relative; }
section{ padding: 110px 0; position:relative; }
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family: var(--ff-display); font-weight:600; font-size:.8rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--gold);
  margin-bottom:14px;
}
.eyebrow::before{
  content:""; width:8px; height:8px; border-radius:50%;
  background: conic-gradient(var(--cyan) 0 25%, var(--magenta) 25% 50%, var(--yellow) 50% 75%, var(--k) 75% 100%);
}
.section-head{ max-width: 640px; margin-bottom: 52px; position:relative; }
.section-head h2{
  font-family: var(--ff-poster); font-weight:400; text-transform:uppercase;
  font-size: clamp(2.4rem, 6vw, 4.4rem); letter-spacing:.005em; line-height:.95;
}
.sec-num{
  position:absolute; top:-.5em; right:-8px; font-family: var(--ff-poster); font-weight:400;
  font-size: clamp(3.5rem, 11vw, 8rem); line-height:1; color: transparent;
  -webkit-text-stroke: 1.5px currentColor; opacity:.14; pointer-events:none; z-index:0;
  user-select:none;
}
.services .sec-num, .contact .sec-num{ color: var(--paper); }
.about .sec-num, .portfolio .sec-num{ color: var(--k); }

/* ---------- grain + global trim marks ---------- */
body::before{
  content:""; position:fixed; inset:0; z-index:9998; pointer-events:none;
  opacity:.05; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body::after{
  content:""; position:fixed; inset:14px; z-index:9997; pointer-events:none; opacity:.4;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cline x1='10' y1='0' x2='10' y2='7' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='10' y1='13' x2='10' y2='20' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='0' y1='10' x2='7' y2='10' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='13' y1='10' x2='20' y2='10' stroke='%230b0b0c' stroke-width='1'/%3E%3Ccircle cx='10' cy='10' r='3' fill='none' stroke='%230b0b0c' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cline x1='10' y1='0' x2='10' y2='7' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='10' y1='13' x2='10' y2='20' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='0' y1='10' x2='7' y2='10' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='13' y1='10' x2='20' y2='10' stroke='%230b0b0c' stroke-width='1'/%3E%3Ccircle cx='10' cy='10' r='3' fill='none' stroke='%230b0b0c' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cline x1='10' y1='0' x2='10' y2='7' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='10' y1='13' x2='10' y2='20' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='0' y1='10' x2='7' y2='10' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='13' y1='10' x2='20' y2='10' stroke='%230b0b0c' stroke-width='1'/%3E%3Ccircle cx='10' cy='10' r='3' fill='none' stroke='%230b0b0c' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cline x1='10' y1='0' x2='10' y2='7' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='10' y1='13' x2='10' y2='20' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='0' y1='10' x2='7' y2='10' stroke='%230b0b0c' stroke-width='1'/%3E%3Cline x1='13' y1='10' x2='20' y2='10' stroke='%230b0b0c' stroke-width='1'/%3E%3Ccircle cx='10' cy='10' r='3' fill='none' stroke='%230b0b0c' stroke-width='1'/%3E%3C/svg%3E");
  background-position: top left, top right, bottom left, bottom right;
  background-repeat:no-repeat;
}
@media (max-width: 720px){ body::after{ display:none; } }

/* ---------- torn-paper section divider (use as ::before on a section) ---------- */
.torn{ position:relative; }
.torn::before{
  content:""; position:absolute; top:-1px; left:0; right:0; height:34px; z-index:2;
  background: var(--tear-color, var(--paper));
  clip-path: polygon(0% 100%,3% 40%,7% 90%,12% 30%,17% 85%,22% 20%,28% 95%,33% 35%,38% 80%,44% 15%,50% 90%,56% 25%,61% 75%,67% 10%,72% 88%,78% 30%,83% 95%,89% 20%,94% 80%,100% 35%,100% 100%);
}

/* ---------- misregistration text (CMYK misprint) ---------- */
.misprint{ position:relative; display:inline-block; }
.misprint::before, .misprint::after{
  content: attr(data-text); position:absolute; left:0; top:0; width:100%; z-index:-1;
  opacity:.85;
}
.misprint::before{ color: var(--cyan); transform: translate(3px,2px); }
.misprint::after{ color: var(--magenta); transform: translate(-3px,-2px); }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding: 14px 26px; border-radius: 999px; border:2px solid var(--k);
  font-family: var(--ff-display); font-weight:700; font-size:.95rem;
  background: var(--k); color:var(--paper); transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
  white-space:nowrap;
}
.btn:hover{ transform: translateY(-2px) rotate(-1deg); box-shadow: var(--shadow); }
.btn:active{ transform: scale(.94) rotate(1deg); }
.btn.btn-outline{ background: transparent; color: var(--k); }
.btn.btn-gold{ background: var(--gold); border-color: var(--gold); color: var(--k); }
.btn.btn-whatsapp{ background:#25D366; border-color:#25D366; color:#06210f; }
.btn svg{ width:18px; height:18px; }

/* ================= HEADER ================= */
.site-header{
  position: sticky; top:0; z-index: 100;
  background: rgba(246,243,236,.88); backdrop-filter: blur(10px);
  border-bottom: 2px dashed rgba(11,11,12,.18);
}
.nav{ display:flex; align-items:center; justify-content:space-between; padding: 16px 24px; max-width: var(--maxw); margin:0 auto; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand-mark{
  width:48px; height:48px;
  display:flex; align-items:center; justify-content:center; flex:none;
  transition: transform .25s ease;
}
.brand:hover .brand-mark{ transform: rotate(-8deg) scale(1.06); }
.brand-mark img{ width:100%; height:100%; object-fit:contain; }
.brand-word{ font-family: var(--ff-poster); font-weight:400; text-transform:uppercase; font-size:1.3rem; letter-spacing:.01em; }
.brand-word em{ font-style:normal; color: var(--gold); }
.brand-tagline{ display:block; font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color: var(--ink-grey); font-family: var(--ff-body); margin-top:1px;}

.nav-links{ display:flex; align-items:center; gap:34px; }
.nav-links a{
  font-family: var(--ff-display); font-weight:700; font-size:.9rem; position:relative; padding: 4px 0;
  text-transform:uppercase; letter-spacing:.03em;
}
.nav-links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-2px; height:3px;
  background: linear-gradient(90deg,var(--cyan),var(--magenta),var(--yellow));
  transition: right .25s ease;
}
.nav-links a:hover{ text-shadow: 2px 0 var(--cyan), -2px 0 var(--magenta); }
.nav-links a:hover::after{ right:0; }
.nav-cta{ display:flex; align-items:center; gap:12px; }
.nav-toggle{
  display:none; background:none; border:none; padding:8px; margin-left:8px;
}
.nav-toggle svg{ width:26px; height:26px; }

@media (max-width: 880px){
  .nav-links{
    position:fixed; inset: 78px 16px auto 16px; background: var(--paper-2);
    border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px;
    flex-direction:column; align-items:flex-start; gap:18px; border:2px dashed var(--k);
    transform: translateY(-12px); opacity:0; pointer-events:none; transition: all .22s ease;
  }
  .nav-links.open{ transform:none; opacity:1; pointer-events:auto; }
  .nav-toggle{ display:inline-flex; }
  .nav-cta .btn span{ display:none; }
}

/* ================= HERO ================= */
.hero{
  padding: 60px 0 40px;
  overflow:hidden;
}
.hero-watermark{
  position:absolute; top:-.3em; left:-.02em; z-index:0; pointer-events:none; user-select:none;
  font-family: var(--ff-poster); font-weight:400; text-transform:uppercase;
  font-size: clamp(4rem, 16vw, 11rem); line-height:1; color:transparent;
  -webkit-text-stroke: 1.4px rgba(11,11,12,.1); white-space:nowrap;
}
.hero-grid{
  display:grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items:center;
  position:relative; z-index:1;
}
.hero h1{
  font-family: var(--ff-poster); font-weight:400; text-transform:uppercase;
  font-size: clamp(2.6rem, 6.4vw, 4.6rem); letter-spacing:0; line-height:.96;
}
.hero h1 .hl{
  background: linear-gradient(92deg, var(--cyan), var(--magenta) 45%, var(--yellow) 85%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-lead{ font-size:1.08rem; max-width: 46ch; }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top: 28px; }
.hero-meta{ display:flex; gap:26px; margin-top:42px; flex-wrap:wrap; }
.hero-meta div{ display:flex; align-items:center; gap:10px; color: var(--k); font-family: var(--ff-display); font-weight:600; font-size:.88rem; }
.hero-meta svg{ width:20px; height:20px; color: var(--gold); flex:none; }

.hero-visual{ position:relative; aspect-ratio: 1/1; }
.cmyk-plate{
  position:absolute; inset:0; overflow:hidden;
  background: var(--k);
  box-shadow: var(--shadow);
  clip-path: polygon(0 0, 96% 0, 100% 6%, 100% 100%, 4% 100%, 0 92%);
  transform: rotate(-1.4deg);
}
.cmyk-plate .dot{
  position:absolute; border-radius:50%; mix-blend-mode: screen; filter: blur(0px);
}
.cmyk-plate .dot.c{ background: var(--cyan); width:62%; height:62%; top:6%; left:2%; }
.cmyk-plate .dot.m{ background: var(--magenta); width:58%; height:58%; bottom:4%; left:20%; }
.cmyk-plate .dot.y{ background: var(--yellow); width:55%; height:55%; top:18%; right:0; }
.cmyk-plate .plate-mark{
  position:absolute; color: var(--paper); display:flex; align-items:center; gap:8px; font-family: var(--ff-display); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; z-index:2;
}
.cmyk-plate .plate-mark.tl{ top:18px; left:18px; }
.cmyk-plate .plate-mark.tr{ top:18px; right:18px; }
.cmyk-plate .plate-mark.bl{ bottom:18px; left:18px; }
.cmyk-plate .plate-mark.br{ bottom:18px; right:18px; }
.cmyk-plate .plate-word{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  text-align:center; padding: 14%; transform: rotate(1.4deg);
}
.cmyk-plate .plate-word img{
  width:100%; height:auto; object-fit:contain;
  filter: drop-shadow(0 8px 30px rgba(0,0,0,.55));
}
.crosshair-mark{ width:16px; height:16px; position:relative; flex:none; }
.crosshair-mark::before,.crosshair-mark::after{ content:""; position:absolute; background:currentColor; }
.crosshair-mark::before{ left:50%; top:0; bottom:0; width:1.4px; transform:translateX(-50%); }
.crosshair-mark::after{ top:50%; left:0; right:0; height:1.4px; transform:translateY(-50%); }

@media (max-width: 900px){
  .hero-grid{ grid-template-columns: 1fr; }
  .hero-visual{ aspect-ratio: 16/10; }
}

/* ================= MARQUEE STRIP ================= */
.strip{
  background: var(--k); color: var(--paper); overflow:hidden; padding: 16px 0;
  border-top:3px solid var(--gold); border-bottom:1px solid rgba(212,175,55,.4);
  transform: skewY(-1deg); margin: -14px 0; position:relative; z-index:3;
}
.strip-track{ display:flex; gap:56px; width:max-content; animation: marquee 24s linear infinite; }
.strip-track span{ font-family: var(--ff-poster); font-weight:400; text-transform:uppercase; letter-spacing:.03em; font-size:1.3rem; display:flex; align-items:center; gap:20px; color: var(--gold-soft); }
.strip-track span::after{ content:"✂"; color: var(--magenta); font-size:.9rem; }
.strip.rev{ background: var(--paper-2); color:var(--k); border-top-color: var(--k); transform: skewY(1deg); margin-top:-20px; }
.strip.rev .strip-track{ animation-direction: reverse; animation-duration: 30s; }
.strip.rev .strip-track span{ color: var(--k); font-size:1rem; -webkit-text-stroke: .6px var(--k); }
.strip.rev .strip-track span::after{ content:"◆"; color: var(--cyan); font-size:.6rem; }
@keyframes marquee{ from{ transform: translateX(0);} to{ transform: translateX(-50%);} }

/* ================= ABOUT ================= */
.about{ background: var(--paper-2); --tear-color: var(--paper-2); }
.about-grid{ display:grid; grid-template-columns: .9fr 1.1fr; gap:56px; align-items:start; }
.about-badges{ display:grid; grid-template-columns: 1fr 1fr; gap:16px; margin-top: 8px; }
.badge-card{
  background: var(--paper); border-radius: 4px; padding: 20px; border:1.5px dashed rgba(11,11,12,.25);
  transition: transform .2s ease, border-color .2s ease, border-style .2s ease;
}
.badge-card:nth-child(odd){ transform: rotate(-1deg); }
.badge-card:nth-child(even){ transform: rotate(1deg); }
.badge-card:hover{ transform: rotate(0) translateY(-3px); border-style: solid; border-color: var(--magenta); }
.badge-card svg{ width:26px; height:26px; color: var(--magenta); margin-bottom:10px; }
.badge-card h4{ font-size:.95rem; margin-bottom:4px; }
.badge-card p{ font-size:.85rem; margin:0; }

/* ================= SERVICES ================= */
.services{ background: var(--k); color: var(--paper); position:relative; --tear-color: var(--k); }
.services .section-head h2, .services .eyebrow{ color: var(--paper); }
.services .eyebrow{ color: var(--yellow); }
.services p.lead{ color: rgba(246,243,236,.7); }
.service-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:22px; position:relative; z-index:1; }
.service-card{
  background: var(--k-soft); border-radius: 4px; padding: 30px 24px;
  border: 1.5px solid rgba(212,175,55,.18); position:relative;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.service-card::after{
  content: attr(data-index); position:absolute; top:12px; right:16px; font-family: var(--ff-poster);
  font-size:2.2rem; color: rgba(212,175,55,.12); line-height:1; pointer-events:none;
}
.service-card:hover{ border-color: var(--gold); transform: translateY(-5px) rotate(-.6deg); box-shadow: 6px 10px 0 rgba(212,175,55,.15); }
.service-icon{
  width:52px; height:52px; border-radius: 4px; display:flex; align-items:center; justify-content:center;
  margin-bottom:18px; transform: rotate(-4deg);
}
.service-icon svg{ width:26px; height:26px; color: var(--k); }
.service-card h3{ font-size:1.12rem; color: var(--paper); text-transform:uppercase; letter-spacing:.01em; }
.service-card p{ color: rgba(246,243,236,.65); font-size:.92rem; margin-bottom:0; }

@media (max-width: 900px){ .service-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px){ .service-grid{ grid-template-columns: 1fr; } }

/* ================= PORTFOLIO ================= */
.portfolio{ background: var(--paper); --tear-color: var(--paper); }
.portfolio-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; }
.filters{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom: 36px; }
.filter-btn{
  padding: 9px 18px; border-radius: 999px; border: 1.5px dashed rgba(11,11,12,.3);
  background: transparent; font-family: var(--ff-display); font-weight:700; font-size:.8rem;
  text-transform:uppercase; letter-spacing:.02em;
  color: var(--k); transition: all .18s ease;
}
.filter-btn.active, .filter-btn:hover{ background: var(--k); border-style:solid; border-color: var(--k); color: var(--paper); transform: rotate(-1deg); }

.grid-portfolio{
  display:grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: auto; gap: 22px;
  grid-auto-flow: dense;
}
@media (max-width: 1000px){ .grid-portfolio{ grid-template-columns: repeat(2,1fr);} .p-card.size-lg{ grid-column: span 2 !important; grid-row: span 1 !important; } }
@media (max-width: 560px){ .grid-portfolio{ grid-template-columns: 1fr;} .p-card.size-lg{ grid-column: span 1 !important; } }

.p-card{
  border-radius: 6px; overflow:hidden; cursor:pointer; background: var(--paper-2);
  border: 1.5px solid var(--k); transition: transform .22s ease, box-shadow .22s ease;
  display:flex; flex-direction:column;
}
.p-card:nth-child(3n+1){ transform: rotate(-1.1deg); }
.p-card:nth-child(3n+2){ transform: rotate(.8deg); }
.p-card:nth-child(3n){ transform: rotate(-.4deg); }
.p-card:hover{ transform: rotate(0) translateY(-6px) scale(1.015); box-shadow: 8px 12px 0 rgba(11,11,12,.14); z-index:2; }
.p-card.size-lg{ grid-column: span 2; grid-row: span 2; }
.p-card.size-lg .p-thumb{ aspect-ratio: auto; height:100%; min-height:260px; }
.p-thumb{
  aspect-ratio: 4/3; position:relative; display:flex; align-items:center; justify-content:center;
  background-size: cover; background-position:center; overflow:hidden; flex:1;
}
.p-thumb .p-photo{ position:absolute; inset:0; background-size:cover; background-position:center; }
.p-thumb .p-mono{
  font-family: var(--ff-poster); font-weight:400; font-size:3rem; color: rgba(255,255,255,.94);
  z-index:1; text-shadow: 3px 0 var(--cyan), -3px 0 var(--magenta);
}
.p-thumb .p-halftone{
  position:absolute; inset:0; background-image: radial-gradient(rgba(255,255,255,.35) 1px, transparent 1.6px);
  background-size: 10px 10px; mix-blend-mode: overlay;
}
.p-tag{
  position:absolute; top:12px; left:12px; background: var(--paper); color: var(--k);
  font-family: var(--ff-display); font-size:.62rem; text-transform:uppercase; letter-spacing:.06em; font-weight:700;
  padding: 5px 10px; border-radius: 999px; z-index:2; border:1.5px solid var(--k);
}
.p-body{ padding: 16px 18px 20px; border-top: 1.5px dashed rgba(11,11,12,.2); }
.p-body h4{ font-size:1rem; margin-bottom:4px; text-transform:uppercase; letter-spacing:.01em; }
.p-body p{ font-size:.85rem; margin:0; }
.portfolio-empty{ text-align:center; padding: 60px 20px; color: var(--ink-grey); font-family: var(--ff-display); }

/* lightbox */
.lightbox{
  position:fixed; inset:0; background: rgba(11,11,12,.85); display:none; align-items:center; justify-content:center;
  z-index: 1000; padding: 24px;
}
.lightbox.open{ display:flex; }
.lightbox-inner{
  background: var(--paper-2); max-width: 640px; width:100%; border-radius: 8px; overflow:hidden; position:relative;
  border: 2px solid var(--k); transform: rotate(-.4deg);
}
.lightbox-thumb{ aspect-ratio: 16/9; position:relative; display:flex; align-items:center; justify-content:center; }
.lightbox-thumb .p-photo{ position:absolute; inset:0; background-size:cover; background-position:center; }
.lightbox-body{ padding: 24px 28px 28px; }
.lightbox-close{
  position:absolute; top:14px; right:14px; width:38px; height:38px; border-radius:50%;
  background: rgba(11,11,12,.55); color:#fff; border:none; display:flex; align-items:center; justify-content:center; z-index:3;
}
.lightbox-close svg{ width:18px; height:18px; }

/* ================= CONTACT ================= */
.contact{ background: var(--k); color: var(--paper); --tear-color: var(--k); }
.contact .eyebrow{ color: var(--yellow); }
.contact-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.contact-list{ display:flex; flex-direction:column; gap:18px; margin-top: 24px; }
.contact-item{ display:flex; gap:16px; align-items:flex-start; }
.contact-item .ico{
  width:44px; height:44px; border-radius:4px; background: rgba(212,175,55,.12); border:1.5px dashed rgba(212,175,55,.5);
  display:flex; align-items:center; justify-content:center; flex:none;
}
.contact-item .ico svg{ width:20px; height:20px; color: var(--gold); }
.contact-item h4{ font-size:.95rem; margin-bottom:2px; color: var(--paper); text-transform:uppercase; letter-spacing:.03em; }
.contact-item a, .contact-item span{ color: rgba(246,243,236,.7); font-size:.92rem; }
.contact-item a:hover{ color: var(--gold); }
.social-row{ display:flex; gap:12px; margin-top: 28px; }
.social-row a{
  width:44px; height:44px; border-radius:50%; border:1.5px solid rgba(212,175,55,.4);
  display:flex; align-items:center; justify-content:center; transition: background .2s ease, transform .2s ease;
}
.social-row a:hover{ background: var(--gold); color: var(--k); transform: rotate(-8deg) scale(1.08); }
.social-row svg{ width:19px; height:19px; }

.contact-form{
  background: var(--k-soft); border-radius: 8px; padding: 30px; border:1.5px dashed rgba(212,175,55,.3);
  transform: rotate(.4deg);
}
.form-row{ margin-bottom: 16px; }
.form-row label{ display:block; font-family: var(--ff-display); font-size:.8rem; margin-bottom:6px; color: rgba(246,243,236,.75); text-transform:uppercase; letter-spacing:.03em; }
.form-row input, .form-row select, .form-row textarea{
  width:100%; padding: 12px 14px; border-radius: 6px; border:1px solid rgba(246,243,236,.18);
  background: rgba(246,243,236,.05); color: var(--paper); font-family: var(--ff-body); font-size:.92rem;
  cursor: text;
}
.form-row input::placeholder, .form-row textarea::placeholder{ color: rgba(246,243,236,.35); }
.form-row textarea{ min-height: 110px; resize:vertical; }
.form-row select option{ color: #000; }
.form-note{ font-size:.75rem; color: rgba(246,243,236,.45); margin-top:10px; }

.map-embed{ border-radius: 8px; overflow:hidden; margin-top:26px; border:1.5px solid rgba(212,175,55,.4); }
.map-embed iframe{ width:100%; height:230px; border:0; filter: grayscale(.4) contrast(1.08); }
.map-placeholder{
  height:230px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
  text-align:center; padding: 20px; background: var(--k-soft);
}
.map-placeholder p{ font-size:.82rem; max-width:32ch; margin:0; color: rgba(246,243,236,.6); }
.map-placeholder-link{ font-size:.78rem; color: var(--gold); text-decoration:underline; }

/* ================= COOKIE BANNER ================= */
.cookie-banner{
  position: fixed; left:16px; right:16px; bottom: 20px; z-index: 200;
  background: var(--k); color: var(--paper); border: 2px dashed var(--gold);
  border-radius: var(--radius); box-shadow: var(--shadow); max-width: 760px; margin: 0 auto;
  padding: 22px 26px;
  transform: translateY(150%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform .4s ease, opacity .4s ease, visibility 0s linear .4s;
}
.cookie-banner.show{
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform .4s ease, opacity .4s ease;
}
.cookie-banner-inner{ display:flex; align-items:center; gap:24px; flex-wrap:wrap; justify-content:space-between; }
.cookie-banner-text{ flex:1; min-width:240px; }
.cookie-banner-text strong{ font-family: var(--ff-poster); text-transform:uppercase; font-size:1.1rem; letter-spacing:.01em; display:block; margin-bottom:4px; }
.cookie-banner-text p{ font-size:.85rem; margin:0; color: rgba(246,243,236,.65); }
.cookie-banner-text a{ color: var(--gold); text-decoration:underline; }
.cookie-banner-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.cookie-banner-actions .btn{ padding: 11px 20px; font-size:.85rem; }
@media (max-width: 560px){ .cookie-banner{ padding:18px; } .cookie-banner-actions{ width:100%; } .cookie-banner-actions .btn{ flex:1; justify-content:center; } }

@media (max-width: 900px){ .contact-grid, .about-grid{ grid-template-columns: 1fr; } }

/* ================= FOOTER ================= */
.site-footer{ background: var(--paper); padding: 50px 0 26px; border-top:3px dashed rgba(11,11,12,.25); position:relative; overflow:hidden; }
.footer-watermark{
  position:absolute; bottom:-.28em; left:50%; transform:translateX(-50%); z-index:0; pointer-events:none; user-select:none;
  font-family: var(--ff-poster); font-weight:400; text-transform:uppercase; white-space:nowrap;
  font-size: clamp(3rem, 13vw, 8rem); line-height:1; color:transparent; -webkit-text-stroke: 1.2px rgba(11,11,12,.08);
}
.footer-grid{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; position:relative; z-index:1; }
.footer-links{ display:flex; gap:22px; flex-wrap:wrap; }
.footer-links a{ font-size:.85rem; color: var(--ink-grey); text-transform:uppercase; font-family: var(--ff-display); font-weight:600; letter-spacing:.02em; }
.footer-links a:hover{ color: var(--k); }
.footer-fine{ font-size:.78rem; color: var(--ink-grey); margin-top: 22px; text-align:center; position:relative; z-index:1; }
.footer-fine a{ color: var(--ink-grey); text-decoration: underline; }

/* whatsapp float button */
.wa-float{
  position: fixed; bottom: 22px; right: 22px; width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow: var(--shadow);
  z-index: 90; border: 2px solid #06210f22; animation: float-bob 2.6s ease-in-out infinite;
}
.wa-float svg{ width:28px; height:28px; }
@keyframes float-bob{ 0%,100%{ transform: translateY(0) rotate(0);} 50%{ transform: translateY(-6px) rotate(-4deg);} }

.reveal{ opacity:0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }