/* DPS / VOL. II — Black & Red creative direction. Static, dependency-free layer. */
:root{
 --navy:#101015;
 --blue:#ed193a;
 --lime:#ff5b73;
 --ink:#f7f4f5;
 --muted:#b8aeb3;
 --line:#3c2930;
 --pale:#151116;
 --white:#fff;
 --surface:#151217;
 --surface-raised:#21171e;
 --red:#f32848;
 --red-bright:#ff415b;
}
html{scroll-padding-top:95px}
body{background:#09090d;color:var(--ink);background-image:radial-gradient(ellipse 48% 20% at 91% 5%,rgba(130,9,30,.15),transparent 80%);overflow-x:hidden}
::selection{background:#e32746;color:white}
:focus-visible{outline-color:var(--red-bright)!important}
a,button{transition:color .2s,border-color .2s,background-color .2s,transform .2s,box-shadow .2s}
h1,h2,h3{font-family:'Manrope',Arial,sans-serif}
h1{font-weight:800;font-size:clamp(3.05rem,5.7vw,5.8rem);line-height:1.05;letter-spacing:-.065em}
h2{font-weight:750;letter-spacing:-.055em}
h3{font-weight:700}
em{color:var(--red-bright)}
a:hover{color:var(--red-bright)}
.eyebrow{color:#ff526d;letter-spacing:.18em;font-weight:800}
.muted,.section-heading>p,.intro{color:var(--muted)}
.container{width:min(1240px,calc(100% - 72px))}
.section{padding-block:92px}
.header{background:rgba(10,10,14,.94);border-bottom:1px solid rgba(244,70,96,.18);backdrop-filter:blur(16px)}
.nav-wrap{height:78px}
.brand{color:white!important;gap:13px;font-weight:800;font-size:18px;letter-spacing:-.04em}
.brand-mark{height:auto;width:auto;background:transparent;color:#fff;font-weight:900;font-size:31px;letter-spacing:-.11em}
.brand-mark span{position:static;font-size:31px;color:var(--red-bright);letter-spacing:-.08em}
.brand-caption{color:#c8b5bc!important;font-size:9px!important;letter-spacing:.15em!important;margin-top:3px!important}
.header nav{gap:clamp(11px,1.55vw,26px)}
.header nav>a:not(.button){color:#f3e9ec;font-size:13px}
.header nav>a:not(.button):hover{color:#ff4766}
.header nav>.button{background:transparent;border:1px solid var(--red-bright);border-radius:9px;box-shadow:inset 0 0 16px rgba(255,32,67,.08);padding:11px 17px;gap:15px}
.header nav>.button:hover{background:#ad1730;color:white}
.button{background:linear-gradient(135deg,#ff2b4a,#c8092a);border:1px solid #f23b56;box-shadow:0 10px 28px rgba(169,0,36,.2);color:#fff;gap:14px;border-radius:10px;font-size:14px;font-weight:750}
.button:hover{background:linear-gradient(135deg,#ff516d,#ef1d3c);box-shadow:0 12px 32px rgba(224,12,58,.32);color:white}
.button-ghost,.button-outline{background:#191217!important;border:1px solid #6a3643!important;box-shadow:none!important;color:#fff!important}
.button-ghost:hover,.button-outline:hover{background:#2c1922!important;border-color:#fc3858!important}
.text-link{border-color:#994454;color:#ff6178;font-weight:700}
.text-link:hover{color:white;border-color:#fff}
/* Hero: art-directed split panel, abstract accents, stronger CTA hierarchy. */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,4vw,72px);padding-block:85px 92px;min-height:645px}
.hero:before{content:"";position:absolute;top:15px;left:-180px;width:560px;height:560px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(189,0,39,.13),transparent 67%);filter:blur(20px)}
.hero-copy{position:relative;z-index:1}
.hero-copy .eyebrow{margin-bottom:27px;font-size:10px;letter-spacing:.14em}
.hero h1{max-width:720px;margin-bottom:24px}
.hero h1 em{display:inline-block;background:linear-gradient(110deg,#ff3f5a 15%,#c90d2f 92%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hero .intro{max-width:610px;font-size:18px;line-height:1.75}
.hero .actions{gap:13px;flex-wrap:wrap;margin-top:34px}
.hero .actions .button{padding:17px 23px}
.hero-notes{flex-wrap:wrap;gap:10px 18px;color:#bfb4b9;font-size:11px;margin-top:37px}
.hero-notes span{border-left:2px solid #fc344f;padding-left:10px}
.hero-visual.brand-art-hero{position:relative;align-self:stretch;min-height:488px;padding:0;overflow:hidden;border-radius:18px;border:1px solid #6c2d3f;background:#140b11;box-shadow:0 24px 100px rgba(75,0,15,.3)}
.brand-art-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,4,7,.03) 36%,rgba(6,4,7,.9) 100%);pointer-events:none}
.brand-art-hero img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:51% center;display:block;filter:saturate(.98) contrast(1.04)}
.art-micro-label{position:absolute;z-index:1;top:23px;left:24px;border:1px solid rgba(255,128,144,.45);border-radius:99px;color:#f9d4da;background:rgba(15,8,12,.8);padding:7px 12px;font-size:10px;font-weight:800;letter-spacing:.13em}
.hero-art-caption{position:absolute;z-index:1;bottom:27px;left:27px;right:27px;display:grid;grid-template-columns:44px 1fr;gap:0 14px;align-items:center}
.hero-art-caption .art-symbol{grid-row:span 2;font-size:28px;color:#ff3555;border:1px solid #8b3549;background:rgba(30,10,20,.75);display:grid;place-items:center;width:43px;height:43px;border-radius:12px}
.hero-art-caption strong{font-size:18px;line-height:1.35;color:#fff}
.hero-art-caption>span:last-child{color:#dccdd1;font-size:12px}
/* Proof ribbon */
.positioning{background:#121014;border-block:1px solid rgba(225,64,89,.25)}
.positioning .container.proof-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(205px,.95fr);gap:24px;padding-block:23px}
.proof-strip>div{display:flex;align-items:center;gap:14px;border-right:1px solid #54303a}
.proof-strip .proof-figure{font-size:29px;font-weight:900;line-height:1;letter-spacing:-.07em;color:#ff3453}
.proof-strip .proof-text{font-size:12px;line-height:1.4;color:#e1d7da}
.proof-strip>a{align-self:center;text-align:right;font-size:12px;font-weight:700;color:#fef3f5}
.proof-strip>a span{color:#ff4f68}
/* Below-fold art direction */
.spotlight-section{padding-block:98px 24px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr);gap:55px;align-items:center}
.spotlight-copy h2{font-size:clamp(2.35rem,4vw,4.3rem);margin:0 0 22px}
.spotlight-copy>p:not(.eyebrow){color:var(--muted);max-width:400px}
.spotlight-link{color:#ff5672;font-weight:800;border-bottom:1px solid #bd3e54;display:inline-flex;gap:12px;padding-bottom:8px;margin-top:12px}
.spotlight-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.mini-tile{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:230px;padding:23px 20px;border-radius:13px;border:1px solid #542f3a;background:linear-gradient(135deg,#26131a 0%,#121014 76%);overflow:hidden}
.mini-tile:after{content:"";position:absolute;width:160px;height:160px;right:-55px;top:7px;border:1px solid rgba(250,64,93,.25);border-radius:50%;box-shadow:0 0 0 24px rgba(249,44,75,.04),0 0 0 49px rgba(249,44,75,.035)}
.mini-tile:hover{border-color:#f33c56;transform:translateY(-6px);color:white}
.mini-tile .mini-symbol{color:#ff415c;font-size:38px}
.mini-tile strong{font-size:18px;line-height:1.2;position:relative;z-index:1}
.mini-tile small{color:#c8a6af;font-size:9px;font-weight:800;letter-spacing:.09em;position:relative;z-index:1}
.tile-web{background:linear-gradient(150deg,#411321,#170e15 65%)}
.tile-creative{background:linear-gradient(160deg,#21141d,#101016 80%)}
#services{padding-top:70px}
.section-heading{align-items:flex-end}
.section-heading h2{font-size:clamp(2.25rem,3.5vw,3.9rem)}
.section-heading>p{font-size:15px}
.professional-presence{background:linear-gradient(110deg,#23121b,#121116 80%);border:1px solid #4b2935;border-radius:16px;padding:32px;gap:3rem}
.professional-presence .promo-image{border-radius:12px;background:radial-gradient(circle at 55% 40%,#492030,#171015 72%);padding:14px}
.professional-presence h3{font-size:clamp(1.6rem,3vw,2.5rem)}
.professional-presence p:not(.eyebrow){color:#c3b5bc}
.service-group-title{border-left:4px solid var(--red);padding-left:15px;color:#ff6c80;letter-spacing:.12em;font-size:12px;margin:52px 0 22px}
.service-card,.pricing-card,.portfolio-card,.work-showcase-card{background:linear-gradient(155deg,#1a151b,#110f14 85%);border:1px solid #422b34;border-radius:14px;box-shadow:0 8px 26px rgba(0,0,0,.12)}
.service-card{min-height:290px;padding:27px}
.service-card:hover,.pricing-card:hover,.work-showcase-card:hover,.portfolio-card:hover{border-color:#8d3e4f;box-shadow:0 16px 32px rgba(79,10,24,.18)}
.service-card.featured{background:linear-gradient(145deg,#3c1221,#190f16 75%);border:1px solid #a92d47}
.service-card .icon,.service-card.featured .icon{font-size:29px;color:#ff4360}
.service-number,.featured .service-number{color:#bf7989}
.service-card h3{font-size:19px;margin-bottom:9px;color:white}
.service-card p,.featured p,.service-card .service-related{color:#bdb0b7;font-size:13px}
.service-card a{color:#ff667d;font-size:12px;gap:10px}
.service-card a:hover{color:white}
/* Featured work cards with luminous document surfaces */
#work{border-top:1px solid var(--line)}
.portfolio-notice{color:#bdadb5!important;background:#171118!important;border-left:3px solid #ea2947!important}
.portfolio-image{background:radial-gradient(circle at 50% 40%,#43202d,#1c1119 74%);padding:27px 35px;border-color:#422b34}
.portfolio-image img{max-height:260px;width:auto;max-width:100%;object-fit:contain;margin:0 auto;filter:drop-shadow(0 10px 12px rgba(0,0,0,.3));transition:transform .25s}
.portfolio-card:hover .portfolio-image img{transform:translateY(-5px)}
.portfolio-content{padding:25px}
.portfolio-content h3{font-size:18px;color:#fff}
.portfolio-content>p:not(.sample-label){color:#b8adb3}
.sample-label,.portfolio-content .sample-label{color:#ff617c}
.download-link{color:#ff5c76}
.work-extras{border-color:var(--line)}
.work-showcase-art{background:linear-gradient(135deg,#441525,#151116 85%);position:relative;isolation:isolate;min-height:225px}
.work-showcase-art:after{content:"";position:absolute;border:1px solid rgba(255,69,101,.18);width:200px;height:200px;border-radius:50%;right:-40px;top:-40px;z-index:-1;box-shadow:0 0 0 30px rgba(206,17,53,.05)}
.presentation-art{background:linear-gradient(135deg,#521522,#1a1222 83%)}
.creative-art{background:linear-gradient(135deg,#50152e,#150f1a 83%)}
.work-art-chip,.work-art-heading em{color:#ff697d}
.work-art-footer{color:#ecc3cc}
.work-showcase-content p:not(.sample-label){color:var(--muted)}
/* Pricing: warmer surfaces, stronger price typography; content/amounts unchanged */
#pricing{border-top:1px solid var(--line)}
.pricing-grid{gap:16px}
.pricing-card{padding:27px}
.pricing-card h3{color:white;font-size:23px}
.pricing-card>p:not(.eyebrow),.pricing-tagline,.pricing-card dd{color:#b9adb3}
.pricing-card .price-start{color:#d5bcc5!important}
.price-start strong{font-size:2.35rem;color:#fff}
.pricing-price,.pricing-terms,.form-notice{background:#23151e;border-color:#f62e4e;color:#eee0e5}
.pricing-terms p,.pricing-price span{color:#b5a4ad}
.package{border-color:var(--line)}
.package-price,.package-price span,.package h4{color:#efe8eb}
.package-price{color:#ff526d}
.package-details summary,.pricing-extras summary{color:#ff667d}
.package-details summary:hover,.pricing-extras summary:hover{color:white}
.pricing-extras{border-color:var(--line);background:#171117}
.pricing-extras dd{color:var(--muted)}
/* About, process, presentation and trust / always dark */
.about{background:#111015;border-top:1px solid #35232b;border-bottom:1px solid #35232b}
.david-portrait{border:1px solid #59303c;border-radius:18px;background:radial-gradient(circle at 45% 25%,#441a2b,#191016 70%);padding:10px}
.david-portrait img{border-radius:12px}
.david-portrait figcaption{color:#c9aab2}
.about-copy>p,.about-copy .large-copy{color:#e9e0e3}
.about-copy>p:not(.large-copy):not(.eyebrow){color:var(--muted)}
.steps article{border-color:#603644;background:#150f15;border-radius:3px;padding:25px 21px}
.steps article>span,.benefits article>span{color:#ff3f5c}
.steps p{color:var(--muted)}
.why{background:linear-gradient(110deg,#36131f,#140e14 85%);border-block:1px solid #693143}
.why em{color:#ff768d}
.why-grid>div>p:last-child,.benefits p{color:#e0c6cf}
.presentation-section{border-color:var(--line)}
.presentation-intro>div>p:not(.eyebrow){color:var(--muted)}
.presentation-intro .promo-image{border-radius:13px;background:radial-gradient(circle,#441b2a,#141016 70%);border:1px solid #663245}
.video-frame{background:#0b0c10;border:1px solid #7b3e51;box-shadow:0 16px 50px rgba(88,5,25,.26)}
.video-status{background:#261019}
.video-feature>div>p:not(.eyebrow){color:var(--muted)}
.video-feature h3{color:white}
/* FAQ, CTA, contacts, payment */
.faq-list details{border-color:#3d2a34}
summary{color:#f3e9ed}
.faq-list p{color:var(--muted)}
.final-cta{background:radial-gradient(ellipse at 55% -15%,#7b1b31,#3b111e 63%,#230f17);border:1px solid #94384d;border-radius:20px;box-shadow:0 22px 70px rgba(69,0,20,.18)}
.final-cta em{color:#ff8596}
.final-cta>p:last-child{color:#eecbd2}
.light{background:#fff!important;color:#1a0b11!important;box-shadow:none!important;border-color:white!important}
.light:hover{background:#ffdee4!important}
.payment-section{background:#120f15;border-block:1px solid #3b252e}
.payment-card{background:#1a141b;border-color:#55323f}
.payment-card h3{color:white}
.crypto-list li{background:#271922;color:#f3d6df}
.contact-grid>div>p:not(.eyebrow){color:var(--muted)}
.contact-links .contact-option{background:#1b141b;border-color:#65404b;color:#f4e3e9;border-radius:10px}
.contact-links .contact-option:hover{background:#351725;border-color:#ff4e68;color:#fff}
.form-notice span{color:#d1bdc4}
input,select,textarea{background:#1b171c;border:1px solid #714550;border-radius:9px;color:#fff;font-size:15px}
input::placeholder,textarea::placeholder{color:#a68e99}
input:focus,select:focus,textarea:focus{border-color:#ff4562;outline-color:#ff4562}
select option{background:#1b171c;color:#fff}
#form-status,#contact-status{color:#ffe1e6}
footer{background:#0b0a0f;border-color:#4c2936}
footer p,footer small{color:#b9a9b0}
.footer-social a{color:#e4c7d0}
.footer-social a:hover{color:#ff5c7a}
.footer-email,.footer-whatsapp,.business-email a,.business-whatsapp a{color:#ff6b82}
footer .brand{color:#fff}
/* Legal and non-home pages inherit theme instead of an old pale palette. */
.policy-page,.policy-card,.not-found{color:var(--ink)}
.policy-page p,.policy-page li,.policy-page .policy-intro,.policy-page .muted{color:var(--muted)}
.policy-page a{color:#ff6a82}
/* Responsive */
@media(max-width:1050px){
 .hero{gap:30px}
 .hero h1{font-size:clamp(2.9rem,5vw,4.4rem)}
 .spotlight-section{grid-template-columns:1fr;gap:32px}
 .spotlight-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
 .positioning .container.proof-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
 .proof-strip>a{grid-column:1/-1;text-align:left;padding-top:10px}
 .proof-strip>div:nth-child(3){border:0}
}
@media(max-width:800px){
 .header nav{background:#110e15;border:1px solid #58313f;box-shadow:0 20px 30px rgba(0,0,0,.55)}
 .header nav a:not(.button){padding:12px 15px}
 .header .menu-toggle{display:inline-flex;align-items:center;gap:10px;background:#20151d;border:1px solid #773d4c;color:white;border-radius:8px}
 .hero{grid-template-columns:1fr;min-height:0;padding-block:57px 58px;gap:36px}
 .hero-visual.brand-art-hero{min-height:440px}
 .positioning .container.proof-strip{gap:12px}
 .david-about{gap:32px}
}
@media(max-width:650px){
 .container{width:calc(100% - 38px)}
 .nav-wrap{height:70px}
 .brand{font-size:15px}
 .brand-mark,.brand-mark span{font-size:27px}
 .hero{padding-block:54px 54px}
 .hero h1{font-size:clamp(2.8rem,10vw,4.3rem);letter-spacing:-.067em}
 .hero .intro{font-size:16px;line-height:1.7}
 .hero .actions{gap:10px}
 .hero .actions .button{padding:14px 17px;font-size:12px;gap:8px}
 .hero-notes{font-size:10px}
 .hero-visual.brand-art-hero{min-height:335px}
 .hero-art-caption{bottom:19px;left:17px;right:15px}
 .hero-art-caption strong{font-size:15px}
 .art-micro-label{top:14px;left:15px;font-size:9px}
 .positioning .container.proof-strip{grid-template-columns:1fr 1fr;gap:15px;padding-block:20px}
 .proof-strip>div{border:none;gap:10px}
 .proof-strip>a{grid-column:1/-1}
 .proof-strip .proof-figure{font-size:25px}
 .proof-strip .proof-text{font-size:11px}
 .spotlight-section{padding-block:65px 4px}
 .spotlight-section h2{font-size:clamp(2rem,7.5vw,3rem)}
 .spotlight-tiles{grid-template-columns:1fr;gap:12px}
 .mini-tile{min-height:125px;padding:19px 23px;display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto;align-content:center;gap:0 10px}
 .mini-tile .mini-symbol{grid-row:span 2;align-self:center}
 .mini-tile strong{font-size:18px}
 .section{padding-block:70px}
 #services{padding-top:58px}
 .professional-presence{padding:18px}
 .service-card{min-height:0}
 .pricing-card{padding:22px}
 .final-cta{border-radius:15px}
 .portfolio-image img{max-height:250px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Match the shorter mobile header and keep the wordmark unobstructed. */
@media(max-width:800px){.header nav{top:78px}}
@media(max-width:650px){
 .header nav{top:70px}
 .brand-mark{width:auto!important;height:auto!important}
 .proof-strip span{width:auto}
 .positioning .container.proof-strip{justify-content:stretch}
 .hero .hero-notes span{width:auto}
}
