/*
Theme Name: ART'S K
Theme URI: https://artsk.com.br
Author: Ascend MKT Digital
Description: Tema institucional ART'S K — Laudos e Perícias.
Version: 1.0
*/

/* =========================================================
   ART'S K — Laudos e Perícias
   Stylesheet único, compartilhado por todas as páginas.
   Edite aqui para alterar cores, fontes e espaçamentos
   em todo o site de uma só vez.
   ========================================================= */

:root{
  /* ---- Paleta (preto + dourado elegante) ---- */
  --navy:        #0a0a0a;
  --navy-2:      #141414;
  --navy-3:      #1c1c1c;
  --gold:        #c9a667;
  --gold-bright: #ddbf85;
  --gold-ink:    #7d5f28;
  --paper:       #f8f6f1;
  --paper-2:     #f1ede3;
  --ink:         #1c1a16;
  --gray:        #6f6a5c;
  --line-dark:   rgba(201,166,103,0.22);
  --line-light:  rgba(28,26,22,0.12);

  /* ---- Tipografia ---- */
  --serif: 'Playfair Display', Georgia, serif;
  --sans:  'Inter', -apple-system, sans-serif;
}

*{margin:0; padding:0; box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{display:block; max-width:100%;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
::selection{background:var(--gold); color:var(--navy);}

h1,h2,h3,h4{font-family:var(--serif); font-weight:600; line-height:1.15; color:var(--navy);}
.on-dark h1, .on-dark h2, .on-dark h3, .on-dark h4{color:var(--paper);}

.eyebrow{
  font-family:var(--sans); font-size:12px; font-weight:600; letter-spacing:0.22em;
  text-transform:uppercase; color:var(--gold-ink); margin-bottom:16px;
  display:flex; align-items:center; gap:12px;
}
.eyebrow::before{content:""; width:28px; height:1px; background:currentColor;}
.on-dark .eyebrow{color:var(--gold);}

/* ================= HEADER / NAV ================= */
header.site{
  position:sticky; top:0; z-index:200;
  background:rgba(10,10,10,0.96);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line-dark);
}
nav.site{
  max-width:1180px; margin:0 auto; padding:18px 32px;
  display:flex; align-items:center; justify-content:space-between;
}
.brand{display:flex; align-items:center; gap:12px;}
.brand img{height:38px; width:auto;}
.brand-txt{font-family:var(--serif); color:var(--paper); font-size:15px; letter-spacing:0.02em;}
.brand-txt small{display:block; font-family:var(--sans); font-size:9.5px; letter-spacing:0.18em; color:var(--gold); text-transform:uppercase; margin-top:2px;}

.navlinks{display:flex; align-items:center; gap:38px;}
.navlinks > li{position:relative;}
.navlinks a{
  font-size:13px; letter-spacing:0.05em; text-transform:uppercase; font-weight:500;
  color:rgba(248,246,241,0.78); transition:color .2s;
}
.navlinks > li > a.active, .navlinks a:hover{color:var(--gold);}

.has-dropdown > a::after{content:" ▾"; font-size:10px; opacity:0.6;}
.dropdown{
  position:absolute; top:100%; left:-20px; padding-top:18px;
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .2s, transform .2s, visibility .2s;
}
.has-dropdown:hover .dropdown{opacity:1; visibility:visible; transform:translateY(0);}
.dropdown-inner{
  background:var(--navy-2); border:1px solid var(--line-dark);
  min-width:270px; padding:10px 0; box-shadow:0 20px 40px rgba(0,0,0,0.4);
}
.dropdown-inner a{
  display:block; padding:12px 22px; font-size:12.5px; text-transform:none; letter-spacing:0.01em;
  color:rgba(248,246,241,0.82); border-bottom:1px solid rgba(255,255,255,0.05);
}
.dropdown-inner a:last-child{border-bottom:none;}
.dropdown-inner a:hover{color:var(--gold); background:rgba(201,166,103,0.06);}

.nav-cta{
  border:1px solid var(--gold); color:var(--gold) !important; padding:10px 22px;
  font-size:12px !important; letter-spacing:0.12em !important; border-radius:1px;
  transition:background .2s, color .2s !important;
}
.nav-cta:hover{background:var(--gold); color:var(--navy) !important;}

.navburger{display:none;}
@media(max-width:960px){
  .navlinks{display:none;}
  .navburger{display:block; color:var(--paper); font-size:22px; background:none; border:none; cursor:pointer;}
}

/* ================= PAGE HEADER (banner interno) ================= */
.page-header{
  position:relative; padding:150px 0 90px; overflow:hidden;
  background:var(--navy);
  border-bottom:1px solid var(--line-dark);
}
.page-header .bg{
  position:absolute; inset:0; background-size:cover; background-position:center;
  filter:grayscale(85%) brightness(0.3) contrast(1.05);
}
.page-header .bg::after{content:"";}
.page-header::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(115deg, rgba(10,10,10,0.97) 20%, rgba(10,10,10,0.55) 100%);
}
.page-header .wrap{position:relative; z-index:2;}
.page-header h1{color:var(--paper); font-size:clamp(2rem,4.2vw,3.2rem); max-width:20ch;}
.crumb{
  font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:rgba(248,246,241,0.55);
  margin-top:20px; font-family:var(--sans);
}
.crumb a{color:var(--gold);}
.crumb span{margin:0 8px; opacity:0.5;}

