:root { --ink:#0b0b0b; --ink-2:#151515; --paper:#f1f0eb; --white:#fff; --muted:#a5a5a1; --accent:#e4ad25; --line:rgba(255,255,255,.14); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Manrope",sans-serif; overflow-x:hidden; }
img,video { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.skip-link { position:fixed; left:16px; top:-80px; z-index:99; padding:12px 18px; color:var(--ink); background:var(--accent); }
.skip-link:focus { top:16px; }
.site-header { height:92px; display:grid; grid-template-columns:180px 1fr auto; align-items:center; gap:36px; padding:12px max(28px,calc((100vw - 1380px)/2)); position:fixed; inset:0 0 auto; z-index:30; color:var(--white); background:linear-gradient(to bottom,rgba(0,0,0,.92),rgba(0,0,0,.62),transparent); transition:background .25s,height .25s; }
.site-header.scrolled { height:76px; background:rgba(9,9,9,.96); box-shadow:0 8px 30px rgba(0,0,0,.22); }
.brand img { width:150px; height:62px; object-fit:contain; object-position:left center; }
.desktop-nav { justify-self:center; display:flex; gap:30px; font-size:.75rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.desktop-nav a { padding:10px 0; border-bottom:2px solid transparent; }
.desktop-nav a:hover { color:var(--accent); border-color:var(--accent); }
.header-cta,.button { min-height:52px; display:inline-flex; align-items:center; justify-content:center; padding:0 24px; font-size:.76rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.header-cta,.button-primary { color:var(--ink); background:var(--accent); }
.button-outline { color:var(--white); border:1px solid rgba(255,255,255,.45); }
.menu-toggle,.mobile-menu { display:none; }
.hero { min-height:880px; display:grid; grid-template-columns:minmax(380px,560px) minmax(0,1fr); gap:56px; align-items:center; padding:130px max(28px,calc((100vw - 1380px)/2)) 92px; position:relative; color:var(--white); background:var(--ink); overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; opacity:.08; background:repeating-linear-gradient(116deg,transparent 0 72px,#fff 73px 74px); }
.hero-copy,.hero-visual { position:relative; z-index:1; }
.eyebrow { display:flex; align-items:center; gap:12px; margin:0 0 18px; color:#c8c8c5; font-size:.7rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.eyebrow span { width:38px; height:2px; background:var(--accent); }
.hero-art { width:min(100%,500px); aspect-ratio:1; object-fit:contain; border:1px solid rgba(228,173,37,.45); }
.hero-actions { display:flex; gap:14px; margin-top:28px; }
.hero-tags { display:flex; gap:28px; padding:0; margin:32px 0 0; list-style:none; color:#aeadab; font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.hero-tags li { position:relative; }
.hero-tags li+li::before { content:""; width:4px; height:4px; position:absolute; left:-16px; top:5px; background:var(--accent); transform:rotate(45deg); }
.hero-visual { min-width:0; }
.hero-frame { height:620px; position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.18); background:#171717; }
.hero-slide { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; opacity:0; transform:scale(1.04); transition:opacity .7s,transform 1.1s; }
.hero-slide.is-active { opacity:1; transform:scale(1); }
.hero-stamp { width:112px; height:112px; display:flex; flex-direction:column; align-items:center; justify-content:center; position:absolute; right:-18px; top:34px; color:var(--ink); background:var(--accent); transform:rotate(-7deg); box-shadow:0 18px 36px rgba(0,0,0,.28); }
.hero-stamp strong { font:800 2.5rem/1 "Barlow Condensed",sans-serif; }
.hero-stamp span { font-size:.55rem; font-weight:800; letter-spacing:.16em; }
.hero-carousel-controls { display:flex; align-items:center; gap:10px; position:absolute; right:20px; bottom:20px; }
.hero-carousel-controls button,.gallery-controls button { width:48px; height:48px; color:var(--white); background:rgba(11,11,11,.82); border:1px solid rgba(255,255,255,.3); cursor:pointer; }
.hero-carousel-controls button:hover,.gallery-controls button:hover { color:var(--ink); background:var(--accent); border-color:var(--accent); }
.hero-index { min-width:76px; color:#ddd; font-size:.7rem; font-weight:800; letter-spacing:.12em; text-align:center; }
.hero-index b { color:var(--accent); }
.scroll-note { display:flex; align-items:center; gap:12px; position:absolute; z-index:2; left:max(28px,calc((100vw - 1380px)/2)); bottom:32px; color:#999; font-size:.62rem; font-weight:800; letter-spacing:.16em; }
.scroll-note span { width:42px; height:1px; background:var(--accent); }
.promise { min-height:88px; display:flex; align-items:center; padding:18px 0; color:var(--ink); background:var(--accent); overflow:hidden; }
.promise-track { width:max-content; display:flex; animation:promise-scroll 26s linear infinite; will-change:transform; }
.promise-group { display:flex; align-items:center; gap:42px; padding-right:42px; flex-shrink:0; }
.promise p { margin:0; font:800 1.45rem "Barlow Condensed",sans-serif; letter-spacing:.08em; white-space:nowrap; }
.promise i { width:7px; height:7px; flex:0 0 auto; background:var(--ink); transform:rotate(45deg); }
@keyframes promise-scroll { to { transform:translate3d(-50%,0,0); } }
.section,.portfolio-category { padding:110px max(28px,calc((100vw - 1240px)/2)); }
.section-head,.category-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,430px); gap:70px; align-items:end; margin-bottom:62px; }
.section-label { display:block; margin-bottom:16px; color:var(--accent); font-size:.72rem; font-weight:800; letter-spacing:.16em; }
h1,h2 { margin:0; font:800 clamp(3.4rem,6vw,6rem)/.9 "Barlow Condensed",sans-serif; text-transform:uppercase; letter-spacing:-.02em; }
h1 em,h2 em { color:var(--accent); font-style:normal; }
.section-head p,.category-heading p { margin:0 0 5px; color:#696b6c; font-size:1rem; line-height:1.75; }
.category-intro { background:var(--paper); }
.category-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.category-links a { aspect-ratio:1; min-height:0; position:relative; overflow:hidden; color:var(--white); background:#080808; }
.category-links img { width:100%; height:100%; position:absolute; inset:0; object-fit:contain; object-position:center; opacity:.72; transition:transform .45s,opacity .3s; }
.category-links a::after { content:""; position:absolute; inset:35% 0 0; background:linear-gradient(transparent,rgba(0,0,0,.92)); }
.category-links span { position:absolute; z-index:2; inset:auto 18px 20px; font:800 1.35rem/1 "Barlow Condensed",sans-serif; text-transform:uppercase; }
.category-links a:hover img { opacity:.8; transform:scale(1.05); }
.portfolio-category { overflow:hidden; }
.category-dark { color:var(--white); background:var(--ink); }
.category-light { color:var(--ink); background:var(--paper); }
.category-dark .category-heading p { color:#aaa; }
.gallery-shell { width:100vw; margin-left:calc(50% - 50vw); }
.gallery-viewport { overflow-x:auto; padding:0 max(28px,calc((100vw - 1240px)/2)); scrollbar-width:none; scroll-snap-type:x mandatory; scroll-behavior:smooth; outline:none; }
.gallery-viewport::-webkit-scrollbar { display:none; }
.gallery-viewport:focus-visible { box-shadow:inset 0 0 0 2px var(--accent); }
.gallery-track { display:flex; gap:18px; width:max-content; }
.gallery-card { width:clamp(280px,34vw,500px); height:520px; flex:0 0 auto; position:relative; overflow:hidden; margin:0; scroll-snap-align:start; background:#191919; }
.gallery-card img { width:100%; height:100%; object-fit:cover; object-position:center center; transition:transform .5s; }
.gallery-card:hover img { transform:scale(1.025); }
.gallery-card figcaption { min-height:84px; display:flex; align-items:flex-end; justify-content:space-between; gap:14px; padding:45px 20px 18px; position:absolute; inset:auto 0 0; color:var(--white); background:linear-gradient(transparent,rgba(0,0,0,.88)); }
.gallery-card figcaption strong { font:700 1.22rem "Barlow Condensed",sans-serif; text-transform:uppercase; }
.gallery-card figcaption span { color:var(--accent); font-size:.68rem; font-weight:800; letter-spacing:.12em; }
.gallery-controls { max-width:1240px; display:flex; align-items:center; justify-content:space-between; margin:24px auto 0; padding:0 28px; }
.gallery-controls>span { color:#8d8d88; font:700 .82rem "Manrope",sans-serif; letter-spacing:.1em; }
.gallery-controls>span b { color:var(--accent); font-size:1.8rem; }
.gallery-controls>div { display:flex; gap:8px; }
.category-light .gallery-controls button { color:var(--ink); background:transparent; border-color:rgba(11,11,11,.3); }
.category-light .gallery-controls button:hover { background:var(--accent); }
.video-card { width:clamp(300px,38vw,540px); height:540px; display:flex; flex-direction:column; flex:0 0 auto; margin:0; scroll-snap-align:start; background:#151515; border:1px solid rgba(255,255,255,.16); }
.video-card video { width:100%; height:455px; object-fit:contain; background:#050505; }
.video-card figcaption { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 20px; color:var(--white); }
.video-card strong { font:700 1.25rem "Barlow Condensed",sans-serif; text-transform:uppercase; }
.video-card span { color:var(--accent); font-size:.68rem; font-weight:800; letter-spacing:.12em; }
.about { color:var(--white); background:#151515; }
.about-copy { max-width:940px; }
.about-copy>p { max-width:760px; color:#b5b5b2; font-size:1.05rem; line-height:1.8; }
.about-points { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:52px; }
.about-points div { padding:24px; border:1px solid var(--line); }
.about-points span { color:var(--accent); font-size:.7rem; font-weight:800; }
.about-points p { margin:16px 0 0; line-height:1.55; }
.contact { min-height:520px; display:grid; grid-template-columns:1.15fr .85fr; gap:80px; align-items:center; padding:100px max(28px,calc((100vw - 1240px)/2)); background:var(--accent); }
.contact .section-label { color:var(--ink); }
.contact h2 { font-size:clamp(4rem,7vw,7rem); }
.contact-copy p { font-size:1.05rem; }
.contact-action>small { display:block; margin-top:16px; font-size:.78rem; font-weight:700; }
.contact-button { min-height:130px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:28px 34px; color:var(--white); background:var(--ink); }
.contact-button small { display:block; font-size:.62rem; letter-spacing:.14em; }
.contact-button strong { display:block; margin-top:5px; font:800 2.2rem "Barlow Condensed",sans-serif; text-transform:uppercase; }
.contact-button b { font-size:2rem; }
.contact-dialog { width:min(92vw,650px); max-height:90vh; padding:44px; position:fixed; color:var(--white); background:#101010; border:1px solid rgba(255,255,255,.2); box-shadow:0 30px 90px rgba(0,0,0,.65); overflow:auto; }
.contact-dialog[open] { animation:contact-dialog-in .25s ease-out; }
.contact-dialog::backdrop { background:rgba(0,0,0,.78); backdrop-filter:blur(5px); }
.contact-dialog-close { width:42px; height:42px; position:absolute; top:18px; right:18px; color:var(--white); background:transparent; border:1px solid rgba(255,255,255,.28); font-size:1.65rem; cursor:pointer; }
.contact-dialog-close:hover,.contact-dialog-close:focus-visible { color:var(--ink); background:var(--accent); border-color:var(--accent); }
.contact-dialog h2 { font-size:clamp(2.8rem,8vw,4.4rem); }
.contact-dialog>p { max-width:500px; margin:22px 0 30px; color:#aaa; line-height:1.65; }
.contact-choices { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.contact-choice { min-height:145px; display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; padding:22px; color:var(--white); border:1px solid rgba(255,255,255,.18); transition:transform .2s,border-color .2s,background-color .2s; }
.contact-choice:hover,.contact-choice:focus-visible { color:var(--white); border-color:rgba(255,255,255,.65); transform:translateY(-3px); }
.contact-choice b { width:42px; height:42px; display:grid; place-items:center; border:1px solid currentColor; border-radius:50%; font-size:1.4rem; }
.contact-choice span { min-width:0; }
.contact-choice small,.contact-choice strong { display:block; }
.contact-choice small { font-size:.64rem; line-height:1.5; letter-spacing:.04em; }
.contact-choice strong { margin:4px 0; font:800 1.55rem/1 "Barlow Condensed",sans-serif; text-transform:uppercase; }
.contact-choice i { font-style:normal; }
.contact-choice-whatsapp { background:#168b42; }
.contact-choice-phone { color:var(--ink); background:var(--accent); }
.contact-choice-phone:hover,.contact-choice-phone:focus-visible { color:var(--ink); }
@keyframes contact-dialog-in { from { opacity:0; transform:translateY(18px) scale(.98); } }
.whatsapp-float { width:64px; height:64px; display:grid; place-items:center; position:fixed; z-index:1000; right:24px; bottom:max(24px,env(safe-area-inset-bottom)); color:#fff; background:#25d366; border:2px solid rgba(255,255,255,.92); border-radius:50%; box-shadow:0 10px 30px rgba(0,0,0,.32); transition:transform .2s,background-color .2s,box-shadow .2s; }
.whatsapp-float::before { content:""; position:absolute; inset:-7px; border:2px solid rgba(37,211,102,.38); border-radius:inherit; animation:whatsapp-pulse 2.2s ease-out infinite; }
.whatsapp-float svg { width:34px; height:34px; }
.whatsapp-float span { padding:7px 10px; position:absolute; right:calc(100% + 12px); color:#fff; background:#101010; border-radius:4px; font-size:.68rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; opacity:0; pointer-events:none; transform:translateX(6px); transition:opacity .2s,transform .2s; }
.whatsapp-float:hover,.whatsapp-float:focus-visible { color:#fff; background:#1fbd59; box-shadow:0 14px 34px rgba(0,0,0,.4); transform:translateY(-3px); }
.whatsapp-float:hover span,.whatsapp-float:focus-visible span { opacity:1; transform:none; }
@keyframes whatsapp-pulse { 0% { opacity:.75; transform:scale(.88); } 75%,100% { opacity:0; transform:scale(1.25); } }
.site-footer { min-height:150px; display:grid; grid-template-columns:200px 1fr auto; align-items:center; gap:30px; padding:28px max(28px,calc((100vw - 1240px)/2)); color:#999; background:#080808; font-size:.75rem; }
.footer-brand img { width:165px; height:88px; }
.back-top { color:var(--white); font-weight:800; letter-spacing:.1em; }
.reveal { opacity:0; transform:translateY(26px); transition:opacity .7s,transform .7s; }
.reveal.is-visible { opacity:1; transform:none; }

@media (max-width:980px) {
  .desktop-nav,.header-cta { display:none; }
  .site-header { grid-template-columns:1fr auto; }
  .menu-toggle { width:48px; height:48px; display:grid; place-content:center; gap:7px; color:var(--white); background:transparent; border:1px solid rgba(255,255,255,.3); }
  .menu-toggle span { width:21px; height:2px; background:currentColor; }
  .mobile-menu { display:flex; flex-direction:column; gap:18px; padding:24px; position:absolute; inset:76px 18px auto; color:var(--white); background:#101010; border:1px solid var(--line); font-weight:700; text-transform:uppercase; }
  .mobile-menu[hidden] { display:none; }
  .hero { min-height:auto; grid-template-columns:1fr; padding-top:120px; }
  .hero-art { max-width:460px; }
  .hero-frame { height:620px; }
  .scroll-note { display:none; }
  .section-head,.category-heading { grid-template-columns:1fr; gap:26px; }
  .category-links { grid-template-columns:repeat(2,1fr); }
  .category-links a:last-child { grid-column:1/-1; }
  .about-points { grid-template-columns:1fr; }
  .contact { grid-template-columns:1fr; gap:42px; }
}

@media (max-width:640px) {
  .site-header { height:76px; padding:8px 18px; }
  .brand img { width:126px; height:56px; }
  .hero { gap:34px; padding:100px 18px 50px; }
  .eyebrow { font-size:.58rem; }
  .hero-actions { display:grid; }
  .button { width:100%; }
  .hero-tags { gap:20px; font-size:.61rem; }
  .hero-tags li+li::before { left:-12px; }
  .hero-frame { height:440px; }
  .hero-stamp { width:88px; height:88px; right:8px; top:18px; }
  .hero-stamp strong { font-size:2rem; }
  .hero-carousel-controls { left:12px; right:12px; bottom:12px; justify-content:space-between; }
  .promise { min-height:72px; }
  .promise-track { animation-duration:22s; }
  .promise-group { gap:24px; padding-right:24px; }
  .promise p { font-size:1.15rem; }
  .section,.portfolio-category { padding:74px 18px; }
  h1,h2 { font-size:clamp(3.2rem,15vw,4.7rem); }
  .category-links { grid-template-columns:1fr; }
  .category-links a,.category-links a:last-child { min-height:0; grid-column:auto; }
  .gallery-viewport { padding:0; }
  .gallery-track { padding:0 9vw; }
  .gallery-card { width:82vw; height:450px; scroll-snap-align:center; }
  .gallery-controls { padding:0 9vw; }
  .video-card { width:82vw; height:500px; }
  .video-card video { height:420px; }
  .contact { padding:74px 18px; }
  .contact h2 { font-size:clamp(3.7rem,16vw,5.2rem); }
  .contact-button { min-height:110px; padding:22px; }
  .contact-dialog { width:calc(100vw - 24px); padding:36px 18px 20px; }
  .contact-dialog-close { top:12px; right:12px; }
  .contact-dialog>p { margin:18px 0 22px; }
  .contact-choices { grid-template-columns:1fr; }
  .contact-choice { min-height:112px; }
  .whatsapp-float { width:58px; height:58px; right:16px; bottom:max(16px,env(safe-area-inset-bottom)); }
  .whatsapp-float svg { width:31px; height:31px; }
  .whatsapp-float span { display:none; }
  .site-footer { grid-template-columns:1fr auto; padding:28px 18px; }
  .site-footer p { display:none; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  * { transition-duration:.01ms!important; }
  .promise-track { animation-duration:26s; }
  .whatsapp-float::before { animation:none; }
  .reveal { opacity:1; transform:none; }
}