/* Ateliê Bella — mobile-first, compatível e com contraste controlado */

:root{
  /* Tema claro */
  --bg:#fbf8f4;
  --surface:#ffffff;
  --surface-2:#f1e9de;
  --text:#171310;
  --text-muted:#5f584f;
  --border:#e0d5c5;
  --header-bg:#171310;
  --header-text:#fbf8f4;
  --header-muted:rgba(251,248,244,.72);
  --header-border:rgba(251,248,244,.14);
  --overlay:rgba(12,10,8,.55);

  /* Acento padrão: bege */
  --accent:#8a6532;
  --accent-hover:#74521f;
  --accent-text:#ffffff;
  --accent-soft:#b2894e;
  --accent-tint:#f4ead9;
  --focus:#8a6532;

  --radius-btn:14px;
  --radius-card:6px;
  --radius-panel:18px;
  --shadow:0 18px 45px rgba(23,19,16,.10);
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --section-pad:4.2rem;
  --card-pad:1.7rem;
  --gap:.9rem;
}

[data-theme="dark"]{
  --bg:#121110;
  --surface:#1c1a18;
  --surface-2:#242220;
  --text:#f4eee6;
  --text-muted:#b8b0a5;
  --border:#3b3733;
  --header-bg:#121110;
  --header-text:#f4eee6;
  --header-muted:rgba(244,238,230,.72);
  --header-border:rgba(244,238,230,.14);
  --overlay:rgba(8,7,6,.62);
  --shadow:0 18px 45px rgba(0,0,0,.55);

  --accent:#d9b679;
  --accent-hover:#e8c992;
  --accent-text:#171310;
  --accent-soft:#e3c48d;
  --accent-tint:#2b241c;
  --focus:#e3c48d;
}