/* ================= HERO (home) ================= */
.hero-home{
  position:relative; min-height:96vh; display:flex; align-items:center; overflow:hidden;
  background:var(--navy);
}
.hero-home .bg{
  position:absolute; inset:0; background-size:cover; background-position:center;
  filter:grayscale(85%) brightness(0.38) contrast(1.1);
}
.hero-home::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0.35) 45%, rgba(10,10,10,0.98) 100%);
}
.hero-home-content{position:relative; z-index:2; padding:120px 0 80px; width:100%;}
.hero-home h1{color:var(--paper); font-size:clamp(2.4rem,5.4vw,4.1rem); max-width:17ch; font-weight:500;}
.hero-home h1 em{font-style:italic; color:var(--gold);}
.hero-home .sub{
  margin-top:26px; max-width:52ch; color:rgba(248,246,241,0.72); font-size:1.08rem; font-weight:300;
}
.hero-home .actions{margin-top:42px; display:flex; gap:18px; flex-wrap:wrap;}

/* ================= BUTTONS ================= */
.btn{
  display:inline-flex; align-items:center; gap:10px; font-size:13px; letter-spacing:0.08em;
  padding:16px 30px; border-radius:1px; font-weight:600; transition:all .2s;
  text-transform:uppercase;
}
.btn-gold{background:var(--gold); color:var(--navy);}
.btn-gold:hover{background:var(--gold-bright); transform:translateY(-2px);}
.btn-outline-light{border:1px solid rgba(248,246,241,0.4); color:var(--paper);}
.btn-outline-light:hover{border-color:var(--gold); color:var(--gold);}
.btn-outline-dark{border:1px solid var(--navy); color:var(--navy);}
.btn-outline-dark:hover{background:var(--navy); color:var(--paper);}

/* ================= SECTIONS ================= */
section{padding:120px 0;}
section.tight{padding:90px 0;}
section.on-navy{background:var(--navy);}
section.on-paper2{background:var(--paper-2);}
.section-title{font-size:clamp(1.9rem,3.4vw,2.6rem); max-width:24ch;}
.section-lede{margin-top:20px; max-width:60ch; color:var(--gray); font-size:1.06rem;}
.on-dark .section-lede{color:rgba(248,246,241,0.62);}

hr.gold{border:none; height:1px; background:var(--line-dark); margin:64px 0;}

/* ================= SERVICE INDEX GRID (home) ================= */
.svc-index{margin-top:64px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-light); border:1px solid var(--line-light);}
.svc-tile{
  background:var(--paper); padding:44px 34px; display:flex; flex-direction:column; min-height:300px;
  transition:background .25s;
}
.svc-tile:hover{background:#fff;}
.svc-tile .n{font-family:var(--serif); font-size:14px; color:var(--gold-ink); margin-bottom:22px;}
.svc-tile h3{font-size:1.25rem; margin-bottom:14px;}
.svc-tile p{color:var(--gray); font-size:0.94rem; flex-grow:1;}
.svc-tile .go{
  margin-top:22px; font-size:11.5px; letter-spacing:0.12em; text-transform:uppercase; font-weight:600;
  color:var(--navy); display:inline-flex; align-items:center; gap:8px;
}
.svc-tile .go .arrow{transition:transform .2s;}
.svc-tile:hover .go .arrow{transform:translateX(5px);}
.svc-tile.flagship{background:var(--navy); color:var(--paper);}
.svc-tile.flagship:hover{background:var(--navy-2);}
.svc-tile.flagship h3, .svc-tile.flagship .n{color:var(--gold);}
.svc-tile.flagship p{color:rgba(248,246,241,0.68);}
.svc-tile.flagship .go{color:var(--gold);}
.flag{
  font-size:10px; letter-spacing:0.1em; text-transform:uppercase; padding:5px 10px;
  border:1px solid var(--gold); color:var(--gold); display:inline-block; margin-bottom:18px; width:fit-content;
}
@media(max-width:960px){.svc-index{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.svc-index{grid-template-columns:1fr;}}

/* ================= DIFERENCIAIS ================= */
.diff-row{display:grid; grid-template-columns:repeat(3,1fr); gap:56px; margin-top:64px;}
.diff-col{border-top:1px solid var(--line-light); padding-top:26px;}
.on-dark .diff-col{border-top:1px solid var(--line-dark);}
.diff-num{font-family:var(--serif); font-size:15px; color:var(--gold); margin-bottom:14px;}
.diff-col h4{font-size:1.08rem; margin-bottom:10px;}
.diff-col p{font-size:0.93rem; color:var(--gray);}
.on-dark .diff-col p{color:rgba(248,246,241,0.6);}
@media(max-width:820px){.diff-row{grid-template-columns:1fr; gap:34px;}}

/* ================= SERVICE DETAIL PAGE ================= */
.svc-detail{display:grid; grid-template-columns:1fr 0.9fr; gap:80px; align-items:start;}
.svc-detail .media{position:sticky; top:100px;}
.svc-detail .media img{border-radius:1px;}
.svc-detail .media .cap{margin-top:14px; font-size:11.5px; letter-spacing:0.06em; color:var(--gray); text-transform:uppercase;}
.dor-box{
  border-left:2px solid var(--gold); padding:18px 0 18px 24px; margin:28px 0;
  font-family:var(--serif); font-style:italic; font-size:1.2rem; color:var(--navy);
}
.svc-detail p{color:var(--gray); margin-bottom:18px; max-width:56ch;}
.check-list{margin:24px 0;}
.check-list li{
  padding:16px 0; border-top:1px solid var(--line-light); display:flex; gap:16px; align-items:flex-start;
  font-size:0.96rem; color:var(--ink);
}
.check-list li:last-child{border-bottom:1px solid var(--line-light);}
.check-list .mark{color:var(--gold-ink); font-family:var(--serif); font-style:italic; font-size:1.1rem; line-height:1;}
.note-box{
  margin-top:26px; background:var(--paper-2); border:1px solid var(--line-light); padding:20px 24px;
  font-size:13px; color:var(--gray);
}
.note-box strong{color:var(--navy);}
@media(max-width:920px){.svc-detail{grid-template-columns:1fr; gap:44px;} .svc-detail .media{position:static;}}

/* ================= FAQ ================= */
.faq-list{margin-top:20px; border-top:1px solid var(--line-light);}
.on-navy .faq-list{border-top:1px solid var(--line-dark);}
.faq-item{border-bottom:1px solid var(--line-light);}
.on-navy .faq-item{border-bottom:1px solid var(--line-dark);}
.faq-q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  padding:26px 0; display:flex; justify-content:space-between; align-items:center; gap:20px;
  font-family:var(--sans); font-weight:600; font-size:1.02rem; color:var(--navy);
}
.on-navy .faq-q{color:var(--paper);}
.faq-q .cat{display:block; font-size:10.5px; color:var(--gold-ink); text-transform:uppercase; letter-spacing:0.14em; font-weight:600; margin-bottom:8px;}
.faq-q .plus{font-size:20px; color:var(--gold-ink); transition:transform .2s; flex-shrink:0; font-family:var(--serif);}
.on-navy .faq-q .cat, .on-navy .faq-q .plus{color:var(--gold);}
.faq-item.open .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease;}
.faq-a p{padding:0 0 26px; color:var(--gray); max-width:62ch; font-size:0.96rem;}
.on-navy .faq-a p{color:rgba(248,246,241,0.62);}