[data-accent="bege"]{--accent:#8a6532;--accent-hover:#74521f;--accent-text:#fff;--accent-soft:#b2894e;--accent-tint:#f4ead9;--focus:#8a6532}
[data-accent="dourado"]{--accent:#8a6a00;--accent-hover:#755800;--accent-text:#fff;--accent-soft:#c9a227;--accent-tint:#f6efd4;--focus:#8a6a00}
[data-accent="rosa"]{--accent:#9c5360;--accent-hover:#84424e;--accent-text:#fff;--accent-soft:#d59aa4;--accent-tint:#f7e7ea;--focus:#9c5360}
[data-accent="vinho"]{--accent:#7d2f3c;--accent-hover:#65232e;--accent-text:#fff;--accent-soft:#b76a76;--accent-tint:#f4e3e6;--focus:#7d2f3c}
[data-accent="preto"]{--accent:#1f1f1f;--accent-hover:#000;--accent-text:#fff;--accent-soft:#5c5c5c;--accent-tint:#eceae7;--focus:#1f1f1f}

[data-theme="dark"][data-accent="bege"]{--accent:#d9b679;--accent-hover:#e8c992;--accent-text:#171310;--accent-soft:#e3c48d;--accent-tint:#2b241c;--focus:#e3c48d}
[data-theme="dark"][data-accent="dourado"]{--accent:#e2c04a;--accent-hover:#f0d06a;--accent-text:#171310;--accent-soft:#e8cd63;--accent-tint:#2c2513;--focus:#e2c04a}
[data-theme="dark"][data-accent="rosa"]{--accent:#e0a3ad;--accent-hover:#eeb8c1;--accent-text:#241418;--accent-soft:#e8b3bc;--accent-tint:#2e1e21;--focus:#e0a3ad}
[data-theme="dark"][data-accent="vinho"]{--accent:#d98a95;--accent-hover:#e8a3ad;--accent-text:#241114;--accent-soft:#e0a0aa;--accent-tint:#2c1a1d;--focus:#d98a95}
[data-theme="dark"][data-accent="preto"]{--accent:#f4eee6;--accent-hover:#fff;--accent-text:#171310;--accent-soft:#d8d1c7;--accent-tint:#2a2825;--focus:#f4eee6}

[data-font="moderna"]{--serif:"Cormorant Garamond",Georgia,serif;--sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
[data-font="elegante"]{--serif:"Playfair Display",Georgia,serif;--sans:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
[data-font="classica"]{--serif:Georgia,"Times New Roman",serif;--sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}

[data-radius="arredondado"]{--radius-btn:999px;--radius-card:18px;--radius-panel:24px}
[data-radius="suave"]{--radius-btn:14px;--radius-card:6px;--radius-panel:18px}
[data-radius="reto"]{--radius-btn:0;--radius-card:0;--radius-panel:0}

[data-style="minimalista"]{--section-pad:4.2rem;--card-pad:1.7rem;--gap:.9rem}
[data-style="sofisticado"]{--section-pad:5.2rem;--card-pad:2.1rem;--gap:1.1rem}
[data-style="contemporaneo"]{--section-pad:4.6rem;--card-pad:1.8rem;--gap:.75rem}
[data-style="sofisticado"] .service,[data-style="sofisticado"] .quote,[data-style="sofisticado"] .contact-card{border-width:2px}
[data-style="contemporaneo"] .service,[data-style="contemporaneo"] .quote,[data-style="contemporaneo"] .contact-card{border-left:3px solid var(--accent)}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.65;padding-bottom:86px;-webkit-font-smoothing:antialiased;transition:background-color .25s ease,color .25s ease}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.1;margin:0 0 .55em;letter-spacing:-.01em}
h1{font-size:clamp(2.6rem,10vw,3.6rem)}
h2{font-size:clamp(2rem,8vw,2.7rem)}
h3{font-size:1.25rem}
p{margin:0 0 1rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wrap{width:min(680px,calc(100% - 2.4rem));margin-inline:auto}
.section{padding:var(--section-pad) 0}
.block-head{margin-bottom:2.2rem}
.kicker{font-size:.7rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin:0 0 .75rem}
[data-theme="dark"] .kicker{color:var(--accent-soft)}
.demo{font-size:.8rem;color:var(--text-muted);border-left:2px solid var(--border);padding-left:.8rem}

:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.skip-link{position:absolute;left:-999px;top:0;z-index:1200;background:var(--header-bg);color:var(--header-text);padding:.9rem 1.2rem}
.skip-link:focus{left:1rem;top:1rem}

.topbar{position:fixed;inset:0 0 auto;z-index:300;background:var(--header-bg);border-bottom:1px solid var(--header-border)}
.topbar-inner{width:min(680px,calc(100% - 2rem));margin:auto;display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font-family:var(--serif);font-size:1.25rem;color:var(--header-text)}
.brand span{color:var(--accent-soft)}
.topbar-actions{display:flex;align-items:center;gap:.45rem}
.icon-btn{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--header-border);border-radius:50%;background:transparent;color:var(--header-text);cursor:pointer;transition:border-color .2s ease,color .2s ease}
.icon-btn:hover{border-color:var(--accent-soft);color:var(--accent-soft)}
.menu-btn{display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;border:1px solid var(--header-border);border-radius:50%;background:transparent;cursor:pointer}
.menu-btn span{display:block;width:18px;height:1.6px;background:var(--header-text);margin:auto;transition:transform .28s var(--ease)}
.menu-btn[aria-expanded="true"] span:first-child{transform:translateY(3.3px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:last-child{transform:translateY(-3.3px) rotate(-45deg)}

.drawer{position:fixed;inset:64px 0 0;z-index:290;background:var(--header-bg);padding:1.6rem 1.4rem 2rem;transform:translateX(100%);transition:transform .35s var(--ease);display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer ul{display:grid;gap:.2rem;margin-bottom:auto}
.drawer a:not(.drawer-cta){display:flex;align-items:center;justify-content:space-between;min-height:58px;color:var(--header-muted);font-size:1rem;border-bottom:1px solid var(--header-border)}
.drawer a:not(.drawer-cta)::after{content:"→";color:var(--accent-soft)}
.drawer a:not(.drawer-cta):hover{color:var(--header-text)}
.drawer-cta{display:flex;align-items:center;justify-content:center;min-height:58px;margin-top:1.4rem;background:var(--accent);color:var(--accent-text);border-radius:var(--radius-btn);font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.drawer-note{margin-top:1rem;font-size:.75rem;color:var(--header-muted);text-align:center}

.customizer{position:fixed;top:0;right:0;bottom:0;z-index:400;width:min(390px,100%);background:var(--bg);border-left:1px solid var(--border);box-shadow:var(--shadow);padding:1.5rem 1.3rem calc(1.5rem + env(safe-area-inset-bottom));transform:translateX(102%);transition:transform .38s var(--ease);overflow-y:auto;overscroll-behavior:contain}
.customizer.open{transform:translateX(0)}
.customizer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.1rem}
.customizer-head h2{font-size:1.7rem;margin:0}
.customizer-head .icon-btn{border-color:var(--border);color:var(--text)}
.customizer-note{font-size:.78rem;color:var(--text-muted);border-left:2px solid var(--accent);padding-left:.8rem;margin-bottom:1.6rem}
.custom-group{margin-bottom:1.7rem}
.custom-group h3{font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);margin:0 0 .8rem}
.choice-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.choice{min-height:48px;padding:.7rem .5rem;border:1px solid var(--border);border-radius:var(--radius-btn);background:transparent;color:var(--text);font-family:var(--sans);font-size:.82rem;font-weight:500;cursor:pointer;transition:all .2s ease}
.choice:hover{border-color:var(--accent)}
.choice[aria-pressed="true"]{background:var(--text);color:var(--bg);border-color:var(--text)}
.swatches{display:flex;gap:.6rem}
.swatch{width:44px;height:44px;border:2px solid var(--border);border-radius:50%;background:var(--swatch);cursor:pointer;transition:transform .2s ease,border-color .2s ease}
.swatch:hover{transform:scale(1.06)}
.swatch[aria-pressed="true"]{border-color:var(--text);transform:scale(1.08)}
.style-list{display:grid;gap:.55rem}
.style-card{display:grid;gap:.15rem;text-align:left;padding:1rem 1.1rem;border:1px solid var(--border);border-radius:var(--radius-card);background:transparent;color:var(--text);cursor:pointer;transition:all .2s ease}
.style-card strong{font-family:var(--serif);font-size:1.05rem}
.style-card span{font-size:.8rem;color:var(--text-muted)}
.style-card:hover{border-color:var(--accent)}
.style-card[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-tint)}
.customizer-actions{display:grid;gap:.6rem;margin-top:2rem}
.btn-primary,.btn-outline{display:flex;align-items:center;justify-content:center;min-height:54px;border-radius:var(--radius-btn);font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:all .2s ease}
.btn-primary{background:var(--accent);color:var(--accent-text);border:1px solid var(--accent)}
.btn-primary:hover{background:var(--accent-hover)}
.btn-outline{background:transparent;color:var(--text);border:1px solid var(--border)}
.btn-outline:hover{border-color:var(--accent);color:var(--accent)}

.hero{position:relative;min-height:calc(100svh - 64px);display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.hero-media,.hero-media img{position:absolute;inset:0;width:100%;height:100%}
.hero-media img{object-fit:cover;object-position:center;filter:brightness(.42) saturate(.82)}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,10,10,.95) 8%,rgba(10,10,10,.45) 58%,rgba(10,10,10,.15))}
.hero-content{position:relative;z-index:2;width:min(680px,calc(100% - 2.4rem));margin-inline:auto;padding:0 0 7.5rem}
.tag{font-size:.68rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#e3c48d;margin-bottom:1rem}
.hero h1 span{color:#e3c48d}
.hero p:not(.tag):not(.micro){color:rgba(255,255,255,.86);max-width:30ch}
.cta-primary,.cta-secondary{display:flex;align-items:center;justify-content:center;min-height:58px;border-radius:var(--radius-btn);font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;transition:transform .2s ease,background .2s ease}
.cta-primary{background:var(--accent);color:var(--accent-text);margin-top:1.8rem}
.cta-primary:hover{background:var(--accent-hover)}
.cta-primary:active{transform:scale(.98)}
.cta-secondary{margin-top:.7rem;border:1px solid rgba(255,255,255,.45);color:#fff}
.micro{margin-top:1.2rem;font-size:.72rem;color:rgba(255,255,255,.62)}

.strip{background:var(--header-bg);color:var(--header-muted);padding:1rem 0}
.strip-row{width:min(680px,calc(100% - 2.4rem));margin:auto;display:flex;align-items:center;justify-content:space-between;font-size:.65rem;letter-spacing:.16em;text-transform:uppercase}
.strip i{width:4px;height:4px;background:var(--accent-soft);border-radius:50%}

.services{display:grid;gap:var(--gap)}
.service{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);padding:var(--card-pad);position:relative;overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.service::before{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--accent);transition:width .45s var(--ease)}
.service:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.service:hover::before{width:100%}
.num{font-family:var(--serif);color:var(--accent);font-size:.95rem}
[data-theme="dark"] .num{color:var(--accent-soft)}
.service h3{margin:.9rem 0 .5rem}
.service p{color:var(--text-muted);margin:0;font-size:.95rem}
.block-cta{margin-top:2rem}

.gallery{background:var(--surface-2)}
.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.shot{position:relative;margin:0;overflow:hidden;background:#171310;border-radius:var(--radius-card)}
.shot img{width:100%;height:100%;aspect-ratio:3/4;object-fit:cover;object-position:center;transition:transform .5s var(--ease)}
.shot::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,10,10,.72),transparent 55%);opacity:.35}
.shot:hover img{transform:scale(1.04)}
.shot figcaption{position:absolute;left:.9rem;bottom:.9rem;z-index:2;color:#fff;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}

.about-media{margin:0 0 1.8rem;border-radius:var(--radius-card);overflow:hidden}
.about-media img{width:100%;height:100%;aspect-ratio:4/5;object-fit:cover;object-position:center}
.about-copy p{color:var(--text-muted)}
.points{display:grid;gap:.7rem;margin:1.6rem 0 0}
.points li{position:relative;padding-left:1.5rem;font-size:.95rem}
.points li::before{content:"";position:absolute;left:0;top:.65rem;width:7px;height:7px;border:1px solid var(--accent);transform:rotate(45deg)}

.dark{background:var(--header-bg);color:var(--header-text)}
.dark .kicker{color:var(--accent-soft)}
.dark p{color:var(--header-muted)}
.quotes{display:grid;gap:var(--gap)}
.quote{margin:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);padding:var(--card-pad)}
.quote p{font-family:var(--serif);font-size:1.22rem;line-height:1.45;color:var(--text);margin-bottom:1.3rem}
.quote footer{padding-top:1rem;border-top:1px solid var(--border)}
.quote strong{display:block;font-weight:600;color:var(--text)}
.quote span{font-size:.75rem;color:var(--text-muted)}

.contact-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);padding:var(--card-pad);display:grid;gap:1.2rem;margin-bottom:1.2rem}
.contact-row span{display:block;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:.3rem}
[data-theme="dark"] .contact-row span{color:var(--accent-soft)}
.contact-row strong{font-weight:500;color:var(--text)}
.map{border:1px solid var(--border);background:var(--surface-2);padding:.45rem;margin-bottom:1.2rem;border-radius:var(--radius-card)}
.map iframe{display:block;width:100%;height:300px;border:0;border-radius:calc(var(--radius-card) - 4px)}

.footer{background:var(--header-bg);color:var(--header-muted);padding:3.2rem 0 2rem}
.footer-brand{font-size:1.4rem;color:var(--header-text)}
.footer p{font-size:.9rem}
.footer nav ul{display:grid;gap:.55rem;margin:1.5rem 0}
.footer a:hover{color:var(--header-text)}
.social{display:flex;gap:1rem;font-size:.85rem}
.legal{margin-top:2rem;padding-top:1.2rem;border-top:1px solid var(--header-border);font-size:.75rem;color:var(--header-muted)}
.legal p{margin:0 0 .3rem}

.mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:250;padding:.7rem .9rem calc(.7rem + env(safe-area-inset-bottom));background:var(--header-bg);border-top:1px solid var(--header-border)}
.mobile-bar a{display:flex;align-items:center;justify-content:center;gap:.6rem;min-height:56px;background:var(--accent);color:var(--accent-text);border-radius:var(--radius-btn);font-size:.8rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.mobile-bar a:active{transform:scale(.98)}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.reveal.visible{opacity:1;transform:none}

@media(min-width:900px){
body{padding-bottom:0}
.wrap{width:min(1080px,calc(100% - 3rem))}
.topbar-inner{width:min(1080px,calc(100% - 3rem));height:80px}
.drawer{left:auto;width:390px;box-shadow:-30px 0 70px rgba(0,0,0,.35)}
.customizer{width:400px}
.hero{min-height:92svh;align-items:center}
.hero-content{padding:0 0 4rem}
.hero p:not(.tag):not(.micro){max-width:44ch}
.services{grid-template-columns:repeat(2,1fr)}
.gallery-grid{grid-template-columns:repeat(3,1fr)}
.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:3rem;align-items:center}
.quotes{grid-template-columns:repeat(3,1fr)}
.contact-card{grid-template-columns:repeat(3,1fr)}
.mobile-bar{display:none}
.cta-primary,.cta-secondary{width:auto;display:inline-flex;padding:1rem 1.8rem}
}
@media(min-width:1080px){.services{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{transition:none!important;animation:none!important}
.reveal{opacity:1;transform:none}
}