/* ================= ABOUT ================= */
.about-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:76px; align-items:center;}
.about-photo{position:relative;}
.about-photo img{filter:grayscale(20%) contrast(1.05);}
.about-photo .frame{
  position:absolute; top:-16px; left:-16px; right:16px; bottom:16px;
  border:1px solid var(--gold); z-index:-1;
}
.pillars{margin-top:34px;}
.pillar{display:flex; gap:22px; padding:24px 0; border-top:1px solid var(--line-light);}
.pillar:last-child{border-bottom:1px solid var(--line-light);}
.pillar .idx{font-family:var(--serif); color:var(--gold-ink); font-size:14px;}
.pillar h4{font-size:1.04rem; margin-bottom:6px;}
.pillar p{font-size:0.92rem; color:var(--gray);}
@media(max-width:900px){.about-grid{grid-template-columns:1fr;} .about-photo .frame{display:none;}}

/* ================= STATS STRIP ================= */
.stats{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); margin-top:70px;}
.stat{background:var(--navy); padding:38px 30px; text-align:center;}
.stat .num{font-family:var(--serif); font-size:2.4rem; color:var(--gold);}
.stat .lbl{font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(248,246,241,0.62); margin-top:8px;}
@media(max-width:700px){.stats{grid-template-columns:1fr;}}

/* ================= CONTACT ================= */
.contact-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:80px;}
.contact-channels{display:flex; flex-direction:column; gap:0; margin-top:20px;}
.cchannel{display:flex; justify-content:space-between; align-items:center; padding:26px 0; border-top:1px solid var(--line-light);}
.contact-channels .cchannel:last-child{border-bottom:1px solid var(--line-light);}
.cchannel .lbl{font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--gray); margin-bottom:6px;}
.cchannel .val{font-family:var(--serif); font-size:1.3rem;}
.cchannel .arrow{color:var(--gold-ink); font-size:18px;}

form.contact-form{display:flex; flex-direction:column; gap:18px; margin-top:20px;}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.field{display:flex; flex-direction:column; gap:8px;}
.field label{font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--gray); font-weight:600;}
.field input, .field select, .field textarea{
  border:none; border-bottom:1px solid var(--line-light); background:transparent;
  padding:12px 2px; font-family:var(--sans); font-size:14.5px; color:var(--ink); outline:none;
  transition:border-color .2s;
}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--gold-ink);}
.field textarea{resize:vertical; min-height:100px;}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr; gap:50px;} .row2{grid-template-columns:1fr;}}

/* ================= FOOTER ================= */
footer.site{background:var(--navy); border-top:1px solid var(--line-dark); padding:80px 0 30px; color:rgba(248,246,241,0.7);}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:50px;}
.foot-brand{display:flex; align-items:center; gap:12px; margin-bottom:18px;}
.foot-brand img{height:32px;}
.foot-brand span{font-family:var(--serif); color:var(--paper); font-size:15px;}
footer.site p{font-size:0.9rem; max-width:34ch; color:rgba(248,246,241,0.55);}
.foot-col h5{font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--gold); margin-bottom:20px;}
.foot-col a{display:block; font-size:0.9rem; padding:7px 0; color:rgba(248,246,241,0.68); transition:color .2s;}
.foot-col a:hover{color:var(--gold);}
.foot-bottom{
  margin-top:60px; padding-top:26px; border-top:1px solid var(--line-dark);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  font-size:11.5px; letter-spacing:0.03em; color:rgba(248,246,241,0.45);
}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr; gap:36px;}}
@media(max-width:560px){.foot-grid{grid-template-columns:1fr;}}

/* ================= WHATSAPP FLOAT ================= */
.wa-float{
  position:fixed; bottom:26px; right:26px; z-index:300;
  background:var(--gold); color:var(--navy); border-radius:2px;
  padding:15px 22px; display:flex; align-items:center; gap:10px;
  font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase; font-weight:700;
  box-shadow:0 10px 26px rgba(0,0,0,0.35); transition:transform .2s;
}
.wa-float:hover{transform:translateY(-3px);}

/* ================= FINAL CTA BAND ================= */
.cta-band{
  background:var(--navy); padding:90px 0; text-align:center; position:relative; overflow:hidden;
}
.cta-band h2{color:var(--paper); max-width:20ch; margin:0 auto;}
.cta-band .section-lede{margin-left:auto; margin-right:auto; text-align:center; color:rgba(248,246,241,0.62);}
.cta-band .actions{display:flex; justify-content:center; gap:18px; margin-top:36px; flex-wrap:wrap;}

