/* DNPROD Phase 11 — self-hosted typography copied from the approved technical reference. */
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/bebas-neue-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/bebas-neue-latin-ext-400-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-latin-ext-400-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-cyrillic-400-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/inter-latin-500-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/inter-latin-ext-500-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/inter-cyrillic-500-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/inter-latin-ext-600-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/inter-cyrillic-600-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}

*{margin:0;padding:0;box-sizing:border-box;}
html{color-scheme:only light;-webkit-color-scheme:only light;scroll-behavior:smooth;}
:root{
  --bg:#0a0a0a;
  --bg2:#0e0e0e;
  --bg3:#121212;
  --red:#8E1930;
  --white:#f0f0f0;
  --gray:#c8c4be;
  --gray2:#3a3a3a;
  --gray3:#222222;
  --border:rgba(255,255,255,0.08);
  --border2:rgba(255,255,255,0.14);
}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--white);font-size:16px;line-height:1.6;overflow-x:hidden;}
section{background:var(--bg);}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--gray2);}

/* ── NAV ── */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(10,10,10,0.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:0 2rem;height:60px;display:flex;align-items:center;justify-content:space-between;}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;}
.logo-sq{width:32px;height:32px;border:1.5px solid var(--red);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.logo-sq span{font-size:12px;font-weight:600;color:var(--red);letter-spacing:-0.5px;}
.logo-name{font-size:14px;font-weight:500;letter-spacing:0.12em;color:var(--white);}
.nav-links{display:flex;align-items:center;gap:2rem;}
.nav-links a{font-size:14px;color:var(--gray);letter-spacing:0.05em;text-decoration:none;transition:color 0.3s;}
.nav-links a:hover{color:var(--white);}
.nav-right{display:flex;align-items:center;gap:1.25rem;}
.lang-toggle{position:relative;}
.lang-current{display:flex;align-items:center;gap:5px;background:none;border:1px solid var(--gray2);font-family:'Inter',sans-serif;font-size:13px;color:var(--white);cursor:pointer;padding:6px 10px;letter-spacing:0.1em;transition:border-color 0.3s;}
.lang-current:hover{border-color:var(--gray);}
.lang-current svg{transition:transform 0.2s;}
.lang-toggle.open .lang-current svg{transform:rotate(180deg);}
.lang-dropdown{display:none;position:absolute;top:calc(100% + 6px);right:0;background:#111;border:1px solid var(--gray2);min-width:80px;z-index:200;}
.lang-toggle.open .lang-dropdown{display:block;}
.lang-opt{display:block;width:100%;background:none;border:none;font-family:'Inter',sans-serif;font-size:13px;color:var(--gray);cursor:pointer;padding:8px 12px;letter-spacing:0.1em;text-align:left;transition:color 0.2s,background 0.2s;}
.lang-opt:hover{color:var(--white);background:var(--bg3);}
.lang-opt.active{color:var(--red);}
.nav-cta{background:none;border:1px solid var(--gray2);color:var(--white);font-family:'Inter',sans-serif;font-size:13px;padding:8px 18px;letter-spacing:0.08em;cursor:pointer;transition:border-color 0.3s,color 0.3s;}
.nav-cta:hover{border-color:var(--red);color:var(--red);}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:4px;}
.burger span{display:block;width:22px;height:1.5px;background:var(--white);transition:all 0.3s;}

/* ── MOBILE NAV ── */
.mobile-menu{display:none;position:fixed;top:60px;left:0;right:0;background:rgba(10,10,10,0.98);border-bottom:1px solid var(--border);padding:1.5rem 2rem;z-index:99;flex-direction:column;gap:1.25rem;}
.mobile-menu.open{display:flex;}
.mobile-menu a{font-size:16px;color:var(--gray);text-decoration:none;letter-spacing:0.05em;padding:0.5rem 0;border-bottom:1px solid var(--border);}
.mobile-menu a:last-of-type{border-bottom:none;}
.mobile-menu a:hover{color:var(--white);}

/* ── HERO ── */
.hero{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;padding:8rem 2rem 5rem;border-bottom:1px solid var(--border);position:relative;overflow:hidden;max-width:1400px;margin:0 auto;}
#shatter{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1;pointer-events:none;}
.hero-content,.hero-visual,.hero-scroll{position:relative;z-index:2;}
.hero-visual-badge{z-index:3;}
.hero-content{display:flex;flex-direction:column;}
.hero-eyebrow{font-size:11px;letter-spacing:0.25em;color:var(--red);text-transform:uppercase;margin-bottom:1.5rem;opacity:0;animation:fadeUp 0.6s 0.1s forwards;}
.hero-eyebrow-name,.hero-eyebrow-separator,.hero-eyebrow-role{display:inline;}
.hero-h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(4rem,7vw,7rem);font-weight:400;line-height:0.95;letter-spacing:0.02em;margin-bottom:1.5rem;opacity:0;animation:fadeUp 0.6s 0.2s forwards;}
.hero-h1 em{color:var(--red);font-style:normal;}
.hero-sub{font-size:16px;color:var(--gray);line-height:1.75;max-width:420px;font-weight:400;margin-bottom:2.5rem;opacity:0;animation:fadeUp 0.6s 0.3s forwards;}
.hero-btns{display:flex;gap:10px;flex-wrap:wrap;opacity:0;animation:fadeUp 0.6s 0.4s forwards;}
.hero-visual{opacity:0;animation:fadeUp 0.7s 0.3s forwards;position:relative;}
.hero-visual-inner{border:1px solid var(--border2);overflow:hidden;border-radius:4px;background:var(--bg3);}
.hero-visual-inner img{width:100%;height:auto;display:block;border-radius:4px;}
.hero-visual-badge{position:absolute;bottom:-16px;left:-16px;background:var(--red);color:#fff;font-size:11px;letter-spacing:0.15em;padding:8px 16px;font-weight:500;}

/* ── SECTION BASE ── */
section{padding:5rem 2rem;}
.max{max-width:1200px;margin:0 auto;}
.sec-label{font-size:11px;letter-spacing:0.25em;color:var(--gray);text-transform:uppercase;margin-bottom:2rem;opacity:0.7;}
.sec-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.8rem,4vw,4.5rem);font-weight:400;letter-spacing:0.02em;line-height:0.95;margin-bottom:1rem;}
.sec-title em{color:var(--red);font-style:normal;}

/* ── STATS STRIP ── */
.stats-strip{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:2.5rem 2rem;}
.stats-inner{max-width:1200px;margin:0 auto;display:flex;gap:0;justify-content:space-between;}
.stat-item{flex:1;text-align:center;padding:0 2rem;border-right:1px solid var(--border);}
.stat-item:last-child{border-right:none;}
.stat-val{font-family:'Bebas Neue',sans-serif;font-size:3.5rem;font-weight:400;letter-spacing:0.02em;color:var(--white);line-height:1;}
.stat-val em{color:var(--red);font-style:normal;}
.stat-label{font-size:12px;color:var(--gray);margin-top:6px;letter-spacing:0.05em;}

/* ── SERVICES ── */
.services{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.srv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);margin-top:3rem;}
.srv-card{background:var(--bg2);padding:2.5rem 2rem;transition:background 0.2s;}
.srv-card:hover{background:var(--bg3);}
.srv-icon{width:40px;height:40px;border:1px solid var(--gray3);display:flex;align-items:center;justify-content:center;margin-bottom:1.75rem;}
.srv-icon i{font-size:16px;color:var(--red);}
.srv-num{font-size:11px;color:var(--red);letter-spacing:0.15em;margin-bottom:0.75rem;}
.srv-title{font-family:'Bebas Neue',sans-serif;font-size:1.6rem;letter-spacing:0.03em;margin-bottom:0.75rem;}
.srv-desc{font-size:15px;color:var(--gray);line-height:1.75;font-weight:400;}
.srv-price{font-size:13px;color:var(--gray2);margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border);}
.srv-price strong{color:var(--red);font-weight:500;font-size:15px;}

/* ── PORTFOLIO ── */
.portfolio{background:var(--bg);}
.port-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);margin-top:3rem;}
.port-card{background:var(--bg);overflow:hidden;position:relative;cursor:pointer;transition:background 0.2s;}
.port-card:hover{background:var(--bg2);}
.port-img{width:100%;aspect-ratio:16/9;background:var(--bg3);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:1.25rem;}
.port-card:hover .port-img img{transform:scale(1.03);}
.port-img img{transition:transform 0.6s ease;width:100%;height:100%;object-fit:contain;object-position:top center;display:block;border-radius:3px;}
.port-info{padding:1.75rem 1.5rem;}
.port-tag{font-size:11px;letter-spacing:0.2em;color:var(--red);text-transform:uppercase;margin-bottom:0.5rem;}
.port-name{font-family:'Bebas Neue',sans-serif;font-size:1.6rem;letter-spacing:0.03em;margin-bottom:0.5rem;line-height:1.1;}
.port-desc{font-size:14px;color:var(--gray);font-weight:400;line-height:1.7;}
.port-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--gray2);margin-top:1rem;text-decoration:none;letter-spacing:0.05em;transition:color 0.3s;}
.port-link:hover{color:var(--red);}
.port-link.coming{cursor:default;color:var(--gray3);}
.port-link.coming:hover{color:var(--gray3);}

/* ── STACK ── */
.stack-section{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.stack-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1px;background:var(--border);margin-top:3rem;}
.stack-card{background:var(--bg2);padding:1.5rem 1.25rem;transition:background 0.2s;}
.stack-card:hover{background:var(--bg3);}
.stack-icon{width:36px;height:36px;border:1px solid var(--gray3);display:flex;align-items:center;justify-content:center;margin-bottom:1rem;}
.stack-icon i{font-size:15px;color:var(--red);}
.stack-name{font-size:14px;font-weight:500;margin-bottom:4px;color:var(--white);}
.stack-desc{font-size:12px;color:var(--gray);font-weight:400;}

/* ── ABOUT ── */
.about{background:var(--bg3);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.about-inner{display:grid;grid-template-columns:1fr 1.4fr;gap:5rem;align-items:start;}
.about-photo-wrap{position:relative;}
.about-photo{width:100%;aspect-ratio:3/4;overflow:hidden;border:1px solid var(--border);}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;filter:grayscale(20%);}
.about-photo-label{position:absolute;bottom:0;left:0;right:0;background:rgba(10,10,10,0.85);padding:1rem 1.25rem;border-top:1px solid var(--border);}
.about-photo-label p{font-size:13px;color:var(--gray);letter-spacing:0.05em;}
.about-photo-label strong{color:var(--white);display:block;font-size:15px;font-weight:500;margin-bottom:2px;}
.about-label{font-size:11px;letter-spacing:0.25em;color:var(--gray);text-transform:uppercase;margin-bottom:1.5rem;opacity:0.7;}
.about-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.5rem,3.5vw,4rem);font-weight:400;letter-spacing:0.02em;margin-bottom:1.5rem;line-height:0.95;}
.about-title em{color:var(--red);font-style:normal;}
.about-text{font-size:15px;color:var(--gray);font-weight:400;line-height:1.8;margin-bottom:2rem;}
.about-tags{display:flex;gap:8px;flex-wrap:wrap;}
.tag{font-size:12px;border:1px solid var(--gray3);color:var(--gray);padding:6px 14px;letter-spacing:0.05em;}

/* ── PROCESS ── */
.process{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.process-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);margin-top:3rem;}
.step{background:var(--bg2);padding:2rem 1.5rem;}
.step-num{font-size:11px;color:var(--red);letter-spacing:0.15em;margin-bottom:1.25rem;}
.step-title{font-family:'Bebas Neue',sans-serif;font-size:1.4rem;letter-spacing:0.03em;margin-bottom:0.6rem;}
.step-desc{font-size:14px;color:var(--gray);font-weight:400;line-height:1.75;}

/* ── CONTACT ── */
.contact{border-top:1px solid var(--border);background:var(--bg);}
.contact-inner{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start;}
.contact-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.8rem,4vw,4.5rem);font-weight:400;letter-spacing:0.02em;line-height:0.95;margin-bottom:1rem;}
.contact-title em{color:var(--red);font-style:normal;}
.contact-sub{font-size:15px;color:var(--gray);font-weight:400;line-height:1.8;margin-bottom:2rem;}
.contact-info{display:flex;flex-direction:column;gap:1rem;}
.contact-row{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--gray);}
.contact-row i{color:var(--red);font-size:14px;width:16px;}
.form{display:flex;flex-direction:column;gap:12px;}
.form input,.form textarea,.form select{background:var(--bg3);border:1px solid var(--gray3);color:var(--white);font-family:'Inter',sans-serif;font-size:14px;padding:13px 16px;outline:none;resize:none;transition:border-color 0.3s;-webkit-appearance:none;appearance:none;}
.form input::placeholder,.form textarea::placeholder{color:var(--gray2);}
.form input:focus,.form textarea:focus,.form select:focus{border-color:var(--red);}
.form select option{background:var(--bg3);color:var(--white);}
.form textarea{height:110px;}

/* ── BUTTONS ── */
.btn-red{background:var(--red);color:#fff;border:none;padding:14px 30px;font-size:14px;font-family:'Inter',sans-serif;font-weight:500;letter-spacing:0.08em;cursor:pointer;transition:opacity 0.3s,transform 0.2s;}
.btn-red:hover{opacity:0.88;transform:translateY(-1px);}
.btn-ghost{background:none;color:var(--white);border:1px solid var(--gray2);padding:14px 30px;font-size:14px;font-family:'Inter',sans-serif;letter-spacing:0.08em;cursor:pointer;transition:border-color 0.3s,transform 0.2s;}
.btn-ghost:hover{border-color:var(--gray);transform:translateY(-1px);}

/* ── FOOTER ── */
footer{background:var(--bg);padding:2rem;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;}
.f-logo{display:flex;align-items:center;gap:8px;}
.f-logo-sq{width:24px;height:24px;border:1px solid var(--red);display:flex;align-items:center;justify-content:center;}
.f-logo-sq span{font-size:11px;font-weight:600;color:var(--red);}
.f-name{font-size:13px;font-weight:500;letter-spacing:0.1em;}
.f-copy{font-size:12px;color:var(--gray2);letter-spacing:0.05em;}
.f-links{display:flex;gap:1.5rem;}
.f-links a{font-size:13px;color:var(--gray2);text-decoration:none;letter-spacing:0.05em;transition:color 0.3s;}
.f-links a:hover{color:var(--red);}

/* ── ANIMATIONS ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
.reveal{opacity:0;transform:translateY(24px);transition:opacity 0.6s,transform 0.6s;}
.reveal.visible{opacity:1;transform:translateY(0);}

/* ── HERO SCROLL HINT ── */
.hero-scroll{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:0.2em;color:var(--gray2);text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:8px;}
.hero-scroll::after{content:'';display:block;width:1px;height:40px;background:linear-gradient(to bottom,var(--gray2),transparent);}

/* ── RESPONSIVE ── */
@media(max-width:1100px){
  .hero{grid-template-columns:1fr;gap:3rem;padding:8rem 2rem 4rem;}
  .hero-visual{max-width:600px;}
  .hero-h1{font-size:clamp(3.5rem,8vw,6rem);}
}
@media(max-width:900px){
  .srv-grid{grid-template-columns:1fr;}
  .port-grid{grid-template-columns:1fr;}
  .about-inner{grid-template-columns:1fr;}
  .about-photo{aspect-ratio:1/1;max-width:340px;}
  .process-steps{grid-template-columns:1fr 1fr;}
  .contact-inner{grid-template-columns:1fr;}
  .nav-links{display:none;}
  .nav-cta{display:none;}
  .burger{display:flex;}
  .stats-inner{flex-wrap:wrap;gap:0;}
  .stat-item{flex:0 0 50%;border-right:none;border-bottom:1px solid var(--border);padding:1.5rem;}
  .stat-item:nth-child(odd){border-right:1px solid var(--border);}
  .stat-item:nth-last-child(-n+2){border-bottom:none;}
}
@media(max-width:540px){
  .process-steps{grid-template-columns:1fr;}
  section{padding:3.5rem 1.5rem;}
  nav{padding:0 1.5rem;}
  .hero{padding:7rem 1.5rem 4rem;}
  .hero-eyebrow-separator{display:none;}
  .hero-eyebrow-role{display:block;margin-top:0.35rem;}
  footer{padding:1.5rem;}
  .stat-item{flex:0 0 100%;border-right:none;}
  .stat-item:nth-child(odd){border-right:none;}
  .stat-item{border-bottom:1px solid var(--border);}
  .stat-item:last-child{border-bottom:none;}
}

/* DNPROD Phase 2 — cinematic hero v3
   Goal: match the approved concept more closely: poster-scale type, layered depth,
   integrated AurumTrade artwork, red geometry and strong black/red/white DNPROD identity.
   AurumTrade green remains project-local only. */

.hero-scene{
  position:relative!important;
  overflow:hidden!important;
  border-bottom:0!important;
  background:#030303!important;
  isolation:isolate;
}
.hero-scene::before{
  content:"";
  position:absolute;
  inset:-16% -10% -8% 22%;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 72% 38%,rgba(142,25,48,.36) 0,rgba(142,25,48,.14) 18%,transparent 46%),
    radial-gradient(ellipse at 49% 62%,rgba(142,25,48,.16) 0,transparent 35%),
    linear-gradient(124deg,transparent 0 47%,rgba(142,25,48,.08) 47.3%,transparent 48.2%);
  filter:blur(7px);
}
.hero-scene::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(3,3,3,.96) 0%,rgba(3,3,3,.42) 42%,rgba(3,3,3,.06) 67%,rgba(3,3,3,.7) 100%),
    linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.28) 76%,#030303 100%),
    repeating-linear-gradient(118deg,transparent 0 118px,rgba(255,255,255,.018) 119px,transparent 120px 238px);
}

.hero.hero-v2{
  max-width:1780px!important;
  min-height:100svh!important;
  margin:0 auto!important;
  padding:104px clamp(24px,4.5vw,76px) 104px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.04fr) minmax(500px,.96fr)!important;
  gap:0!important;
  align-items:center!important;
  border:0!important;
  position:relative!important;
  z-index:2!important;
  background:transparent!important;
}
.hero.hero-v2::before{
  content:"DNPROD";
  position:absolute;
  left:clamp(10px,2.3vw,46px);
  top:50%;
  transform:translateY(-53%) scaleY(1.12);
  z-index:0;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(260px,31vw,610px);
  line-height:.68;
  letter-spacing:-.045em;
  white-space:nowrap;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.035);
  text-shadow:0 0 120px rgba(142,25,48,.04);
  pointer-events:none;
}

.hero-v2 .hero-content{
  max-width:940px;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start;
  position:relative;
  z-index:8;
  padding-top:10px;
}
.hero-v2 .hero-content::before{
  content:"";
  position:absolute;
  left:-9vw;
  top:33%;
  width:32vw;
  height:15vw;
  min-height:110px;
  max-height:250px;
  z-index:-1;
  background:linear-gradient(96deg,rgba(142,25,48,.92),rgba(142,25,48,.18) 52%,transparent 78%);
  clip-path:polygon(0 40%,86% 0,100% 20%,14% 100%);
  filter:drop-shadow(0 0 34px rgba(142,25,48,.16));
  opacity:.44;
  transform:rotate(-8deg);
  pointer-events:none;
}
.hero-v2 .hero-content::after{
  content:"";
  position:absolute;
  left:40%;
  top:6%;
  width:250px;
  height:360px;
  z-index:-1;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(142,25,48,.34) 52%,transparent 100%);
  clip-path:polygon(56% 0,100% 8%,28% 100%,0 82%);
  opacity:.42;
  transform:rotate(18deg);
  pointer-events:none;
}

.hero-v2 .hero-kicker{
  margin:0 0 20px;
  color:#fff;
  font-size:clamp(10px,.82vw,13px);
  font-weight:600;
  letter-spacing:.38em;
  text-transform:uppercase;
  opacity:.9;
  text-shadow:0 2px 20px rgba(0,0,0,.7);
}
.hero-v2 .hero-kicker::before{
  content:"";
  display:inline-block;
  width:52px;
  height:2px;
  margin:0 16px 3px 0;
  background:#8E1930;
  box-shadow:0 0 18px rgba(142,25,48,.62);
}

.hero-v2 .hero-brand{
  margin:0;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(126px,14.7vw,268px);
  line-height:.69;
  letter-spacing:-.035em;
  font-weight:400;
  white-space:nowrap;
  position:relative;
  z-index:9;
  text-transform:uppercase;
  filter:drop-shadow(0 18px 35px rgba(0,0,0,.42));
}
.hero-v2 .hero-brand .hero-brand-white{
  color:#fff;
  background:linear-gradient(180deg,#fff 0%,#f8f8f8 48%,#bfbfbf 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero-v2 .hero-brand .hero-brand-red{
  color:#8E1930;
  background:linear-gradient(180deg,#8E1930 0%,#8E1930 48%,#8E1930 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:0 0 56px rgba(142,25,48,.16);
}
.hero-v2 .hero-brand::before{
  content:"";
  position:absolute;
  left:30%;
  right:-26%;
  top:45%;
  height:10px;
  background:linear-gradient(90deg,transparent 0,#8E1930 16%,rgba(142,25,48,.16) 72%,transparent 100%);
  clip-path:polygon(0 38%,100% 0,100% 38%,0 100%);
  transform:rotate(-5deg);
  opacity:.85;
  pointer-events:none;
  z-index:10;
  mix-blend-mode:screen;
}
.hero-v2 .hero-brand::after{
  content:"";
  position:absolute;
  left:48%;
  right:-40%;
  top:56%;
  height:1px;
  background:linear-gradient(90deg,#fff,rgba(142,25,48,.9),transparent 82%);
  box-shadow:0 10px 0 rgba(142,25,48,.16),0 -12px 0 rgba(255,255,255,.045);
  transform:rotate(-5deg);
  transform-origin:left center;
  pointer-events:none;
}

.hero-v2 .hero-statement{
  max-width:610px;
  margin:36px 0 0;
  color:rgba(255,255,255,.75);
  font-size:clamp(16px,1.18vw,20px);
  line-height:1.6;
  font-weight:400;
  text-shadow:0 2px 18px rgba(0,0,0,.9);
}
.hero-v2 .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:11px;
  margin-top:32px;
}
.hero-v2 .hero-actions .btn-red,
.hero-v2 .hero-actions .btn-ghost{
  min-width:176px;
  min-height:54px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:0!important;
  text-transform:uppercase;
  letter-spacing:.17em;
  font-size:11px;
  font-weight:600;
  backdrop-filter:blur(10px);
}
.hero-v2 .hero-actions .btn-red{
  box-shadow:0 18px 52px rgba(142,25,48,.25),inset 0 1px rgba(255,255,255,.12);
}
.hero-v2 .hero-actions .btn-ghost{
  background:rgba(0,0,0,.26)!important;
}
.hero-v2 .hero-proofline{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  margin-top:23px;
  color:rgba(255,255,255,.38);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.22em;
}
.hero-v2 .hero-proofline span{display:inline-flex;align-items:center;gap:9px;}
.hero-v2 .hero-proofline span::before{
  content:"";
  width:14px;
  height:1px;
  background:#8E1930;
}

/* AurumTrade is an integrated scene element, not a generic card. */
.hero-v2 .hero-feature{
  width:min(112%,760px);
  justify-self:end;
  position:relative;
  z-index:5;
  margin-left:-128px;
  transform:translate(24px,18px) rotate(-2.35deg);
  transform-origin:center center;
  filter:drop-shadow(0 54px 54px rgba(0,0,0,.62));
}
.hero-v2 .hero-feature::before{
  content:"";
  position:absolute;
  z-index:-2;
  width:74%;
  height:58%;
  right:-12%;
  top:-14%;
  background:radial-gradient(ellipse,rgba(142,25,48,.42),rgba(142,25,48,.13) 38%,transparent 70%);
  filter:blur(15px);
  transform:rotate(8deg);
}
.hero-v2 .hero-feature::after{
  content:"";
  position:absolute;
  z-index:-1;
  left:-12%;
  top:7%;
  width:128%;
  height:100%;
  background:
    linear-gradient(104deg,transparent 0 13%,rgba(142,25,48,.84) 13.3% 14%,transparent 14.2% 68%,rgba(142,25,48,.42) 68.4% 69%,transparent 69.3%),
    linear-gradient(74deg,transparent 0 70%,rgba(255,255,255,.09) 70.3% 70.7%,transparent 71%);
  clip-path:polygon(0 28%,9% 17%,18% 18%,10% 48%,21% 46%,5% 85%,0 83%,13% 52%,2% 54%);
  opacity:.95;
  filter:drop-shadow(0 0 18px rgba(142,25,48,.45));
  pointer-events:none;
}
.hero-v2 .feature-shell{
  position:relative;
  overflow:hidden;
  min-height:520px;
  background:#060608;
  border:1px solid rgba(255,255,255,.19);
  clip-path:polygon(5.5% 0,100% 0,100% 88%,94% 100%,0 100%,0 11%);
  box-shadow:0 0 0 1px rgba(142,25,48,.12),0 70px 110px rgba(0,0,0,.7);
}
.hero-v2 .feature-shell::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 16%,transparent 70%,rgba(0,0,0,.72) 100%),
    linear-gradient(90deg,rgba(0,0,0,.52),transparent 16%,transparent 80%,rgba(0,0,0,.35));
}
.hero-v2 .feature-shell::after{
  content:"";
  position:absolute;
  z-index:4;
  left:-8%;
  right:-8%;
  top:59%;
  height:2px;
  background:linear-gradient(90deg,transparent,#8E1930 18%,rgba(255,255,255,.72) 48%,#8E1930 66%,transparent 92%);
  box-shadow:0 0 22px rgba(142,25,48,.5);
  transform:rotate(-5deg);
  opacity:.72;
  pointer-events:none;
}
.hero-v2 .feature-topline{
  position:absolute;
  top:20px;
  left:28px;
  right:28px;
  z-index:6;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:rgba(255,255,255,.74);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.26em;
  text-shadow:0 2px 14px #000;
}
.hero-v2 .feature-index{color:#fff;}
.hero-v2 .feature-visual{
  position:absolute;
  inset:0;
  aspect-ratio:auto;
  overflow:hidden;
  background:#060608;
}
.hero-v2 .feature-visual img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:50% 16%;
  filter:none!important;
  transform:scale(1.07);
}
.hero-v2 .feature-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.02) 0,transparent 48%,rgba(6,6,8,.9) 89%,#060608 100%),
    linear-gradient(90deg,rgba(0,0,0,.33),transparent 20%,transparent 78%,rgba(0,0,0,.28));
  pointer-events:none;
}
.hero-v2 .feature-copy{
  position:absolute;
  left:30px;
  right:34px;
  bottom:30px;
  z-index:7;
  margin:0;
  padding:0;
  transform:rotate(2.35deg);
  transform-origin:left bottom;
}
.hero-v2 .feature-brand{
  color:#fff;
  font-size:clamp(32px,2.6vw,46px);
  line-height:.92;
  font-weight:800;
  letter-spacing:-.045em;
  text-shadow:0 3px 18px #000;
}
.hero-v2 .feature-brand span{color:#1A7A35;}
.hero-v2 .feature-title{
  max-width:420px;
  margin-top:12px;
  color:rgba(255,255,255,.7);
  font-size:12px;
  line-height:1.55;
  text-shadow:0 2px 14px #000;
}
.hero-v2 .feature-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:17px;
  color:#fff;
  text-decoration:none;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.2em;
  text-shadow:0 2px 12px #000;
}
.hero-v2 .feature-link::after{content:"→";color:#1A7A35;font-size:16px;}
.hero-v2 .project-green-rule{
  position:absolute;
  left:0;
  top:8%;
  bottom:8%;
  width:3px;
  background:linear-gradient(180deg,transparent,#1A7A35 18%,#1A7A35 82%,transparent);
  z-index:7;
  box-shadow:0 0 16px rgba(26,122,53,.4);
}

.hero-service-rail{
  max-width:1780px;
  margin:-100px auto 0;
  padding:0 clamp(24px,4.5vw,76px) 28px;
  position:relative;
  z-index:9;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  background:transparent;
}
.hero-service-item{
  min-height:76px;
  border-top:1px solid rgba(255,255,255,.14);
  border-left:1px solid rgba(255,255,255,.12);
  padding:13px 20px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:linear-gradient(180deg,rgba(8,8,8,.12),rgba(8,8,8,.62));
  backdrop-filter:blur(8px);
}
.hero-service-item:last-child{border-right:1px solid rgba(255,255,255,.12);}
.hero-service-num{color:#8E1930;font-size:8px;letter-spacing:.22em;margin-bottom:6px;}
.hero-service-label{color:#fff;font-size:10px;text-transform:uppercase;letter-spacing:.17em;line-height:1.45;}
.hero-scroll{display:none!important;}

@media(max-width:1250px){
  .hero.hero-v2{
    grid-template-columns:minmax(0,1fr) minmax(430px,.9fr)!important;
  }
  .hero-v2 .hero-brand{font-size:clamp(112px,14vw,190px);}
  .hero-v2 .hero-feature{margin-left:-85px;width:min(112%,650px);}
  .hero-v2 .feature-shell{min-height:470px;}
}

@media(max-width:900px){
  .hero.hero-v2{
    min-height:auto!important;
    grid-template-columns:1fr!important;
    gap:18px!important;
    padding:104px 24px 144px!important;
  }
  .hero.hero-v2::before{
    top:30%;
    left:-12%;
    font-size:74vw;
    opacity:.7;
  }
  .hero-v2 .hero-content{max-width:100%;}
  .hero-v2 .hero-brand{
    font-size:clamp(108px,26vw,190px);
    line-height:.72;
    white-space:nowrap;
  }
  .hero-v2 .hero-statement{max-width:620px;margin-top:28px;font-size:16px;}
  .hero-v2 .hero-feature{
    width:min(104%,720px);
    justify-self:end;
    margin:26px -6% 0 0;
    transform:rotate(-1.6deg);
  }
  .hero-v2 .feature-shell{min-height:480px;}
  .hero-v2 .feature-copy{transform:rotate(1.6deg);}
  .hero-service-rail{
    margin:-116px auto 0;
    padding:0 24px 20px;
  }
}

@media(max-width:540px){
  .hero-scene::before{
    inset:8% -86% auto -8%;
    height:56%;
    opacity:.84;
  }
  .hero-scene::after{
    background:
      linear-gradient(180deg,rgba(3,3,3,.1),rgba(3,3,3,.32) 62%,#030303 100%),
      repeating-linear-gradient(118deg,transparent 0 76px,rgba(255,255,255,.015) 77px,transparent 78px 152px);
  }
  .hero.hero-v2{
    padding:90px 18px 174px!important;
    gap:16px!important;
  }
  .hero.hero-v2::before{
    left:-44%;
    top:28%;
    font-size:98vw;
    -webkit-text-stroke:1px rgba(255,255,255,.03);
  }
  .hero-v2 .hero-content::before{
    left:-36vw;
    top:31%;
    width:110vw;
    height:33vw;
    opacity:.33;
  }
  .hero-v2 .hero-content::after{
    left:58%;
    top:1%;
    width:140px;
    height:240px;
    opacity:.34;
  }
  .hero-v2 .hero-kicker{
    font-size:8px;
    letter-spacing:.29em;
    line-height:1.6;
    margin-bottom:17px;
  }
  .hero-v2 .hero-kicker::before{width:26px;margin-right:9px;}
  .hero-v2 .hero-brand{
    font-size:clamp(88px,27.4vw,126px);
    letter-spacing:-.028em;
  }
  .hero-v2 .hero-brand::before{left:28%;right:-18%;height:7px;}
  .hero-v2 .hero-statement{font-size:14px;line-height:1.58;margin-top:26px;max-width:95%;}
  .hero-v2 .hero-actions{width:100%;gap:8px;margin-top:26px;}
  .hero-v2 .hero-actions .btn-red,
  .hero-v2 .hero-actions .btn-ghost{
    flex:1 1 142px;
    min-width:0;
    min-height:49px;
    font-size:9px;
    letter-spacing:.12em;
  }
  .hero-v2 .hero-proofline{gap:9px 14px;margin-top:19px;}
  .hero-v2 .hero-proofline span{font-size:7px;}
  .hero-v2 .hero-feature{
    width:112%;
    margin:28px -8% 0 -4%;
    transform:rotate(-2deg);
  }
  .hero-v2 .hero-feature::before{right:-24%;top:-20%;width:95%;height:70%;}
  .hero-v2 .feature-shell{min-height:360px;clip-path:polygon(5% 0,100% 0,100% 90%,94% 100%,0 100%,0 10%);}
  .hero-v2 .feature-topline{top:14px;left:18px;right:18px;font-size:6.5px;}
  .hero-v2 .feature-visual img{transform:scale(1.1);object-position:50% 10%;}
  .hero-v2 .feature-copy{left:20px;right:22px;bottom:20px;transform:rotate(2deg);}
  .hero-v2 .feature-brand{font-size:29px;}
  .hero-v2 .feature-title{font-size:10.5px;max-width:80%;margin-top:8px;}
  .hero-v2 .feature-link{font-size:7.5px;margin-top:11px;}
  .hero-service-rail{
    margin:-144px 0 0;
    padding:0 18px 18px;
    grid-template-columns:1fr;
  }
  .hero-service-item,
  .hero-service-item:last-child{
    min-height:49px;
    border-right:0;
    border-left:1px solid rgba(255,255,255,.12);
    border-bottom:1px solid rgba(255,255,255,.07);
    padding:8px 12px;
  }
  .hero-service-label{font-size:8px;}
}

@media(prefers-reduced-motion:reduce){
  .hero-v2 *{
    animation:none!important;
    transition:none!important;
  }
}

/* DNPROD cinematic v4 — campaign composition pass
   Goal: match the approved visual's scale, overlap, depth and red/black/white drama.
   AurumTrade remains authentically green inside the project artwork only. */

.hero-scene{
  min-height:100svh!important;
  background:
    radial-gradient(ellipse at 73% 42%,rgba(142,25,48,.19) 0,rgba(142,25,48,.07) 23%,transparent 48%),
    radial-gradient(ellipse at 34% 72%,rgba(142,25,48,.09),transparent 38%),
    linear-gradient(112deg,#030303 0%,#050505 48%,#090304 100%)!important;
}

.hero-scene::before{
  inset:-12% -8% -16% 28%!important;
  height:auto!important;
  filter:none!important;
  opacity:1!important;
  background:
    linear-gradient(66deg,transparent 0 45%,rgba(142,25,48,.14) 45.15% 45.7%,transparent 45.85%),
    linear-gradient(114deg,transparent 0 61%,rgba(142,25,48,.26) 61.05% 61.55%,transparent 61.7%),
    linear-gradient(80deg,transparent 0 72%,rgba(255,255,255,.055) 72.05% 72.25%,transparent 72.4%),
    radial-gradient(circle at 71% 39%,rgba(142,25,48,.26),transparent 27%)!important;
  clip-path:polygon(10% 0,100% 0,100% 100%,0 89%);
}

.hero-scene::after{
  opacity:.82!important;
  background:
    linear-gradient(90deg,rgba(0,0,0,.98) 0%,rgba(0,0,0,.72) 29%,transparent 52%,transparent 100%),
    linear-gradient(180deg,rgba(0,0,0,.46),transparent 22%,transparent 70%,rgba(0,0,0,.74)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.015) 0 1px,transparent 1px 4px)!important;
}

.hero.hero-v2{
  max-width:none!important;
  width:100%!important;
  min-height:100svh!important;
  padding:108px clamp(24px,4.7vw,86px) 124px!important;
  display:block!important;
  position:relative!important;
  overflow:visible!important;
}

.hero.hero-v2::before{
  content:'DNPROD';
  position:absolute;
  left:-.025em;
  top:50%;
  transform:translateY(-47%);
  z-index:1;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(190px,25vw,490px);
  line-height:.75;
  letter-spacing:-.055em;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.055);
  text-stroke:1px rgba(255,255,255,.055);
  white-space:nowrap;
  pointer-events:none;
}

.hero.hero-v2::after{
  content:'';
  position:absolute;
  z-index:5;
  width:min(34vw,590px);
  height:min(33vw,560px);
  right:-8vw;
  top:5vh;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(142,25,48,.92),rgba(142,25,48,.5) 50%,transparent 51%);
  clip-path:polygon(52% 0,100% 8%,73% 100%,0 74%);
  filter:drop-shadow(0 0 34px rgba(142,25,48,.2));
  opacity:.62;
  mix-blend-mode:screen;
}

.hero-v2 .hero-content{
  width:min(58vw,980px)!important;
  max-width:none!important;
  min-height:calc(100svh - 232px);
  justify-content:center;
  z-index:9!important;
  padding-top:3vh;
}

.hero-v2 .hero-content::before{
  content:'';
  position:absolute;
  left:-7vw;
  top:8%;
  width:42vw;
  height:70%;
  z-index:-1;
  background:linear-gradient(91deg,rgba(0,0,0,.96),rgba(0,0,0,.76) 56%,transparent);
  filter:blur(1px);
  pointer-events:none;
}

.hero-v2 .hero-content::after{
  content:'';
  position:absolute;
  left:51%;
  top:31%;
  width:230px;
  height:18px;
  background:#8E1930;
  transform:rotate(-17deg) skewX(-34deg);
  transform-origin:left center;
  box-shadow:
    125px -104px 0 -5px rgba(142,25,48,.86),
    202px 124px 0 -7px rgba(142,25,48,.7),
    350px -52px 0 -6px rgba(255,255,255,.16);
  opacity:.92;
  pointer-events:none;
  z-index:10;
}

.hero-v2 .hero-kicker{
  margin:0 0 18px!important;
  font-size:clamp(10px,.88vw,13px)!important;
  letter-spacing:.42em!important;
  text-shadow:0 0 22px rgba(255,255,255,.12);
}

.hero-v2 .hero-brand{
  font-size:clamp(138px,15.8vw,300px)!important;
  line-height:.66!important;
  letter-spacing:-.04em!important;
  margin-left:-.018em!important;
  z-index:12;
  filter:drop-shadow(0 30px 42px rgba(0,0,0,.44));
}

.hero-v2 .hero-brand .hero-brand-white{
  background:linear-gradient(180deg,#fff 0%,#fff 38%,#d8d8d8 71%,#9a9a9a 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
}

.hero-v2 .hero-brand .hero-brand-red{
  background:linear-gradient(180deg,#8E1930 0%,#8E1930 47%,#8E1930 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  filter:drop-shadow(0 0 28px rgba(142,25,48,.25));
}

.hero-v2 .hero-brand::before{
  content:'';
  position:absolute;
  left:47.5%;
  top:-12%;
  width:2px;
  height:128%;
  background:linear-gradient(180deg,transparent,#8E1930 20% 72%,transparent);
  transform:rotate(13deg);
  opacity:.75;
}

.hero-v2 .hero-brand::after{
  left:36%!important;
  right:-28%!important;
  top:58%!important;
  height:2px!important;
  transform:rotate(-8deg)!important;
  background:linear-gradient(90deg,transparent,#8E1930 19% 54%,rgba(255,255,255,.32) 55%,transparent 83%)!important;
  box-shadow:0 0 28px rgba(142,25,48,.38);
}

.hero-v2 .hero-statement{
  width:min(42vw,690px)!important;
  max-width:none!important;
  margin:38px 0 0!important;
  font-size:clamp(15px,1.2vw,20px)!important;
  line-height:1.58!important;
  color:rgba(255,255,255,.76)!important;
  text-wrap:balance;
  text-shadow:0 2px 18px rgba(0,0,0,.7);
}

.hero-v2 .hero-actions{margin-top:32px!important;}
.hero-v2 .hero-proofline{margin-top:22px!important;}

/* Featured project becomes a scene object, not a card. */
.hero-v2 .hero-feature{
  position:absolute!important;
  z-index:4!important;
  right:clamp(-150px,-5vw,-44px)!important;
  top:50%!important;
  width:min(58vw,980px)!important;
  max-width:none!important;
  transform:translateY(-48%) perspective(1700px) rotateY(-9deg) rotateZ(-2.2deg)!important;
  transform-origin:center center;
  filter:drop-shadow(-36px 54px 70px rgba(0,0,0,.7));
}

.hero-v2 .hero-feature::before{
  width:73%!important;
  height:84%!important;
  right:-4%!important;
  top:-8%!important;
  background:
    radial-gradient(circle at 52% 46%,rgba(142,25,48,.28),transparent 55%),
    linear-gradient(125deg,transparent 0 48%,rgba(142,25,48,.38) 48.2% 49%,transparent 49.3%)!important;
  filter:blur(2px)!important;
}

.hero-v2 .hero-feature::after{
  left:-17%!important;
  bottom:10%!important;
  width:58%!important;
  height:24%!important;
  background:linear-gradient(152deg,transparent 0 31%,rgba(142,25,48,.96) 31.2% 43%,transparent 43.2%)!important;
  box-shadow:none!important;
  transform:none!important;
  clip-path:polygon(0 48%,100% 0,83% 100%,18% 78%);
  opacity:.86;
}

.hero-v2 .feature-shell{
  overflow:visible!important;
  background:#060608!important;
  border:1px solid rgba(255,255,255,.18)!important;
  clip-path:polygon(3.2% 0,100% 0,96.8% 100%,0 100%);
  box-shadow:
    -42px 58px 95px rgba(0,0,0,.72),
    0 0 0 1px rgba(142,25,48,.08),
    0 0 74px rgba(142,25,48,.12)!important;
}

.hero-v2 .feature-shell::before{
  background:
    linear-gradient(92deg,rgba(0,0,0,.14),transparent 20%,transparent 72%,rgba(0,0,0,.42)),
    linear-gradient(180deg,rgba(255,255,255,.045),transparent 24%,transparent 67%,rgba(0,0,0,.62))!important;
}

.hero-v2 .feature-shell::after{
  content:'';
  position:absolute;
  z-index:6;
  inset:-9% auto auto -5%;
  width:38%;
  height:21%;
  background:linear-gradient(150deg,transparent 0 40%,#8E1930 40.4% 55%,transparent 55.4%);
  clip-path:polygon(0 28%,100% 0,78% 100%,12% 78%);
  pointer-events:none;
  opacity:.92;
}

.hero-v2 .feature-visual{
  aspect-ratio:16/9!important;
  background:#060608!important;
  overflow:hidden!important;
}

.hero-v2 .feature-visual img{
  transform:scale(1.08)!important;
  object-position:center 14%!important;
  filter:contrast(1.04) saturate(1.04)!important;
}

.hero-v2 .feature-visual::after{
  height:55%!important;
  background:linear-gradient(180deg,transparent 0%,rgba(6,6,8,.24) 36%,#060608 100%)!important;
}

.hero-v2 .feature-copy{
  margin-top:-92px!important;
  padding:0 42px 34px 46px!important;
  text-shadow:0 4px 20px rgba(0,0,0,.8);
}

.hero-v2 .feature-brand{
  font-size:clamp(34px,3vw,54px)!important;
  letter-spacing:-.045em!important;
}
.hero-v2 .feature-title{font-size:13px!important;max-width:430px;}
.hero-v2 .feature-link{margin-top:14px!important;}
.hero-v2 .project-green-rule{width:3px!important;box-shadow:0 0 18px rgba(26,122,53,.35);}

/* Bottom rail turns into restrained campaign metadata. */
.hero-service-rail{
  position:absolute!important;
  left:clamp(24px,4.7vw,86px)!important;
  right:clamp(24px,4.7vw,86px)!important;
  bottom:20px!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  z-index:12!important;
  border-top:1px solid rgba(255,255,255,.13);
  background:linear-gradient(90deg,rgba(0,0,0,.42),transparent 75%)!important;
}
.hero-service-item{
  min-height:67px!important;
  border-left:0!important;
  border-right:1px solid rgba(255,255,255,.1)!important;
  padding:12px 22px 8px 0!important;
  margin-right:22px;
}
.hero-service-item:last-child{border-right:0!important;}
.hero-service-num{font-size:8px!important;}
.hero-service-label{font-size:10px!important;letter-spacing:.17em!important;}

/* Scene framing / cinematic side ticks. */
.hero-v2 .hero-proofline::after{
  content:'SELECTED CASE / 01';
  position:absolute;
  right:-31vw;
  bottom:-3px;
  color:rgba(255,255,255,.24);
  font-size:8px;
  letter-spacing:.32em;
  white-space:nowrap;
}

@media(max-width:1180px){
  .hero-v2 .hero-content{width:63vw!important;}
  .hero-v2 .hero-feature{width:min(61vw,860px)!important;right:-13vw!important;}
  .hero-v2 .hero-brand{font-size:clamp(126px,16.4vw,238px)!important;}
}

@media(max-width:900px){
  .hero.hero-v2{
    min-height:auto!important;
    padding:102px 24px 118px!important;
  }
  .hero.hero-v2::before{font-size:46vw;top:36%;opacity:.75;}
  .hero.hero-v2::after{right:-23vw;top:27%;width:64vw;height:56vw;opacity:.44;}
  .hero-v2 .hero-content{
    width:100%!important;
    min-height:auto!important;
    padding:2vh 0 0!important;
  }
  .hero-v2 .hero-content::before{left:-24px;top:0;width:105vw;height:68%;}
  .hero-v2 .hero-content::after{left:42%;top:29%;transform:rotate(-17deg) scale(.7);}
  .hero-v2 .hero-brand{font-size:clamp(92px,24vw,178px)!important;}
  .hero-v2 .hero-statement{width:min(92vw,650px)!important;}
  .hero-v2 .hero-feature{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    width:min(108%,760px)!important;
    margin:32px -4% 18px auto!important;
    transform:perspective(1300px) rotateY(-6deg) rotateZ(-1.5deg)!important;
  }
  .hero-v2 .feature-copy{margin-top:-64px!important;padding:0 26px 24px 30px!important;}
  .hero-service-rail{
    position:relative!important;
    left:auto!important;right:auto!important;bottom:auto!important;
    margin:-70px 24px 0!important;
    grid-template-columns:repeat(3,1fr)!important;
  }
  .hero-v2 .hero-proofline::after{display:none;}
}

@media(max-width:540px){
  .hero.hero-v2{padding:92px 18px 92px!important;}
  .hero.hero-v2::before{font-size:56vw;top:28%;left:-5vw;}
  .hero.hero-v2::after{right:-38vw;top:35%;width:86vw;height:78vw;}
  .hero-v2 .hero-kicker{letter-spacing:.31em!important;}
  .hero-v2 .hero-brand{font-size:clamp(82px,25vw,126px)!important;line-height:.69!important;}
  .hero-v2 .hero-brand::before{left:48%;height:118%;}
  .hero-v2 .hero-statement{font-size:15px!important;margin-top:28px!important;width:94%!important;}
  .hero-v2 .hero-actions{width:100%;}
  .hero-v2 .hero-feature{
    width:112%!important;
    margin:28px -9% 12px 1%!important;
    transform:perspective(900px) rotateY(-4deg) rotateZ(-1.8deg)!important;
  }
  .hero-v2 .feature-topline{font-size:6.5px!important;letter-spacing:.18em!important;}
  .hero-v2 .feature-copy{margin-top:-44px!important;padding:0 18px 18px 22px!important;}
  .hero-v2 .feature-brand{font-size:30px!important;}
  .hero-v2 .feature-title{font-size:11px!important;max-width:300px;}
  .hero-service-rail{
    margin:-48px 18px 0!important;
    grid-template-columns:1fr!important;
    border-top:1px solid rgba(255,255,255,.12)!important;
  }
  .hero-service-item{
    min-height:48px!important;
    margin:0!important;
    padding:8px 0!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.07)!important;
  }
  .hero-v2 .hero-content::after{opacity:.62;transform:rotate(-19deg) scale(.55);left:34%;top:28%;}
}

@media(prefers-reduced-motion:reduce){
  .hero-v2 .hero-feature{transform:none!important;}
}

/* V5 depth pass: foreground planes + lighting + restrained motion. */

.hero-scene{
  perspective:1600px;
}

.hero-v2 .hero-feature{
  animation:heroFeatureFloat 8.5s ease-in-out infinite;
}

.hero-v2 .feature-shell{
  transform-style:preserve-3d;
}

.hero-v2 .feature-visual::before{
  content:'';
  position:absolute;
  z-index:5;
  inset:-1px;
  pointer-events:none;
  background:
    linear-gradient(110deg,rgba(255,255,255,.09),transparent 14% 77%,rgba(142,25,48,.13)),
    linear-gradient(180deg,rgba(255,255,255,.035),transparent 23%);
  mix-blend-mode:screen;
}

.hero-v2 .feature-copy::before{
  content:'';
  position:absolute;
  left:-13%;
  top:-30px;
  width:64%;
  height:20px;
  z-index:-1;
  background:linear-gradient(90deg,transparent 0 4%,#8E1930 17% 72%,transparent 91%);
  transform:rotate(-11deg) skewX(-31deg);
  opacity:.78;
  box-shadow:0 0 34px rgba(142,25,48,.28);
}

.hero-v2 .feature-copy::after{
  content:'';
  position:absolute;
  right:-9%;
  bottom:20%;
  width:45%;
  height:12px;
  z-index:7;
  background:linear-gradient(90deg,transparent,#fff 36%,#8E1930 37% 72%,transparent);
  transform:rotate(-23deg) skewX(-38deg);
  opacity:.48;
  pointer-events:none;
}

.hero-v2 .hero-feature .feature-topline::before{
  content:'';
  width:42px;
  height:1px;
  margin-right:11px;
  background:#8E1930;
  box-shadow:0 0 12px rgba(142,25,48,.38);
}
.hero-v2 .hero-feature .feature-topline > span:first-child{
  margin-right:auto;
}

.hero-v2 .hero-brand{
  isolation:isolate;
}
.hero-v2 .hero-brand::selection{background:#8E1930;color:#fff;}

.hero-v2 .hero-kicker,
.hero-v2 .hero-brand,
.hero-v2 .hero-statement,
.hero-v2 .hero-actions,
.hero-v2 .hero-proofline{
  animation:heroTextEnter .9s cubic-bezier(.16,1,.3,1) both;
}
.hero-v2 .hero-brand{animation-delay:.05s;}
.hero-v2 .hero-statement{animation-delay:.12s;}
.hero-v2 .hero-actions{animation-delay:.18s;}
.hero-v2 .hero-proofline{animation-delay:.24s;}

.hero-v2 .feature-shell{
  animation:heroObjectEnter 1.05s .08s cubic-bezier(.16,1,.3,1) both;
}

/* A foreground wedge cutting across the right edge gives the screenshot physical depth. */
.hero-v2 .hero-feature .project-green-rule::after{
  content:'';
  position:absolute;
  left:clamp(480px,47vw,820px);
  top:36%;
  width:260px;
  height:150px;
  background:linear-gradient(135deg,rgba(142,25,48,.88),rgba(142,25,48,.16) 64%,transparent 65%);
  clip-path:polygon(34% 0,100% 14%,72% 100%,0 78%);
  opacity:.58;
  transform:translateZ(80px) rotate(7deg);
  filter:drop-shadow(0 0 30px rgba(142,25,48,.16));
  pointer-events:none;
}

.hero-service-rail::before{
  content:'DIGITAL PRODUCTION STUDIO';
  position:absolute;
  right:0;
  top:-20px;
  color:rgba(255,255,255,.18);
  font-size:7px;
  letter-spacing:.38em;
  white-space:nowrap;
}

@keyframes heroFeatureFloat{
  0%,100%{transform:translateY(-48%) perspective(1700px) rotateY(-9deg) rotateZ(-2.2deg) translate3d(0,0,0);}
  50%{transform:translateY(calc(-48% - 7px)) perspective(1700px) rotateY(-8.2deg) rotateZ(-1.8deg) translate3d(-3px,0,0);}
}
@keyframes heroTextEnter{
  from{opacity:0;transform:translate3d(-24px,20px,0);filter:blur(4px);}
  to{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}
@keyframes heroObjectEnter{
  from{opacity:0;transform:translate3d(70px,28px,0) scale(.965);filter:blur(5px);}
  to{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0);}
}

@media(max-width:900px){
  .hero-v2 .hero-feature{animation:heroFeatureFloatTablet 8.5s ease-in-out infinite;}
  .hero-v2 .hero-feature .project-green-rule::after{left:auto;right:-12%;width:180px;height:110px;}
  @keyframes heroFeatureFloatTablet{
    0%,100%{transform:perspective(1300px) rotateY(-6deg) rotateZ(-1.5deg) translateY(0);}
    50%{transform:perspective(1300px) rotateY(-5deg) rotateZ(-1.1deg) translateY(-5px);}
  }
}

@media(max-width:540px){
  .hero-v2 .feature-copy::after{display:none;}
  .hero-v2 .hero-feature .project-green-rule::after{right:-24%;top:42%;width:145px;height:90px;opacity:.46;}
  .hero-service-rail::before{display:none;}
}

@media(prefers-reduced-motion:reduce){
  .hero-v2 .hero-feature,
  .hero-v2 .hero-kicker,
  .hero-v2 .hero-brand,
  .hero-v2 .hero-statement,
  .hero-v2 .hero-actions,
  .hero-v2 .hero-proofline,
  .hero-v2 .feature-shell{
    animation:none!important;
  }
}

/* V6 typography pass — distressed DNPROD surface from the approved visual.
   Texture is contained inside the wordmark; site palette stays black/red/white. */

.hero-v2 .hero-brand .hero-brand-white,
.hero-v2 .hero-brand .hero-brand-red{
  position:relative;
  background-blend-mode:normal;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}

/* White DN: worn ink / sanded metal. Dark marks read as missing paint against the black scene. */
.hero-v2 .hero-brand .hero-brand-white{
  background-image:
    repeating-linear-gradient(101deg,
      transparent 0 12px,
      rgba(4,4,4,.78) 12.5px 13.6px,
      transparent 14px 31px,
      rgba(4,4,4,.42) 31.4px 32.2px,
      transparent 33px 48px),
    repeating-linear-gradient(176deg,
      transparent 0 21px,
      rgba(4,4,4,.58) 21.5px 22.4px,
      transparent 23px 53px),
    radial-gradient(ellipse at 14% 28%,rgba(4,4,4,.92) 0 1.2%,transparent 1.45%),
    radial-gradient(ellipse at 31% 72%,rgba(4,4,4,.68) 0 .9%,transparent 1.18%),
    radial-gradient(ellipse at 64% 23%,rgba(4,4,4,.72) 0 .75%,transparent 1.05%),
    radial-gradient(ellipse at 78% 61%,rgba(4,4,4,.88) 0 1.15%,transparent 1.42%),
    radial-gradient(ellipse at 92% 37%,rgba(4,4,4,.55) 0 .7%,transparent .96%),
    linear-gradient(180deg,#fff 0%,#fff 35%,#d7d7d7 68%,#8f8f8f 100%)!important;
  background-size:
    79px 63px,
    113px 77px,
    100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,
    100% 100%!important;
  background-position:
    7px 4px,
    -17px 11px,
    0 0,0 0,0 0,0 0,0 0,
    0 0!important;
}

/* Red PROD gets the same physical wear, slightly stronger so the bright red does not look digitally perfect. */
.hero-v2 .hero-brand .hero-brand-red{
  background-image:
    repeating-linear-gradient(107deg,
      transparent 0 9px,
      rgba(3,3,3,.9) 9.4px 10.7px,
      transparent 11.2px 27px,
      rgba(3,3,3,.48) 27.3px 28px,
      transparent 28.5px 43px),
    repeating-linear-gradient(182deg,
      transparent 0 18px,
      rgba(3,3,3,.62) 18.4px 19.2px,
      transparent 20px 47px),
    radial-gradient(ellipse at 11% 58%,rgba(3,3,3,.88) 0 .85%,transparent 1.14%),
    radial-gradient(ellipse at 27% 21%,rgba(3,3,3,.62) 0 .66%,transparent .94%),
    radial-gradient(ellipse at 48% 76%,rgba(3,3,3,.9) 0 1.05%,transparent 1.31%),
    radial-gradient(ellipse at 69% 33%,rgba(3,3,3,.82) 0 .9%,transparent 1.18%),
    radial-gradient(ellipse at 88% 65%,rgba(3,3,3,.62) 0 .7%,transparent .98%),
    linear-gradient(180deg,#8E1930 0%,#8E1930 43%,#8E1930 68%,#8E1930 100%)!important;
  background-size:
    73px 59px,
    121px 71px,
    100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,
    100% 100%!important;
  background-position:
    -3px 6px,
    21px -4px,
    0 0,0 0,0 0,0 0,0 0,
    0 0!important;
  filter:drop-shadow(0 0 28px rgba(142,25,48,.24)) contrast(1.04)!important;
}

/* Subtle secondary abrasion line across the word, deliberately not animated. */
.hero-v2 .hero-brand{
  text-shadow:
    0 1px 0 rgba(255,255,255,.045),
    0 28px 42px rgba(0,0,0,.32);
}

@media(max-width:900px){
  .hero-v2 .hero-brand .hero-brand-white{
    background-size:61px 49px,89px 63px,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%!important;
  }
  .hero-v2 .hero-brand .hero-brand-red{
    background-size:57px 47px,93px 59px,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%!important;
  }
}

@media(max-width:540px){
  /* Preserve the distressed identity on mobile without turning small letterforms into noise. */
  .hero-v2 .hero-brand .hero-brand-white,
  .hero-v2 .hero-brand .hero-brand-red{
    background-blend-mode:normal;
  }
}

/* DNPROD Phase 3 — information architecture + portfolio hierarchy
   Stacked preview branch. Hero V6 remains untouched. */

/* Remove legacy sections that the master plan explicitly rejects. */
.stats-strip,
.stack-section{display:none!important;}
.srv-price{display:none!important;}

/* Give each section a different rhythm instead of repeating card grids. */
.portfolio{padding:clamp(88px,9vw,150px) 2rem!important;background:#050505!important;}
.portfolio .max{max-width:1380px!important;}
.portfolio .sec-label{margin-bottom:18px!important;}
.portfolio .sec-title{font-size:clamp(54px,7vw,118px)!important;max-width:900px;}

.port-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr)!important;
  gap:clamp(18px,2vw,30px)!important;
  margin-top:clamp(42px,5vw,74px)!important;
  background:transparent!important;
}

.port-card{
  border:1px solid rgba(255,255,255,.1)!important;
  background:#080808!important;
  overflow:hidden!important;
}
.port-card:hover{background:#0b0b0b!important;}

/* Flagship — AurumTrade */
.port-card:nth-child(1){
  grid-column:1 / -1!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(360px,.75fr)!important;
  min-height:clamp(470px,45vw,690px);
  position:relative;
  border-color:rgba(255,255,255,.16)!important;
}
.port-card:nth-child(1)::before{
  content:'FLAGSHIP / PRODUCT ENGINEERING';
  position:absolute;
  top:18px;
  right:22px;
  z-index:5;
  color:rgba(255,255,255,.38);
  font-size:8px;
  letter-spacing:.3em;
}
.port-card:nth-child(1) .port-img{
  aspect-ratio:auto!important;
  height:100%!important;
  min-height:460px;
  padding:0!important;
  background:#060608!important;
}
.port-card:nth-child(1) .port-img img{
  object-fit:cover!important;
  object-position:center top!important;
  border-radius:0!important;
  transform:scale(1.035);
}
.port-card:nth-child(1) .port-info{
  padding:clamp(34px,4vw,64px)!important;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background:
    radial-gradient(circle at 100% 0,rgba(142,25,48,.12),transparent 38%),
    #090909;
}
.port-card:nth-child(1) .port-name{font-size:clamp(48px,5vw,82px)!important;line-height:.9!important;}
.port-card:nth-child(1) .port-desc{font-size:clamp(15px,1.25vw,18px)!important;max-width:540px;color:rgba(255,255,255,.68)!important;}

/* WLFF — engineering/event-commerce case */
.port-card:nth-child(2){
  grid-column:1;
  min-height:520px;
}
.port-card:nth-child(2) .port-img{aspect-ratio:16/10!important;padding:0!important;}
.port-card:nth-child(2) .port-img img{object-fit:cover!important;border-radius:0!important;}
.port-card:nth-child(2) .port-info{padding:28px 28px 32px!important;}
.port-card:nth-child(2) .port-name{font-size:clamp(34px,3vw,50px)!important;}

/* Third selected case is intentionally compact. */
.port-card:nth-child(3){
  grid-column:2;
  min-height:520px;
  display:flex!important;
  flex-direction:column;
}
.port-card:nth-child(3) .port-img{aspect-ratio:4/3!important;padding:0!important;}
.port-card:nth-child(3) .port-img img{object-fit:cover!important;border-radius:0!important;}
.port-card:nth-child(3) .port-info{padding:24px!important;flex:1;}
.port-card:nth-child(3) .port-name{font-size:clamp(30px,2.6vw,42px)!important;}

/* Fourth legacy card is removed from Selected Work. */
.port-card:nth-child(n+4){display:none!important;}

.port-tag{color:#8E1930!important;}
.port-link{color:rgba(255,255,255,.65)!important;}
.port-link:hover{color:#fff!important;}

/* Founder-led bridge: changes rhythm between Work and Services. */
.ia-founder-strip{
  position:relative;
  overflow:hidden;
  padding:clamp(62px,7vw,100px) 2rem;
  background:#0a0a0a;
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.ia-founder-strip::after{
  content:'DNPROD';
  position:absolute;
  right:-.04em;
  top:50%;
  transform:translateY(-50%);
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(130px,20vw,350px);
  line-height:.8;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.045);
  white-space:nowrap;
  pointer-events:none;
}
.ia-founder-inner{max-width:1200px;margin:0 auto;position:relative;z-index:2;display:grid;grid-template-columns:.55fr 1.45fr;gap:clamp(40px,7vw,110px);align-items:start;}
.ia-founder-kicker{font-size:10px;letter-spacing:.3em;color:#8E1930;text-transform:uppercase;}
.ia-founder-copy{font-family:'Bebas Neue',sans-serif;font-size:clamp(42px,5vw,78px);line-height:.98;max-width:900px;}
.ia-founder-copy em{color:#8E1930;font-style:normal;}
.ia-founder-meta{margin-top:24px;display:flex;gap:16px 28px;flex-wrap:wrap;color:rgba(255,255,255,.46);font-size:10px;letter-spacing:.15em;text-transform:uppercase;}

/* Services: outcome-first, less card-like. */
.services{padding:clamp(90px,9vw,145px) 2rem!important;background:#050505!important;border-top:0!important;}
.services .max{max-width:1280px!important;}
.services .sec-title{font-size:clamp(52px,6vw,96px)!important;}
.srv-grid{grid-template-columns:1fr!important;gap:0!important;background:transparent!important;border-top:1px solid rgba(255,255,255,.14);margin-top:54px!important;}
.srv-card{
  display:grid!important;
  grid-template-columns:90px minmax(220px,.55fr) minmax(0,1.45fr)!important;
  gap:22px!important;
  align-items:start!important;
  padding:30px 0!important;
  border-bottom:1px solid rgba(255,255,255,.1)!important;
  background:transparent!important;
}
.srv-card:hover{background:transparent!important;}
.srv-icon{display:none!important;}
.srv-num{grid-column:1;color:#8E1930!important;margin:7px 0 0!important;}
.srv-title{grid-column:2;font-size:clamp(28px,3vw,44px)!important;margin:0!important;}
.srv-desc{grid-column:3;font-size:15px!important;max-width:670px!important;color:rgba(255,255,255,.62)!important;margin-top:5px;}

/* About + process keep their content, but section cadence becomes more deliberate. */
.process{background:#0a0a0a!important;padding-top:clamp(90px,9vw,140px)!important;padding-bottom:clamp(90px,9vw,140px)!important;}
.about{background:#050505!important;padding-top:clamp(90px,9vw,140px)!important;padding-bottom:clamp(90px,9vw,140px)!important;}
.contact{padding-top:clamp(95px,10vw,160px)!important;}

@media(max-width:900px){
  .port-grid{grid-template-columns:1fr!important;}
  .port-card:nth-child(1){grid-column:1!important;grid-template-columns:1fr!important;min-height:0;}
  .port-card:nth-child(1) .port-img{min-height:0;aspect-ratio:16/10!important;}
  .port-card:nth-child(2),.port-card:nth-child(3){grid-column:1!important;min-height:0;}
  .ia-founder-inner{grid-template-columns:1fr!important;gap:22px;}
  .srv-card{grid-template-columns:58px 1fr!important;gap:12px 18px!important;}
  .srv-num{grid-column:1;grid-row:1 / span 2;}
  .srv-title{grid-column:2;}
  .srv-desc{grid-column:2;}
}

@media(max-width:540px){
  .portfolio{padding:76px 20px!important;}
  .port-grid{margin-top:34px!important;}
  .port-card:nth-child(1) .port-info{padding:26px 20px 28px!important;}
  .port-card:nth-child(1)::before{display:none;}
  .ia-founder-strip{padding:58px 20px;}
  .ia-founder-copy{font-size:42px;}
  .services{padding:76px 20px!important;}
  .srv-card{grid-template-columns:42px 1fr!important;padding:24px 0!important;}
  .srv-title{font-size:30px!important;}
  .srv-desc{font-size:14px!important;}
}


/* Mobile reskin compatibility: keep legacy runtime accents out of mobile. */
@media(max-width:900px){
  .port-tag,.ia-founder-kicker,.ia-founder-copy em,.srv-num{color:#8E1930!important;}
}

/* DNPROD Phase 4–5 — case-study depth + positioning polish.
   Stacked on Phase 3. Hero V6 remains untouched. */

.case-study-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  margin-top:28px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.09);
}
.case-study-cell{
  background:#080808;
  padding:20px 22px 22px;
  min-height:132px;
}
.case-study-label{
  margin:0 0 9px;
  font-size:9px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:#8E1930;
}
.case-study-value{
  margin:0;
  color:rgba(255,255,255,.72);
  font-size:13px;
  line-height:1.65;
}
.case-proof-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
}
.case-proof{
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.11);
  color:rgba(255,255,255,.48);
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
  background:rgba(255,255,255,.015);
}
.port-card:nth-child(1) .case-proof:first-child{
  border-color:rgba(142,25,48,.48);
  color:#8E1930;
}
.port-card:nth-child(2){position:relative;}
.port-card:nth-child(2)::before{
  content:'CASE / 02';
  position:absolute;
  top:16px;
  right:18px;
  z-index:3;
  font-size:8px;
  letter-spacing:.25em;
  color:rgba(255,255,255,.34);
}
.port-card:nth-child(2) .case-study-grid{
  grid-template-columns:1fr;
  margin-top:22px;
}
.port-card:nth-child(2) .case-study-cell{
  min-height:auto;
  padding:16px 18px;
}
.port-card:nth-child(3) .case-study-grid{display:none;}
.port-card:nth-child(3)::after{
  content:'SELECTED WEB EXPERIENCE';
  display:block;
  margin:0 24px 24px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.08);
  color:rgba(255,255,255,.28);
  font-size:8px;
  letter-spacing:.2em;
}

/* Selected-work previews: preserve the full screenshots instead of cinematic cropping. */
.port-card:nth-child(2) .port-img,
.port-card:nth-child(3) .port-img{
  background:#070707!important;
  padding:14px!important;
}
.port-card:nth-child(2) .port-img img,
.port-card:nth-child(3) .port-img img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center top!important;
  transform:none!important;
  border-radius:2px!important;
}
.port-card:nth-child(2):hover .port-img img,
.port-card:nth-child(3):hover .port-img img{
  transform:none!important;
}

.positioning-manifesto{
  position:relative;
  overflow:hidden;
  padding:clamp(78px,8vw,132px) 2rem;
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 78% 18%,rgba(142,25,48,.12),transparent 34%),
    linear-gradient(180deg,#070707,#0a0a0a);
}
.positioning-manifesto::before{
  content:'BUILD / SHIP / SUPPORT';
  position:absolute;
  right:2rem;
  top:24px;
  color:rgba(255,255,255,.16);
  font-size:8px;
  letter-spacing:.34em;
}
.positioning-inner{
  max-width:1240px;
  margin:0 auto;
  display:grid;
  grid-template-columns:.5fr 1.5fr;
  gap:clamp(36px,7vw,112px);
  align-items:start;
}
.positioning-kicker{
  color:#8E1930;
  font-size:10px;
  letter-spacing:.3em;
  text-transform:uppercase;
}
.positioning-copy{
  margin:0;
  max-width:980px;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(48px,6vw,100px);
  line-height:.92;
  letter-spacing:.005em;
}
.positioning-copy em{color:#8E1930;font-style:normal;}
.positioning-sub{
  max-width:760px;
  margin-top:24px;
  color:rgba(255,255,255,.55);
  font-size:14px;
  line-height:1.75;
}

.about-proof{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  margin-top:30px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
}
.about-proof-item{
  background:#070707;
  padding:18px;
  min-height:132px;
}
.about-proof-num{
  color:#8E1930;
  font-size:9px;
  letter-spacing:.2em;
  margin-bottom:12px;
}
.about-proof-text{
  color:rgba(255,255,255,.62);
  font-size:13px;
  line-height:1.65;
}

/* Editorial process rows. The legacy parent was still a 4-column grid, which
   squeezed each internally gridded step into a quarter-width column. */
.process-steps{
  display:block!important;
  width:100%;
  background:transparent!important;
  gap:0!important;
  border-top:1px solid rgba(255,255,255,.12);
}
.process-steps .step{
  width:100%;
  background:transparent!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  padding:28px 0!important;
  display:grid!important;
  grid-template-columns:90px minmax(190px,.45fr) minmax(0,1fr)!important;
  gap:20px!important;
  align-items:start!important;
}
.process-steps .step-num{grid-column:1;margin:4px 0 0!important;color:#8E1930!important;}
.process-steps .step-title{grid-column:2;font-size:clamp(26px,2.4vw,38px)!important;margin:0!important;}
.process-steps .step-desc{grid-column:3;max-width:650px!important;margin:4px 0 0!important;color:rgba(255,255,255,.58)!important;}

@media(max-width:900px){
  .case-study-grid{grid-template-columns:1fr;}
  .positioning-inner{grid-template-columns:1fr;gap:22px;}
  .about-proof{grid-template-columns:1fr;}
  .process-steps .step{grid-template-columns:56px 1fr!important;}
  .process-steps .step-num{grid-column:1;grid-row:1 / span 2;}
  .process-steps .step-title{grid-column:2;}
  .process-steps .step-desc{grid-column:2;}
}
@media(max-width:540px){
  .case-study-cell{padding:17px 16px;min-height:auto;}
  .port-card:nth-child(2) .port-img,
  .port-card:nth-child(3) .port-img{padding:10px!important;}
  .positioning-manifesto{padding:64px 20px;}
  .positioning-copy{font-size:48px;}
  .about-proof-item{padding:16px;}
  .process-steps .step{grid-template-columns:40px 1fr!important;padding:22px 0!important;gap:12px!important;}
}


/* Mobile reskin compatibility: runtime stylesheet loads after the core bundle. */
@media(max-width:900px){
  .about-proof{
    gap:12px!important;
    background:transparent!important;
    border:0!important;
  }
  .about-proof-item{
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.07),transparent 42%),
      linear-gradient(180deg,rgba(25,25,27,.76),rgba(9,9,10,.82))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 30px rgba(0,0,0,.20)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }
  .about-proof-num,
  .process-steps .step-num,
  .positioning-copy em{color:#8E1930!important;}
}


/* AurumTrade flagship compaction: keep all case-study content, move depth below the hero split. */
#portfolio .port-card--aurumtrade .aurum-case-details{
  grid-column:1 / -1!important;
  padding:18px clamp(22px,3vw,46px) 8px!important;
  background:
    radial-gradient(70% 100% at 100% 0%,rgba(142,25,48,.055),transparent 58%),
    linear-gradient(180deg,#080808,#070707)!important;
}
#portfolio .port-card--aurumtrade .aurum-case-details .case-study-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
}
#portfolio .port-card--aurumtrade .aurum-case-details .case-study-cell{
  min-height:118px!important;
  padding:16px 17px 17px!important;
  border:1px solid rgba(242,241,237,.095)!important;
  border-radius:14px!important;
  background:
    radial-gradient(110% 90% at 12% 0%,rgba(255,255,255,.042),transparent 44%),
    linear-gradient(180deg,rgba(16,16,18,.92),rgba(8,8,9,.96))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
#portfolio .port-card--aurumtrade .aurum-case-details .case-study-label{
  margin-bottom:8px!important;
  color:#8E1930!important;
}
#portfolio .port-card--aurumtrade .aurum-case-details .case-study-value{
  font-size:11px!important;
  line-height:1.58!important;
  color:rgba(242,241,237,.67)!important;
}
#portfolio .port-card--aurumtrade .aurum-case-details .case-proof-row{
  margin-top:10px!important;
  gap:7px!important;
}
#portfolio .port-card--aurumtrade .aurum-case-details .case-proof{
  min-height:28px!important;
  padding:6px 9px!important;
  border-radius:9px!important;
  border-color:rgba(242,241,237,.10)!important;
  color:rgba(242,241,237,.52)!important;
  font-size:8px!important;
}
#portfolio .port-card--aurumtrade .aurum-case-details .case-proof:first-child{
  border-color:rgba(142,25,48,.42)!important;
  color:#8E1930!important;
}
@media(max-width:900px){
  #portfolio .port-card--aurumtrade .aurum-case-details{
    padding:12px 16px 4px!important;
    background:#09090a!important;
  }
  #portfolio .port-card--aurumtrade .aurum-case-details .case-study-grid{
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
  }
  #portfolio .port-card--aurumtrade .aurum-case-details .case-study-cell{
    min-height:0!important;
    padding:15px!important;
    border-radius:16px!important;
  }
  #portfolio .port-card--aurumtrade .aurum-case-details .case-proof-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  #portfolio .port-card--aurumtrade .aurum-case-details .case-proof{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    min-height:36px!important;
  }
  #portfolio .port-card--aurumtrade .aurum-case-details .case-proof:last-child{
    grid-column:1 / -1!important;
  }
}
@media(max-width:560px){
  #portfolio .port-card--aurumtrade .aurum-case-details{padding:10px 14px 2px!important;}
  #portfolio .port-card--aurumtrade .aurum-case-details .case-study-grid{grid-template-columns:1fr!important;}
}

/* DNPROD Phase 7 — render-cost reductions that preserve the approved visuals. */

/* Below-fold sections keep their layout box while the browser skips offscreen paint/layout work. */
.perf-deferred-section{
  content-visibility:auto;
  contain-intrinsic-size:auto 900px;
}

/* Reserve stable media areas and avoid accidental layout jumps while optimized assets decode. */
.port-img,
.feature-visual{
  contain:layout paint;
}

.port-img img,
.feature-visual img{
  backface-visibility:hidden;
}

@media(max-width:900px){
  .perf-deferred-section{contain-intrinsic-size:auto 760px;}
}

/* DNPROD Phase 9 — contact form accessibility / privacy states. */

.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

.form-honeypot{
  position:absolute!important;
  left:-10000px!important;
  top:auto!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

.form input[aria-invalid="true"],
.form textarea[aria-invalid="true"]{
  border-color:var(--red)!important;
  box-shadow:0 0 0 1px rgba(142,25,48,.18);
}

.form input:focus-visible,
.form select:focus-visible,
.form textarea:focus-visible,
.form button:focus-visible{
  outline:2px solid rgba(142,25,48,.85);
  outline-offset:3px;
}

.form .form-privacy{
  margin-top:10px;
  max-width:560px;
  color:rgba(255,255,255,.42);
  font-size:11px;
  line-height:1.6;
}

.form #form-msg{
  min-height:20px;
  line-height:1.5;
}

.form #form-msg[data-state="success"]{color:#b9d8bf!important;}
.form #form-msg[data-state="error"]{color:#ff6375!important;}
.form #form-msg[data-state="loading"]{color:rgba(255,255,255,.62)!important;}

.form .btn-red:disabled{
  cursor:wait;
  opacity:.58;
}

@media(max-width:540px){
  .form .form-privacy{font-size:10px;line-height:1.55;}
}


/* Mobile reskin compatibility for late-loaded contact runtime. */
@media(max-width:900px){
  .contact-row i,.contact-icon,.contact-info i,.contact-links i,.contact-meta i,.contact-details i{
    color:#8E1930!important;
    -webkit-text-fill-color:#8E1930!important;
    opacity:.82!important;
    filter:saturate(.72) brightness(.86)!important;
    text-shadow:none!important;
  }
}


@media(max-width:900px){
  body .about-photo-label{padding-right:88px!important;}
  body .about-photo-label::after{
    content:''!important;
    display:block!important;
    position:absolute!important;
    right:18px!important;
    top:50%!important;
    width:58px!important;
    height:30px!important;
    transform:translateY(-50%)!important;
    border:0!important;
    background:url('/images/brand/dnprod-wordmark.png') center/contain no-repeat!important;
    filter:brightness(0) invert(1)!important;
    opacity:.94!important;
  }
}

/* DNPROD Phase 10 — accessibility states without changing approved composition. */

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 10000;
  padding: 10px 14px;
  background: #f0f0f0;
  color: #0a0a0a;
  border: 1px solid #f0f0f0;
  font: 600 13px/1.2 'Inter', sans-serif;
  letter-spacing: 0.02em;
  text-decoration: none;
  transform: translateY(-180%);
  transition: transform 0.15s ease;
}

.skip-link:focus,
.skip-link:focus-visible {
  transform: translateY(0);
  outline: 3px solid #8E1930;
  outline-offset: 2px;
}

/* Visible keyboard focus must work on dark, graphite and red surfaces. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid #f0f0f0;
  outline-offset: 3px;
}

.btn-red:focus-visible,
.nav-cta:focus-visible {
  outline-color: #ffffff;
  box-shadow: 0 0 0 2px #0a0a0a;
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  border-color: #f0f0f0 !important;
}

/* Keep hash navigation clear of the fixed 60px navigation bar. */
#home,
#portfolio,
#services,
#about,
#contact {
  scroll-margin-top: 82px;
}

/* Give the compact navigation controls reliable touch targets. */
.lang-current,
.burger {
  min-width: 44px;
  min-height: 44px;
}

.burger {
  align-items: center;
  justify-content: center;
}

.lang-opt {
  min-height: 44px;
}

/* Prevent hidden navigation from being exposed as an accidental focus target. */
.mobile-menu[aria-hidden="true"],
.lang-dropdown[aria-hidden="true"] {
  visibility: hidden;
}

.mobile-menu.open[aria-hidden="false"],
.lang-toggle.open .lang-dropdown[aria-hidden="false"] {
  visibility: visible;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;
  }

  .skip-link {
    transition: none !important;
  }
}

/* DNPROD Phase 12 — owner-requested visual polish.
   Narrow overrides only; no layout redesign. */

/* Desktop project links must read as deliberate CTAs, not disappear into metadata. */
@media (min-width:901px){
  #portfolio .port-link{
    display:inline-flex!important;
    align-items:center!important;
    align-self:flex-start!important;
    visibility:visible!important;
    opacity:1!important;
    margin-top:20px!important;
    padding:9px 0 8px!important;
    color:rgba(255,255,255,.92)!important;
    border-bottom:1px solid rgba(142,25,48,.7)!important;
    font-size:11px!important;
    font-weight:500!important;
    letter-spacing:.15em!important;
    text-transform:uppercase!important;
  }
  #portfolio .port-link:hover{
    color:#fff!important;
    border-bottom-color:#8E1930!important;
  }
}

/* AurumTrade owns its green identity only inside AurumTrade surfaces. */
.hero-v2 .feature-project-label{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.hero-v2 .aurum-brand-icon{
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:block;
  object-fit:cover;
  border-radius:7px;
  box-shadow:0 7px 18px rgba(0,0,0,.32),0 0 0 1px rgba(122,199,142,.18);
}
#portfolio .port-card:nth-child(1) .aurum-case-identity{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 18px;
  position:relative;
  z-index:2;
}
#portfolio .port-card:nth-child(1) .aurum-case-mark{
  width:58px;
  height:58px;
  flex:0 0 58px;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 8px 18px rgba(26,122,53,.18));
}
#portfolio .port-card:nth-child(1) .aurum-case-identity span{
  color:rgba(122,199,142,.78);
  font-size:9px;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
}

/* Flagship screenshot: do not soften the source with an extra CSS zoom. */
#portfolio .port-card:nth-child(1) .port-img img{
  transform:none!important;
  filter:none!important;
  image-rendering:auto;
}
#portfolio .port-card:nth-child(1):hover .port-img img{
  transform:none!important;
}

/* Founder portrait gets a DNPROD lower-third instead of a generic photo caption. */
.about-photo-wrap{
  position:relative;
  isolation:isolate;
}
.about-photo-wrap::before{
  content:'';
  position:absolute;
  inset:-10px 10px 10px -10px;
  border-top:1px solid rgba(142,25,48,.65);
  border-left:1px solid rgba(142,25,48,.65);
  z-index:0;
  pointer-events:none;
}
.about-photo{
  position:relative;
  z-index:1;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.26);
}
.about-photo-label{
  left:14px!important;
  right:14px!important;
  bottom:14px!important;
  z-index:3;
  padding:16px 70px 15px 18px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-left:2px solid #8E1930!important;
  background:linear-gradient(100deg,rgba(5,5,5,.96),rgba(13,13,13,.88))!important;
  box-shadow:0 18px 44px rgba(0,0,0,.36);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.about-photo-label::before{
  content:'DNPROD / FOUNDER';
  display:block;
  margin-bottom:5px;
  color:#8E1930;
  font-size:8px;
  font-weight:600;
  line-height:1;
  letter-spacing:.24em;
}
.about-photo-label::after{
  content:'DN';
  position:absolute;
  right:16px;
  top:50%;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border:1px solid #8E1930;
  color:#8E1930;
  font-size:10px;
  font-weight:600;
  letter-spacing:-.02em;
}
.about-photo-label strong{
  font-family:'Bebas Neue',sans-serif;
  color:#fff!important;
  font-size:24px!important;
  font-weight:400!important;
  line-height:1!important;
  letter-spacing:.04em;
  margin-bottom:5px!important;
}
.about-photo-label p{
  color:rgba(255,255,255,.58)!important;
  font-size:9px!important;
  line-height:1.2;
  letter-spacing:.16em!important;
  text-transform:uppercase;
}

/* Phase 9 replaces the observed reveal DIV with a semantic FORM. Keep the
   replacement visibly present even if an older observer no longer owns it. */
.contact #contact-form.reveal{
  opacity:1!important;
  transform:none!important;
}
.contact #contact-form{
  position:relative;
  padding:clamp(22px,2.8vw,34px);
  border:1px solid rgba(255,255,255,.11);
  background:
    linear-gradient(180deg,rgba(255,255,255,.025),transparent 42%),
    #080808;
}
.contact #contact-form::before{
  content:'PROJECT INQUIRY / DNPROD';
  display:block;
  margin-bottom:8px;
  color:rgba(255,255,255,.32);
  font-size:8px;
  letter-spacing:.24em;
}

/* Give the kicker more air above the large DNPROD wordmark. */
.hero-v2 .hero-kicker{
  margin-bottom:30px!important;
  position:relative;
  top:-4px;
}

/* Distressed wordmark — retain the physical texture, but at ~20% of V6 intensity. */
.hero-v2 .hero-brand .hero-brand-white{
  background-image:
    repeating-linear-gradient(101deg,
      transparent 0 22px,
      rgba(4,4,4,.14) 22.5px 23.2px,
      transparent 23.7px 58px,
      rgba(4,4,4,.07) 58.4px 59px,
      transparent 59.5px 86px),
    repeating-linear-gradient(176deg,
      transparent 0 36px,
      rgba(4,4,4,.10) 36.4px 37px,
      transparent 37.5px 82px),
    radial-gradient(ellipse at 18% 31%,rgba(4,4,4,.16) 0 .6%,transparent .86%),
    radial-gradient(ellipse at 66% 24%,rgba(4,4,4,.12) 0 .48%,transparent .72%),
    radial-gradient(ellipse at 84% 64%,rgba(4,4,4,.15) 0 .58%,transparent .84%),
    linear-gradient(180deg,#fff 0%,#fff 35%,#d7d7d7 68%,#8f8f8f 100%)!important;
  background-size:131px 91px,173px 113px,100% 100%,100% 100%,100% 100%,100% 100%!important;
  background-position:7px 4px,-17px 11px,0 0,0 0,0 0,0 0!important;
}

.hero-v2 .hero-brand .hero-brand-red{
  background-image:
    repeating-linear-gradient(107deg,
      transparent 0 20px,
      rgba(3,3,3,.16) 20.4px 21.1px,
      transparent 21.6px 54px,
      rgba(3,3,3,.08) 54.4px 55px,
      transparent 55.5px 84px),
    repeating-linear-gradient(182deg,
      transparent 0 34px,
      rgba(3,3,3,.11) 34.4px 35px,
      transparent 35.5px 78px),
    radial-gradient(ellipse at 14% 59%,rgba(3,3,3,.15) 0 .52%,transparent .78%),
    radial-gradient(ellipse at 50% 75%,rgba(3,3,3,.16) 0 .58%,transparent .84%),
    radial-gradient(ellipse at 83% 34%,rgba(3,3,3,.12) 0 .48%,transparent .72%),
    linear-gradient(180deg,#8E1930 0%,#8E1930 43%,#8E1930 68%,#8E1930 100%)!important;
  background-size:127px 87px,181px 107px,100% 100%,100% 100%,100% 100%,100% 100%!important;
  background-position:-3px 6px,21px -4px,0 0,0 0,0 0,0 0!important;
}

@media(max-width:540px){
  .hero-v2 .hero-kicker{
    margin-bottom:24px!important;
    top:-2px;
  }
  .hero-v2 .aurum-brand-icon{
    width:24px;
    height:24px;
    flex-basis:24px;
    border-radius:6px;
  }
  #portfolio .port-card:nth-child(1) .aurum-case-mark{
    width:48px;
    height:48px;
    flex-basis:48px;
  }
  #portfolio .port-card:nth-child(1) .aurum-case-identity{
    margin-bottom:14px;
  }
  .about-photo-label{
    left:10px!important;
    right:10px!important;
    bottom:10px!important;
    padding:14px 60px 13px 15px!important;
  }
  .about-photo-label strong{font-size:21px!important;}
  .about-photo-label::after{right:13px;width:32px;height:32px;}
  .contact #contact-form{padding:20px 16px;}
}

/* DNPROD Phase 12.1 — owner-approved visual cleanup + LCP polish.
   Narrow overrides only: no redesign, no content expansion. */

/* The portfolio identity mark used a wide/transparent artwork that reads like
   visual noise at small size. Use the compact owned AurumTrade icon instead. */
#portfolio .port-card:nth-child(1) .aurum-case-mark{
  display:none!important;
}
#portfolio .port-card:nth-child(1) .aurum-case-identity::before{
  content:'';
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:block;
  border-radius:12px;
  border:1px solid rgba(142,25,48,.32);
  background:#07110b url('/images/aurumtrade-brand-icon.webp') center/cover no-repeat;
  box-shadow:0 8px 22px rgba(0,0,0,.34),0 0 18px rgba(142,25,48,.12);
}

/* Founder lower-third already says DNPROD / FOUNDER. Do not repeat the role. */
.about-photo-label p{
  display:none!important;
}
.about-photo-label strong{
  margin-bottom:0!important;
}
.about-photo-label{
  padding-top:16px!important;
  padding-bottom:15px!important;
}

/* The critical Hero is now present in generated HTML. Do not hide the two
   largest first-paint candidates behind entrance blur/opacity animations. */
.hero-v2[data-dnprod-critical-hero] .hero-brand,
.hero-v2[data-dnprod-critical-hero] .feature-shell{
  animation:none!important;
  opacity:1!important;
}

@media(max-width:540px){
  #portfolio .port-card:nth-child(1) .aurum-case-identity::before{
    width:48px;
    height:48px;
    flex-basis:48px;
    border-radius:10px;
  }
}

/* DNPROD Hero color rebalance — restore the black/white identity while
   keeping red as a restrained atmospheric and conversion accent. */
.hero-scene{
  background:
    radial-gradient(ellipse at 78% 38%,rgba(142,25,48,.13) 0,rgba(142,25,48,.045) 27%,transparent 54%),
    radial-gradient(ellipse at 43% 76%,rgba(142,25,48,.045),transparent 42%),
    linear-gradient(112deg,#030303 0%,#050505 48%,#080405 100%)!important;
}

.hero-scene::before,
.hero.hero-v2::after,
.hero-v2 .hero-content::after,
.hero-v2 .hero-brand::before,
.hero-v2 .hero-brand::after,
.hero-v2 .hero-proofline span::before,
.hero-v2 .hero-feature::before,
.hero-v2 .hero-feature::after,
.hero-v2 .feature-shell::after,
.hero-v2 .feature-visual::before,
.hero-v2 .feature-copy::before,
.hero-v2 .feature-copy::after,
.hero-v2 .hero-feature .feature-topline::before,
.hero-v2 .hero-feature .project-green-rule::after{
  display:none!important;
}

.hero.hero-v2::before{
  text-shadow:none!important;
}

.hero-v2 .hero-kicker::before{
  content:""!important;
  display:inline-block!important;
  width:34px!important;
  height:1px!important;
  margin:0 13px 3px 0!important;
  background:#8E1930!important;
  box-shadow:0 0 12px rgba(142,25,48,.34)!important;
}

.hero-v2 .hero-proofline{
  gap:12px 18px!important;
}

.hero-v2 .hero-proofline::before{
  content:"";
  width:18px;
  height:1px;
  flex:0 0 18px;
  align-self:center;
  background:rgba(142,25,48,.88);
  box-shadow:0 0 10px rgba(142,25,48,.24);
}

/* Keep the restrained distressed treatment, but make PROD white. */
.hero-v2 .hero-brand .hero-brand-red{
  color:#fff!important;
  background-image:
    repeating-linear-gradient(107deg,
      transparent 0 20px,
      rgba(3,3,3,.16) 20.4px 21.1px,
      transparent 21.6px 54px,
      rgba(3,3,3,.08) 54.4px 55px,
      transparent 55.5px 84px),
    repeating-linear-gradient(182deg,
      transparent 0 34px,
      rgba(3,3,3,.11) 34.4px 35px,
      transparent 35.5px 78px),
    radial-gradient(ellipse at 14% 59%,rgba(3,3,3,.15) 0 .52%,transparent .78%),
    radial-gradient(ellipse at 50% 75%,rgba(3,3,3,.16) 0 .58%,transparent .84%),
    radial-gradient(ellipse at 83% 34%,rgba(3,3,3,.12) 0 .48%,transparent .72%),
    linear-gradient(180deg,#fff 0%,#fff 100%)!important;
  filter:none!important;
  text-shadow:none!important;
}

.hero-v2 .hero-brand::selection{
  background:#f0f0f0;
  color:#0a0a0a;
}

.hero-v2 .feature-shell{
  position:relative!important;
  overflow:visible!important;
  clip-path:none!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  transform:none!important;
}

.hero-v2 .feature-shell::before,
.hero-v2 .feature-shell::after,
.hero-v2 .feature-product-window::before,
.hero-v2 .feature-product-window::after{
  display:none!important;
}

.hero-v2 .feature-layout{
  display:grid;
  grid-template-columns:minmax(190px,35fr) minmax(0,65fr);
  gap:clamp(22px,2.2vw,38px);
  align-items:center;
}

.hero-v2 .feature-copy{
  position:relative!important;
  inset:auto!important;
  margin:0!important;
  padding:clamp(18px,2vw,30px) 0!important;
  transform:none!important;
  text-shadow:none!important;
  z-index:2;
}

.hero-v2 .feature-brand{
  font-size:clamp(34px,2.7vw,48px)!important;
  line-height:.95!important;
  letter-spacing:-.04em!important;
}

.hero-v2 .feature-title{
  max-width:250px!important;
  margin-top:14px!important;
  line-height:1.5!important;
  color:rgba(255,255,255,.62)!important;
}

.hero-v2 .feature-link{
  margin-top:18px!important;
}

.hero-v2 .feature-product-window{
  position:relative!important;
  width:100%!important;
  margin:0!important;
  padding:7px!important;
  aspect-ratio:970/820!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,#101311 0%,#070908 72%)!important;
  box-shadow:
    0 34px 78px rgba(0,0,0,.62),
    0 0 0 1px rgba(255,255,255,.025),
    0 0 48px rgba(25,122,53,.09)!important;
  isolation:isolate;
  contain:layout paint;
}

.hero-v2 .feature-product-window__viewport{
  width:100%;
  height:100%;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.055);
  border-radius:12px;
  background:#050606;
}

.hero-v2 .feature-product-window img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
  filter:none!important;
  image-rendering:auto;
  backface-visibility:visible!important;
}

/* Keep the legacy label, but anchor it to the AurumTrade case instead of the left proofline. */
.hero-v2 .hero-proofline::after{
  content:none!important;
  display:none!important;
}

.hero-v2 .feature-shell::before{
  content:"SELECTED CASE / 01"!important;
  display:block!important;
  position:absolute!important;
  top:-24px!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:max-content!important;
  transform:translateX(-50%)!important;
  color:rgba(255,255,255,.42)!important;
  font-family:'Inter',sans-serif!important;
  font-size:9px!important;
  font-weight:500!important;
  line-height:1!important;
  letter-spacing:.24em!important;
  text-transform:uppercase!important;
  pointer-events:none!important;
  z-index:3!important;
}

@media(min-width:901px){
  .hero-v2 .hero-feature{
    width:min(54vw,900px)!important;
    right:clamp(12px,2vw,40px)!important;
    transform:translateY(-48%)!important;
    filter:none!important;
    animation:none!important;
  }
}

.hero-service-num{
  color:rgba(255,255,255,.46)!important;
}

/* Use the owner's transparent DNPROD wordmark without increasing nav height. */
.logo{
  display:block!important;
  width:124px!important;
  height:36px!important;
  overflow:hidden;
  position:relative;
  flex:0 0 124px;
}

.logo img{
  position:absolute;
  width:150px;
  height:auto;
  max-width:none;
  left:-15px;
  top:-7px;
  display:block;
}

@media(max-width:900px){
  /* Burger-mode navbar: halve the visible wordmark while preserving a generous tap area. */
  .logo{
    width:62px!important;
    height:40px!important;
    flex-basis:62px!important;
  }
  .logo img{
    width:75px!important;
    left:-6.5px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
  }
  .hero-v2 .hero-feature{
    right:auto!important;
    width:min(100%,760px)!important;
    margin:38px 0 18px!important;
    transform:none!important;
    filter:none!important;
    animation:none!important;
  }
  .hero-v2 .feature-layout{
    grid-template-columns:minmax(180px,34fr) minmax(0,66fr);
    gap:24px;
  }
}

@media(max-width:640px){
  /* Owner decision: keep the mobile Hero focused on DNPROD only. */
  .hero-v2 .hero-feature{
    display:none!important;
  }
  .hero-v2 .feature-layout{
    grid-template-columns:1fr;
    gap:18px;
  }
  .hero-v2 .feature-copy{
    padding:0 4px 4px!important;
  }
  .hero-v2 .feature-title{
    max-width:none!important;
  }
  .hero-v2 .feature-product-window{
    padding:5px!important;
    border-radius:16px!important;
  }
  .hero-v2 .feature-product-window__viewport{
    border-radius:11px;
  }
}

@media(max-width:540px){
  .hero-v2 .hero-feature{
    width:100%!important;
    margin:34px 0 12px!important;
    transform:none!important;
    animation:none!important;
  }
  .hero-v2 .feature-brand{font-size:32px!important;}
  .logo{
    width:56px!important;
    height:40px!important;
    flex-basis:56px!important;
  }
  .logo img{
    width:70px!important;
    left:-7px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
  }
}




/* Use the same owner wordmark in the footer as in the navbar. */
.f-logo{
  display:block!important;
  width:124px!important;
  height:36px!important;
  overflow:hidden!important;
  position:relative!important;
  flex:0 0 124px!important;
  text-decoration:none!important;
}
.f-logo img{
  position:absolute!important;
  width:150px!important;
  height:auto!important;
  max-width:none!important;
  left:-15px!important;
  top:-7px!important;
  display:block!important;
}
@media(max-width:540px){
  .f-logo{
    width:112px!important;
    height:34px!important;
    flex-basis:112px!important;
  }
  .f-logo img{
    width:140px!important;
    left:-14px!important;
    top:-6px!important;
  }
}


/* Mobile-only composition pass: focused Hero, collapsible cases, snap process cards. */
#portfolio .port-picture{
  display:block;
  width:100%;
  height:100%;
}

@media(max-width:640px){
  /* Hide only the mobile service rail. Keep the approved glitch transition visible. */
  .hero-service-rail{
    display:none!important;
  }
  .hero-scene{
    min-height:0!important;
    height:auto!important;
  }
  .hero.hero-v2{
    min-height:0!important;
    height:auto!important;
    padding-bottom:36px!important;
  }
  /* Keep the large outlined DNPROD background visually centered in the mobile Hero. */
  .hero.hero-v2::before{
    top:50%!important;
    transform:translateY(-50%)!important;
  }
  .hero-v2 .hero-content{
    min-height:0!important;
    height:auto!important;
  }
  .portfolio{
    padding-top:44px!important;
  }


  /* Mobile Selected Work: art-directed preview stages, not raw full-page screenshots. */
  #portfolio .port-grid{
    gap:20px!important;
    background:transparent!important;
  }
  #portfolio .port-card{
    min-width:0!important;
    border-radius:0!important;
    border:1px solid rgba(255,255,255,.10)!important;
    background:#080808!important;
    box-shadow:0 20px 48px rgba(0,0,0,.30)!important;
  }

  /* Every project gets the same compact, art-directed visual stage. */
  #portfolio .port-card .port-img,
  #portfolio .port-card:nth-child(1) .port-img,
  #portfolio .port-card:nth-child(2) .port-img,
  #portfolio .port-card:nth-child(3) .port-img,
  #portfolio .port-card:nth-child(4) .port-img{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:1.72!important;
    padding:12px!important;
    overflow:hidden!important;
    border-radius:0!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    isolation:isolate;
    background:#050505!important;
  }

  #portfolio .port-card:nth-child(1) .port-img{
    background:
      radial-gradient(circle at 76% 20%,rgba(142,25,48,.12),transparent 48%),
      linear-gradient(145deg,#0d0b0c,#040404 68%)!important;
  }
  #portfolio .port-card:nth-child(2) .port-img{
    background:
      radial-gradient(circle at 18% 12%,rgba(203,160,54,.17),transparent 52%),
      linear-gradient(145deg,#101008,#040504 68%)!important;
  }
  #portfolio .port-card:nth-child(3) .port-img{
    background:
      radial-gradient(circle at 82% 18%,rgba(211,164,54,.16),transparent 50%),
      linear-gradient(145deg,#100d07,#040404 68%)!important;
  }

  /* The owner screenshots live in a framed mobile viewport at their natural ratio. */
  #portfolio .port-card:nth-child(-n+3) .port-picture{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.13)!important;
    border-radius:0!important;
    background:#020202!important;
    box-shadow:
      0 18px 44px rgba(0,0,0,.5),
      inset 0 1px 0 rgba(255,255,255,.05)!important;
  }
  /* iOS Safari can resolve a percentage-height picture from the stage's
     border box instead of its padded content box. Explicit insets preserve
     the approved frame and scale for all three approved previews. */
  #portfolio .port-card:nth-child(1) .port-picture,
  #portfolio .port-card:nth-child(2) .port-picture,
  #portfolio .port-card:nth-child(3) .port-picture{
    position:absolute!important;
    inset:12px!important;
    width:auto!important;
    height:auto!important;
    min-width:0!important;
    min-height:0!important;
    line-height:0!important;
  }
  #portfolio .port-card:nth-child(-n+3) .port-picture img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-width:none!important;
    object-fit:unset!important;
    object-position:unset!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    filter:none!important;
    transition:none!important;
    transform:none!important;
  }

  /* The unchanged fourth-case fallback keeps the established inset treatment. */
  #portfolio .port-card:nth-child(4) .port-img img{
    display:block!important;
    width:80%!important;
    height:auto!important;
    min-height:0!important;
    max-width:80%!important;
    object-fit:unset!important;
    object-position:unset!important;
    margin:0 auto!important;
    transform:none!important;
    border:1px solid rgba(255,255,255,.09)!important;
    border-radius:0!important;
    box-shadow:0 16px 38px rgba(0,0,0,.42)!important;
  }

  /* Legacy case labels do not compete with the screenshots on mobile. */
  #portfolio .port-card:nth-child(2)::before,
  #portfolio .port-card:nth-child(3)::after{
    display:none!important;
  }

  #portfolio .port-card .port-info,
  #portfolio .port-card:nth-child(1) .port-info,
  #portfolio .port-card:nth-child(2) .port-info,
  #portfolio .port-card:nth-child(3) .port-info,
  #portfolio .port-card:nth-child(4) .port-info{
    padding:22px 20px 22px!important;
  }
  #portfolio .port-card .port-tag{
    margin-bottom:10px!important;
    font-size:9px!important;
    letter-spacing:.18em!important;
  }
  #portfolio .port-card .port-name{
    margin-bottom:10px!important;
    font-size:clamp(30px,9vw,42px)!important;
    line-height:.98!important;
  }
  #portfolio .port-card .port-desc{
    font-size:14px!important;
    line-height:1.58!important;
  }
  #portfolio .port-card .port-link{
    margin-top:16px!important;
    padding:4px 0!important;
    font-size:12px!important;
  }

  /* Selected Work cards stay compact through the visible Live Site row. */
  #portfolio .port-card{
    border-radius:0!important;
    overflow:hidden!important;
  }
  #portfolio .port-card .port-img{
    overflow:hidden!important;
  }
  #portfolio .port-card .case-study-grid,
  #portfolio .port-card .case-proof-row{
    max-height:0!important;
    margin-top:0!important;
    opacity:0!important;
    overflow:hidden!important;
    transform:translateY(-6px);
    pointer-events:none;
    transition:
      max-height .48s cubic-bezier(.22,1,.36,1),
      margin-top .36s ease,
      opacity .24s ease,
      transform .36s ease;
  }
  #portfolio .port-card .case-study-grid{
    border-width:0!important;
  }
  #portfolio .port-card.is-expanded .case-study-grid{
    max-height:1400px!important;
    margin-top:24px!important;
    opacity:1!important;
    transform:none;
    pointer-events:auto;
    border-width:1px!important;
  }
  #portfolio .port-card.is-expanded .case-proof-row{
    max-height:320px!important;
    margin-top:18px!important;
    opacity:1!important;
    transform:none;
    pointer-events:auto;
  }
  #portfolio .port-card:nth-child(3)::after{
    display:none!important;
  }

  /* Four steps / Zero surprises: mobile horizontal snap cards. */
  .process{
    overflow:hidden;
  }
  .process-steps{
    display:flex!important;
    width:100%!important;
    gap:14px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:0;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    border-top:0!important;
    padding:4px 0 14px!important;
  }
  .process-steps::-webkit-scrollbar{
    display:none;
  }
  .process-steps .step{
    flex:0 0 min(78vw,340px)!important;
    width:auto!important;
    min-height:250px;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:0!important;
    padding:24px!important;
    border:1px solid rgba(255,255,255,.11)!important;
    border-radius:18px!important;
    background:
      radial-gradient(circle at 100% 0,rgba(142,25,48,.07),transparent 42%),
      #080808!important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
  .process-steps .step-num{
    margin:0 0 42px!important;
    color:#8E1930!important;
    font-size:10px!important;
    letter-spacing:.2em!important;
  }
  .process-steps .step-title{
    margin:0 0 14px!important;
    font-size:34px!important;
    line-height:1!important;
  }
  .process-steps .step-desc{
    margin:0!important;
    max-width:none!important;
    color:rgba(255,255,255,.58)!important;
    font-size:14px!important;
    line-height:1.65!important;
  }
}

/* Phase 13 retained for mobile only; desktop is locked to the 2026-10-04 08:00 baseline. */
@media (max-width: 900px){
/* DNPROD Phase 13 — Sharp Minimal Glass.
   Owner-approved direction: sharp geometry, restrained smoked glass, no hero color gradient. */

:root{
  --dn-radius:0px;
  --dn-glass-bg:rgba(10,10,10,.62);
  --dn-glass-bg-strong:rgba(8,8,8,.78);
  --dn-glass-border:rgba(255,255,255,.13);
  --dn-glass-edge:rgba(255,255,255,.16);
  --dn-glass-red:rgba(142,25,48,.18);
}

/* Hero: remove the previous animated red/violet gradient completely. */
.hero-scene{
  isolation:isolate;
  background:#030303!important;
}
.hero-scene::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  display:block!important;
  pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:96px 96px;
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 78%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 78%);
  opacity:.28;
}
.hero-scene::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:none!important;
  filter:none!important;
  transform:none!important;
  animation:none!important;
  opacity:0!important;
}
.hero-scene>.hero-v2,
.hero-scene>.hero-scroll,
.hero-scene>.hero-service-rail{z-index:2;}

/* One geometry system: visible UI surfaces use sharp corners. */
nav,
.mobile-menu,
.lang-current,
.lang-dropdown,
.nav-cta,
.btn-red,
.btn-ghost,
.form input,
.form textarea,
.form select,
.contact #contact-form,
.hero-v2 .feature-product-window,
.hero-v2 .feature-product-window__viewport,
.port-card,
.port-img,
.port-img img,
.stack-card,
.srv-card,
.process-steps .step,
.about-photo,
.about-photo-label,
.tag{
  border-radius:var(--dn-radius)!important;
}

/* Navigation: smoked architectural glass, not a floating pill. */
nav{
  top:0!important;
  left:0!important;
  right:0!important;
  height:64px!important;
  padding:0 clamp(20px,2vw,34px)!important;
  border:0!important;
  border-bottom:1px solid var(--dn-glass-border)!important;
  background:rgba(5,5,5,.70)!important;
  -webkit-backdrop-filter:blur(18px) saturate(112%)!important;
  backdrop-filter:blur(18px) saturate(112%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 14px 34px rgba(0,0,0,.22)!important;
}
nav::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:1px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,rgba(142,25,48,.52) 16%,rgba(255,255,255,.10) 48%,transparent 84%);
  opacity:.34;
}
nav::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,rgba(255,255,255,.035),transparent 28%,transparent 74%,rgba(142,25,48,.025));
  opacity:1;
}
.nav-links,.nav-right,.logo{position:relative;z-index:1}

/* Glass controls: precision edges, subtle depth, no rounded consumer-app language. */
.hero-v2 .btn-red,
.nav-cta,
.contact .btn-red{
  position:relative;
  overflow:hidden;
  color:#fff!important;
  border:1px solid rgba(142,25,48,.48)!important;
  background:
    linear-gradient(180deg,rgba(142,25,48,.17),rgba(142,25,48,.075)),
    rgba(10,10,10,.58)!important;
  -webkit-backdrop-filter:blur(14px) saturate(112%)!important;
  backdrop-filter:blur(14px) saturate(112%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(142,25,48,.13),
    0 10px 26px rgba(0,0,0,.20)!important;
}
.hero-v2 .btn-ghost,
.lang-current{
  border:1px solid var(--dn-glass-border)!important;
  background:rgba(255,255,255,.025)!important;
  -webkit-backdrop-filter:blur(12px) saturate(108%)!important;
  backdrop-filter:blur(12px) saturate(108%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055)!important;
}
.hero-v2 .btn-red:hover,
.nav-cta:hover,
.contact .btn-red:hover{
  transform:translateY(-1px);
  border-color:rgba(142,25,48,.78)!important;
  background:
    linear-gradient(180deg,rgba(142,25,48,.22),rgba(142,25,48,.09)),
    rgba(10,10,10,.66)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 12px 30px rgba(0,0,0,.24),
    0 0 22px rgba(142,25,48,.07)!important;
}
.hero-v2 .btn-ghost:hover,
.lang-current:hover{
  border-color:rgba(255,255,255,.24)!important;
  background:rgba(255,255,255,.04)!important;
}

/* Language dropdown follows the same smoked-glass plane. */
.lang-dropdown{
  margin-top:8px!important;
  border:1px solid var(--dn-glass-border)!important;
  background:rgba(6,6,6,.90)!important;
  -webkit-backdrop-filter:blur(18px) saturate(108%)!important;
  backdrop-filter:blur(18px) saturate(108%)!important;
  box-shadow:0 18px 40px rgba(0,0,0,.34)!important;
}

/* Contact: one deliberate panel with a consistent internal rhythm. */
.contact #contact-form{
  padding:clamp(26px,3vw,40px)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.025),transparent 32%),
    rgba(5,5,5,.72)!important;
  -webkit-backdrop-filter:blur(16px) saturate(108%)!important;
  backdrop-filter:blur(16px) saturate(108%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 30px 80px rgba(0,0,0,.22)!important;
}
.contact #contact-form::before{
  margin-bottom:24px!important;
  color:rgba(255,255,255,.36)!important;
}
.contact .form{
  gap:12px!important;
}
.contact .form input,
.contact .form textarea,
.contact .form select{
  min-height:50px;
  padding:14px 16px!important;
  border:1px solid rgba(255,255,255,.115)!important;
  background:rgba(255,255,255,.025)!important;
  color:rgba(255,255,255,.92)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    inset 0 -1px 0 rgba(0,0,0,.34)!important;
  transition:border-color .22s ease,background .22s ease,box-shadow .22s ease!important;
}
.contact .form textarea{
  min-height:118px;
}
.contact .form input::placeholder,
.contact .form textarea::placeholder{
  color:rgba(255,255,255,.28)!important;
}
.contact .form input:hover,
.contact .form textarea:hover,
.contact .form select:hover{
  border-color:rgba(255,255,255,.18)!important;
  background:rgba(255,255,255,.035)!important;
}
.contact .form input:focus,
.contact .form textarea:focus,
.contact .form select:focus,
.contact .form input:focus-visible,
.contact .form textarea:focus-visible,
.contact .form select:focus-visible{
  outline:none!important;
  border-color:rgba(142,25,48,.58)!important;
  background:rgba(255,255,255,.042)!important;
  box-shadow:
    inset 2px 0 0 rgba(142,25,48,.72),
    inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.contact .form .btn-red{
  min-height:50px;
  margin-top:2px!important;
  letter-spacing:.08em!important;
}
.contact .form .form-privacy{
  margin-top:10px!important;
  color:rgba(255,255,255,.38)!important;
}

/* Keep smaller utility surfaces from drifting back into rounded language. */
.hero-v2 .feature-product-window{
  border-color:rgba(255,255,255,.11)!important;
  box-shadow:
    0 30px 72px rgba(0,0,0,.58),
    0 0 0 1px rgba(255,255,255,.018)!important;
}
.process-steps .step{
  border-color:rgba(255,255,255,.10)!important;
}
.mobile-menu{
  top:64px!important;
  left:0!important;
  right:0!important;
  border:0!important;
  border-bottom:1px solid var(--dn-glass-border)!important;
  background:rgba(5,5,5,.92)!important;
  -webkit-backdrop-filter:blur(20px) saturate(108%)!important;
  backdrop-filter:blur(20px) saturate(108%)!important;
  box-shadow:0 20px 48px rgba(0,0,0,.34)!important;
}

@media(max-width:640px){
  nav{
    top:0!important;
    left:0!important;
    right:0!important;
    height:60px!important;
    padding:0 16px!important;
  }
  .mobile-menu{top:60px!important;}
  .contact #contact-form{padding:22px 16px!important;}
}

@media(prefers-reduced-motion:reduce){
  .hero-scene::before,
  .hero-scene::after{animation:none!important;transform:none!important;}
}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  nav,
  .mobile-menu,
  .hero-v2 .btn-red,
  .hero-v2 .btn-ghost,
  .nav-cta,
  .lang-current,
  .lang-dropdown,
  .contact .btn-red,
  .contact #contact-form{
    background:#090909!important;
  }
}


/* Approved follow-up only: visible living gradient, no red slash geometry, mobile language in burger. */
.hero-scene{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(ellipse at 78% 38%,rgba(120,0,18,.18),transparent 48%),
    radial-gradient(ellipse at 24% 72%,rgba(32,35,42,.20),transparent 44%),
    #030303!important;
  background-size:140% 140%,130% 130%,auto!important;
  animation:dnprodFallbackGradient 10s ease-in-out infinite alternate!important;
}
.dn-live-gradient{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  z-index:0;
  pointer-events:none;
  opacity:.92;
  filter:saturate(1.05) contrast(1.06);
}
.hero-scene::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  display:block!important;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 42%,transparent 0 48%,rgba(0,0,0,.14) 78%,rgba(0,0,0,.30) 100%)!important;
  background-size:auto!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
  opacity:1!important;
}
.hero-scene::after{
  content:none!important;
  display:none!important;
}
.hero-scene>#shatter,
.hero-scene>.hero-v2,
.hero-scene>.hero-scroll,
.hero-scene>.hero-service-rail{z-index:2;}

@keyframes dnprodFallbackGradient{
  0%{
    background-position:0% 30%,20% 70%,0 0;
  }
  50%{
    background-position:75% 45%,55% 35%,0 0;
  }
  100%{
    background-position:100% 60%,85% 20%,0 0;
  }
}

/* Remove decorative red Hero lines only. Do not alter wordmark colors/surfaces. */
.hero.hero-v2::after,
.hero-v2 .hero-content::before,
.hero-v2 .hero-content::after,
.hero-v2 .hero-brand::before,
.hero-v2 .hero-brand::after,
.hero-v2 .hero-feature::before,
.hero-v2 .hero-feature::after,
.hero-v2 .feature-shell::after,
.hero-v2 .feature-visual::before,
.hero-v2 .feature-copy::before,
.hero-v2 .feature-copy::after,
.hero-v2 .hero-feature .feature-topline::before,
.hero-v2 .hero-feature .project-green-rule::after{
  display:none!important;
  content:none!important;
}

/* Mobile language lives inside the burger menu. Desktop remains unchanged. */
.mobile-lang-switcher{display:none;}
@media(max-width:900px){
  nav .lang-toggle{display:none!important;}
  .mobile-lang-switcher{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-top:8px;
    padding:18px 0 2px;
    border-top:1px solid rgba(255,255,255,.10);
  }
  .mobile-lang-label{
    color:rgba(255,255,255,.34);
    font-size:9px;
    font-weight:500;
    letter-spacing:.24em;
  }
  .mobile-lang-options{
    display:flex;
    align-items:center;
    gap:4px;
  }
  .mobile-lang-opt{
    width:auto!important;
    min-width:42px;
    padding:8px 10px!important;
    border:0!important;
    border-bottom:1px solid transparent!important;
    background:transparent!important;
    color:rgba(255,255,255,.44)!important;
    text-align:center!important;
    font-size:11px!important;
    letter-spacing:.14em!important;
  }
  .mobile-lang-opt:hover{color:#fff!important;}
  .mobile-lang-opt.active{
    color:#fff!important;
    border-bottom-color:#8E1930!important;
  }
}
@media(max-width:640px){
  .dn-live-gradient{opacity:.88;}
}
@media(prefers-reduced-motion:reduce){
  .hero-scene{animation:none!important;}
  .dn-live-gradient{opacity:.78;}
}


/* Phase 13.1 — visible living gradient correction.
   Keep all approved Hero composition intact; only the background field changes. */
.hero-scene{
  background:#030303!important;
  animation:none!important;
}
.dn-live-gradient{
  opacity:.86!important;
  filter:saturate(1.08) contrast(1.08)!important;
  mix-blend-mode:screen;
}
.hero-scene::before{
  content:""!important;
  position:absolute!important;
  inset:-22%!important;
  z-index:1!important;
  display:block!important;
  pointer-events:none!important;
  opacity:.92!important;
  background:
    radial-gradient(ellipse 48% 44% at 72% 36%,rgba(142,25,48,.30) 0%,rgba(142,25,48,.14) 34%,transparent 72%),
    radial-gradient(ellipse 42% 38% at 48% 72%,rgba(92,18,42,.20) 0%,rgba(92,18,42,.08) 38%,transparent 72%),
    radial-gradient(ellipse 44% 42% at 24% 46%,rgba(66,72,84,.18) 0%,rgba(66,72,84,.07) 42%,transparent 76%)!important;
  filter:blur(42px) saturate(1.08)!important;
  transform:translate3d(-2%,-1%,0) scale(1.04)!important;
  animation:dnprodLivingField 9s cubic-bezier(.45,.05,.55,.95) infinite alternate!important;
  will-change:transform,background-position;
}
.hero-scene::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  display:block!important;
  pointer-events:none!important;
  opacity:1!important;
  background:
    radial-gradient(ellipse at 50% 46%,transparent 0 52%,rgba(0,0,0,.16) 82%,rgba(0,0,0,.34) 100%)!important;
}

@keyframes dnprodLivingField{
  0%{
    transform:translate3d(-4%,-2%,0) scale(1.04);
    background-position:0% 10%,20% 70%,0% 40%;
  }
  50%{
    transform:translate3d(4%,3%,0) scale(1.10);
    background-position:78% 36%,55% 34%,44% 58%;
  }
  100%{
    transform:translate3d(-1%,5%,0) scale(1.07);
    background-position:100% 64%,82% 14%,88% 38%;
  }
}

/* Preserve the two approved micro-accent rules.
   Only legacy decorative slash geometry is removed elsewhere. */
.hero-v2 .hero-kicker::before{
  content:""!important;
  display:inline-block!important;
  width:34px!important;
  height:1px!important;
  margin:0 13px 3px 0!important;
  background:#8E1930!important;
  box-shadow:0 0 12px rgba(142,25,48,.34)!important;
}
.hero-v2 .hero-proofline::before{
  content:""!important;
  display:block!important;
  width:18px!important;
  height:1px!important;
  flex:0 0 18px!important;
  align-self:center!important;
  background:rgba(142,25,48,.88)!important;
  box-shadow:0 0 10px rgba(142,25,48,.24)!important;
}
.hero-v2 .hero-proofline span::before{
  display:none!important;
  content:none!important;
}

@media(max-width:640px){
  .dn-live-gradient{opacity:.82!important;}
  .hero-scene::before{
    inset:-30%!important;
    opacity:.96!important;
    filter:blur(34px) saturate(1.1)!important;
    animation-duration:7.5s!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-scene::before{animation:none!important;transform:none!important;}
  .dn-live-gradient{opacity:.72!important;}
}

}

/* Mobile-only glossy crimson reskin. Desktop >= 901px intentionally uses the pre-reskin baseline. */
@media (max-width: 900px){
/* DNPROD — Obsidian / Crimson / Pearl visual system
   Visual-only: preserve layout, content, interactions and section order. */
:root{
  --bg:#0b0b0c!important;--bg2:#101011!important;--bg3:#161616!important;
  --red:#8E1930!important;--white:#F2F1ED!important;
  --gray:#bbb8b5!important;--gray2:#777375!important;--gray3:#2b2829!important;
  --border:rgba(242,241,237,.09)!important;--border2:rgba(242,241,237,.16)!important;
  --dn-radius:20px!important;--crimson:#8E1930;--pearl:#F2F1ED;--obsidian:#161616;
}
html,body{background:#080809!important;color:var(--pearl)!important;}
section{background-color:#0b0b0c!important;}

/* Navigation — restrained smoked lacquer */
body nav{
  top:8px!important;left:10px!important;right:10px!important;width:auto!important;max-width:none!important;height:58px!important;
  padding:0 clamp(16px,2vw,28px)!important;border:1px solid rgba(242,241,237,.10)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(31,31,32,.88),rgba(13,13,14,.90))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 12px 32px rgba(0,0,0,.28)!important;
  backdrop-filter:blur(20px) saturate(112%)!important;-webkit-backdrop-filter:blur(20px) saturate(112%)!important;
}
body nav::before{background:linear-gradient(90deg,transparent,rgba(142,25,48,.34),rgba(242,241,237,.07),transparent)!important;opacity:.42!important;}
body nav::after{background:linear-gradient(110deg,rgba(255,255,255,.025),transparent 34%,transparent 76%,rgba(142,25,48,.025))!important;}
body .mobile-menu{border-radius:0 0 18px 18px!important;background:rgba(10,10,11,.96)!important;}
body .lang-current,body .lang-dropdown,body .nav-cta,body .tag{border-radius:12px!important;}

/* Hero — obsidian first, crimson atmosphere second */
body .hero-scene{
  background:
    radial-gradient(ellipse 52% 48% at 82% 38%,rgba(142,25,48,.20) 0%,rgba(142,25,48,.075) 38%,transparent 72%),
    radial-gradient(ellipse 44% 38% at 18% 74%,rgba(142,25,48,.055),transparent 70%),
    linear-gradient(116deg,#080809 0%,#0c0c0d 54%,#110a0c 100%)!important;
  border-radius:0 0 26px 26px!important;overflow:hidden!important;
}
body .dn-live-gradient{opacity:.32!important;filter:saturate(.72) contrast(1.02)!important;mix-blend-mode:screen!important;}
body .hero-scene::before{
  inset:-18%!important;opacity:.34!important;
  background:radial-gradient(ellipse 48% 44% at 76% 38%,rgba(142,25,48,.22),rgba(142,25,48,.06) 42%,transparent 72%)!important;
  filter:blur(52px)!important;
}
body .hero-scene::after{background:radial-gradient(ellipse at 50% 46%,transparent 0 54%,rgba(0,0,0,.12) 80%,rgba(0,0,0,.26) 100%)!important;}
body .hero.hero-v2{background:transparent!important;border-radius:0!important;border:0!important;box-shadow:none!important;}
body .hero-v2 .hero-kicker::before,body .hero-v2 .hero-proofline::before{background:#8E1930!important;box-shadow:none!important;}
body .hero-v2 .hero-brand-red{color:#F2F1ED!important;}
body .hero-v2 .hero-actions{gap:12px!important;}
body .hero-v2 .hero-actions .btn-red,body .hero-v2 .hero-actions .btn-ghost{
  border-radius:14px!important;overflow:hidden!important;
}
body .hero-v2 .hero-actions .btn-red,body .btn-red{
  color:#F2F1ED!important;border:1px solid rgba(142,25,48,.62)!important;
  background:linear-gradient(180deg,#8E1930 0%,#8E1930 52%,#8E1930 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(0,0,0,.36),0 10px 24px rgba(0,0,0,.25)!important;
}
body .hero-v2 .hero-actions .btn-ghost,body .btn-ghost{
  border:1px solid rgba(242,241,237,.15)!important;
  background:linear-gradient(180deg,rgba(242,241,237,.055),rgba(242,241,237,.012))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 10px 24px rgba(0,0,0,.18)!important;
}
body .hero-v2 .feature-product-window{
  border-radius:20px!important;border:1px solid rgba(242,241,237,.12)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.012)),#101011!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 24px 54px rgba(0,0,0,.36)!important;
}
body .hero-v2 .feature-product-window__viewport,body .hero-v2 .feature-product-window img{border-radius:14px!important;}

/* Crimson is an accent, never a large headline fill */
body .sec-title em,body .about-title em,body .contact-title em,
body .port-tag,body .srv-num,body .step-num,body .stat-val em,
body .feature-brand span,body .feature-link,body .port-link,body .contact-row i,
body .mobile-lang-opt.active{color:#8e1930!important;text-shadow:none!important;}
body #portfolio .sec-title em{color:#F2F1ED!important;}
body #portfolio .sec-title::after{background:#8E1930!important;}

/* Unified lacquer surfaces */
body #portfolio .port-grid,body .srv-grid,body .stack-grid,body .process-steps{background:transparent!important;gap:16px!important;}
body #portfolio .port-card,body .srv-card,body .stack-card,body .process-steps .step,
body .contact #contact-form,body .form,body .about-photo{
  border:1px solid rgba(242,241,237,.095)!important;border-radius:20px!important;overflow:hidden!important;
  background:linear-gradient(145deg,rgba(255,255,255,.048) 0%,rgba(255,255,255,.012) 34%,rgba(142,25,48,.018) 100%),#101011!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),inset 0 -1px 0 rgba(0,0,0,.28),0 18px 42px rgba(0,0,0,.18)!important;
}
body #portfolio .port-card:hover,body .srv-card:hover,body .stack-card:hover{
  border-color:rgba(242,241,237,.15)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.062),rgba(255,255,255,.016) 40%,rgba(142,25,48,.035)),#111112!important;
}
body #portfolio .port-card .port-img{
  margin:8px!important;width:calc(100% - 16px)!important;border-radius:14px!important;overflow:hidden!important;
  background:#09090a!important;border:1px solid rgba(242,241,237,.055)!important;
}
body #portfolio .port-card .port-picture,body #portfolio .port-card .port-picture img,body #portfolio .port-card .port-img img{border-radius:10px!important;}
body .srv-icon,body .stack-icon{
  border-radius:12px!important;border-color:rgba(142,25,48,.28)!important;
  background:linear-gradient(145deg,rgba(142,25,48,.16),rgba(255,255,255,.018))!important;
}
body .about-photo img{border-radius:19px!important;}
body .about-photo-label{margin:8px!important;border-radius:13px!important;background:rgba(11,11,12,.80)!important;border:1px solid rgba(242,241,237,.09)!important;}
body .process-steps .step{background:radial-gradient(circle at 100% 0,rgba(142,25,48,.07),transparent 42%),linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.01)),#101011!important;}

/* Contact */
body .contact #contact-form{padding:clamp(24px,3vw,36px)!important;}
body .contact .form{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;}
body .contact .form input,body .contact .form textarea,body .contact .form select{
  border-radius:12px!important;border:1px solid rgba(242,241,237,.11)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.012)),#0c0c0d!important;
  color:#F2F1ED!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
body .contact .form input:focus,body .contact .form textarea:focus,body .contact .form select:focus{
  border-color:rgba(142,25,48,.68)!important;box-shadow:0 0 0 3px rgba(142,25,48,.12)!important;
}
body footer{
  margin:10px!important;border:1px solid rgba(242,241,237,.075)!important;border-radius:18px!important;
  background:linear-gradient(135deg,#0e0e0f,#120d0e)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;overflow:hidden!important;
}

@media(max-width:640px){
  body nav{top:6px!important;left:7px!important;right:7px!important;width:auto!important;max-width:none!important;height:56px!important;border-radius:16px!important;}
  body .mobile-menu{top:62px!important;}
  body .hero-scene{border-radius:0 0 22px 22px!important;}
  body .dn-live-gradient{opacity:.24!important;}
  body .hero-scene::before{opacity:.28!important;}
  body .hero-v2 .hero-actions .btn-red,body .hero-v2 .hero-actions .btn-ghost{border-radius:13px!important;}
  body #portfolio .port-grid{gap:16px!important;}
  body #portfolio .port-card{border-radius:18px!important;}
  body #portfolio .port-card .port-img,
  body #portfolio .port-card:nth-child(1) .port-img,
  body #portfolio .port-card:nth-child(2) .port-img,
  body #portfolio .port-card:nth-child(3) .port-img,
  body #portfolio .port-card:nth-child(4) .port-img{
    margin:7px!important;width:auto!important;left:0!important;right:0!important;padding:10px!important;border-radius:13px!important;
  }
  body #portfolio .port-card:nth-child(-n+3) .port-picture{inset:10px!important;border-radius:9px!important;}
  body #portfolio .port-card:nth-child(-n+3) .port-picture img{border-radius:8px!important;}
  body .process-steps .step{border-radius:18px!important;background:radial-gradient(circle at 100% 0,rgba(142,25,48,.06),transparent 42%),#101011!important;}
  body .process-steps .step-num{color:#8e1930!important;}
}


/* Phase: liquid-glass refinement — obsidian dominant, crimson secondary */
body .hero-scene{
  background:
    radial-gradient(ellipse 46% 42% at 84% 38%,rgba(142,25,48,.105) 0%,rgba(142,25,48,.035) 38%,transparent 72%),
    radial-gradient(ellipse 38% 34% at 18% 74%,rgba(142,25,48,.022),transparent 70%),
    linear-gradient(116deg,#080809 0%,#0b0b0c 58%,#0d0a0b 100%)!important;
}
body .dn-live-gradient{opacity:.16!important;filter:saturate(.58) contrast(1.01)!important;}
body .hero-scene::before{
  opacity:.17!important;
  background:radial-gradient(ellipse 46% 42% at 78% 38%,rgba(142,25,48,.15),rgba(142,25,48,.035) 42%,transparent 74%)!important;
  filter:blur(58px)!important;
}

/* Liquid glass: translucent material + edge refraction + specular light */
body nav,
body #portfolio .port-card,
body .srv-card,
body .stack-card,
body .process-steps .step,
body .contact #contact-form,
body .about-photo,
body .hero-v2 .feature-product-window{
  position:relative!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.072) 0%,rgba(255,255,255,.025) 22%,rgba(255,255,255,.008) 56%,rgba(142,25,48,.012) 100%),
    rgba(16,16,17,.68)!important;
  -webkit-backdrop-filter:blur(20px) saturate(128%)!important;
  backdrop-filter:blur(20px) saturate(128%)!important;
  border-color:rgba(242,241,237,.13)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.15),
    inset 1px 0 0 rgba(255,255,255,.035),
    inset 0 -1px 0 rgba(0,0,0,.34),
    0 18px 46px rgba(0,0,0,.22)!important;
}
body #portfolio .port-card::before,
body .srv-card::before,
body .stack-card::before,
body .process-steps .step::before,
body .contact #contact-form::after,
body .about-photo::before,
body .hero-v2 .feature-product-window::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:1!important;
  pointer-events:none!important;
  inset:0!important;
  border-radius:inherit!important;
  background:
    radial-gradient(ellipse 65% 24% at 22% 0%,rgba(255,255,255,.115),transparent 68%),
    linear-gradient(115deg,rgba(255,255,255,.045),transparent 28%,transparent 76%,rgba(255,255,255,.018))!important;
  opacity:.72!important;
}
body #portfolio .port-card>*,
body .srv-card>*,
body .stack-card>*,
body .process-steps .step>*,
body .contact #contact-form>*,
body .about-photo>*,
body .hero-v2 .feature-product-window>*{position:relative;z-index:2;}

body .hero-v2 .hero-actions .btn-red,
body .hero-v2 .hero-actions .btn-ghost,
body .btn-red,body .btn-ghost,body .nav-cta,body .lang-current{
  -webkit-backdrop-filter:blur(16px) saturate(132%)!important;
  backdrop-filter:blur(16px) saturate(132%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(0,0,0,.30),
    0 10px 26px rgba(0,0,0,.22)!important;
}
body .hero-v2 .hero-actions .btn-red,body .btn-red{
  background:linear-gradient(180deg,rgba(142,25,48,.78),rgba(142,25,48,.72) 52%,rgba(142,25,48,.76))!important;
}
body .hero-v2 .hero-actions .btn-ghost,body .btn-ghost{
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.018))!important;
}
@media(max-width:640px){
  body .dn-live-gradient{opacity:.12!important;}
  body .hero-scene::before{opacity:.13!important;}
  body #portfolio .port-card,
  body .process-steps .step,
  body .contact #contact-form{
    -webkit-backdrop-filter:blur(16px) saturate(122%)!important;
    backdrop-filter:blur(16px) saturate(122%)!important;
  }
}


/* Liquid Glass v2 — stronger gloss, same restrained crimson */
body nav,
body #portfolio .port-card,
body .srv-card,
body .stack-card,
body .process-steps .step,
body .contact #contact-form,
body .about-photo,
body .hero-v2 .feature-product-window{
  background:
    linear-gradient(132deg,rgba(255,255,255,.115) 0%,rgba(255,255,255,.040) 18%,rgba(255,255,255,.010) 45%,rgba(255,255,255,.030) 76%,rgba(142,25,48,.012) 100%),
    rgba(13,13,14,.54)!important;
  -webkit-backdrop-filter:blur(28px) saturate(152%) brightness(1.035)!important;
  backdrop-filter:blur(28px) saturate(152%) brightness(1.035)!important;
  border-color:rgba(242,241,237,.18)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 1px 0 0 rgba(255,255,255,.065),
    inset -1px 0 0 rgba(255,255,255,.025),
    inset 0 -1px 0 rgba(0,0,0,.40),
    0 22px 52px rgba(0,0,0,.26),
    0 1px 10px rgba(242,241,237,.018)!important;
}
body #portfolio .port-card::before,
body .srv-card::before,
body .stack-card::before,
body .process-steps .step::before,
body .contact #contact-form::after,
body .about-photo::before,
body .hero-v2 .feature-product-window::before{
  background:
    radial-gradient(ellipse 72% 30% at 18% -4%,rgba(255,255,255,.24) 0%,rgba(255,255,255,.075) 34%,transparent 70%),
    radial-gradient(ellipse 42% 20% at 92% 102%,rgba(255,255,255,.055),transparent 72%),
    linear-gradient(112deg,rgba(255,255,255,.085),transparent 25%,transparent 70%,rgba(255,255,255,.035))!important;
  opacity:.92!important;
}
body nav{
  background:
    linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.020) 46%,rgba(0,0,0,.045)),
    rgba(12,12,13,.58)!important;
  -webkit-backdrop-filter:blur(30px) saturate(158%)!important;
  backdrop-filter:blur(30px) saturate(158%)!important;
  border-color:rgba(242,241,237,.17)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),inset 0 -1px 0 rgba(0,0,0,.32),0 16px 38px rgba(0,0,0,.27)!important;
}
body .hero-v2 .hero-actions .btn-red,
body .hero-v2 .hero-actions .btn-ghost,
body .btn-red,body .btn-ghost,body .nav-cta,body .lang-current{
  position:relative!important;overflow:hidden!important;
  -webkit-backdrop-filter:blur(22px) saturate(155%)!important;
  backdrop-filter:blur(22px) saturate(155%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -1px 0 rgba(0,0,0,.34),
    0 12px 30px rgba(0,0,0,.24)!important;
}
body .hero-v2 .hero-actions .btn-ghost,body .btn-ghost{
  background:linear-gradient(180deg,rgba(255,255,255,.115),rgba(255,255,255,.030) 50%,rgba(255,255,255,.012))!important;
  border-color:rgba(242,241,237,.22)!important;
}
body .hero-v2 .hero-actions .btn-red,body .btn-red{
  background:linear-gradient(180deg,rgba(142,25,48,.82),rgba(142,25,48,.70) 52%,rgba(142,25,48,.76))!important;
  border-color:rgba(242,241,237,.18)!important;
}
body .contact .form input,body .contact .form textarea,body .contact .form select{
  background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.018)),rgba(8,8,9,.64)!important;
  -webkit-backdrop-filter:blur(18px) saturate(135%)!important;
  backdrop-filter:blur(18px) saturate(135%)!important;
  border-color:rgba(242,241,237,.15)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),inset 0 -1px 0 rgba(0,0,0,.28)!important;
}
@media(max-width:640px){
  body nav,
  body #portfolio .port-card,
  body .process-steps .step,
  body .contact #contact-form{
    -webkit-backdrop-filter:blur(24px) saturate(145%)!important;
    backdrop-filter:blur(24px) saturate(145%)!important;
  }
}


/* QA refinement: one red, aligned service numbering, glass submit */
:root{
  --red:#8e1930!important;
  --crimson:#8e1930!important;
}
body .hero-v2 .hero-kicker::before,
body .hero-v2 .hero-proofline::before,
body #portfolio .sec-title::after{background:#8e1930!important;}
body .sec-title em,body .about-title em,body .contact-title em,
body .port-tag,body .srv-num,body .step-num,body .stat-val em,
body .feature-brand span,body .feature-link,body .port-link,body .contact-row i,
body .mobile-lang-opt.active{color:#8e1930!important;}
body .hero-v2 .hero-actions .btn-red,
body .btn-red{
  border-color:rgba(142,25,48,.68)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.025) 30%,transparent 48%),
    linear-gradient(180deg,rgba(142,25,48,.82),rgba(142,25,48,.64) 54%,rgba(142,25,48,.52))!important;
}

/* Services: number and title share a deliberate vertical center line */
body .srv-card{
  display:grid!important;
  grid-template-columns:72px minmax(0,1fr)!important;
  grid-template-areas:
    "num title"
    "num desc"
    "num price"!important;
  column-gap:34px!important;
  align-items:start!important;
}
body .srv-card .srv-icon{display:none!important;}
body .srv-card .srv-num{
  grid-area:num!important;
  align-self:start!important;
  justify-self:center!important;
  width:72px!important;
  margin:5px 0 0!important;
  text-align:center!important;
  line-height:1!important;
}
body .srv-card .srv-title{grid-area:title!important;margin:0!important;}
body .srv-card .srv-desc{grid-area:desc!important;}
body .srv-card .srv-price{grid-area:price!important;}

/* Contact submit: obvious liquid glass, same single red */
body .contact .form .btn-red[type="button"]{
  width:100%!important;
  border:1px solid rgba(242,241,237,.22)!important;
  border-radius:18px!important;
  color:#F2F1ED!important;
  background:
    radial-gradient(ellipse 68% 80% at 22% -22%,rgba(255,255,255,.30),transparent 56%),
    linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.025) 34%,transparent 48%),
    rgba(142,25,48,.66)!important;
  -webkit-backdrop-filter:blur(28px) saturate(160%) brightness(1.06)!important;
  backdrop-filter:blur(28px) saturate(160%) brightness(1.06)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.38),
    inset 1px 0 0 rgba(255,255,255,.08),
    inset 0 -1px 0 rgba(0,0,0,.34),
    0 14px 34px rgba(0,0,0,.28),
    0 0 22px rgba(142,25,48,.12)!important;
}
body .contact .form .btn-red[type="button"]:hover{
  opacity:1!important;
  transform:translateY(-1px)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.44),
    inset 1px 0 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(0,0,0,.34),
    0 18px 40px rgba(0,0,0,.30),
    0 0 28px rgba(142,25,48,.16)!important;
}
@media(max-width:640px){
  body .srv-card{
    grid-template-columns:72px minmax(0,1fr)!important;
    column-gap:34px!important;
  }
  body .srv-card .srv-num{width:72px!important;margin-top:5px!important;}
}


/* Service card composition v2 — number belongs to title, not a side rail */
body .srv-card{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  grid-template-areas:
    "num title"
    "desc desc"
    "price price"!important;
  column-gap:16px!important;
  row-gap:18px!important;
  align-items:baseline!important;
}
body .srv-card .srv-icon{display:none!important;}
body .srv-card .srv-num{
  grid-area:num!important;
  width:auto!important;
  min-width:0!important;
  margin:0!important;
  padding-top:0!important;
  align-self:baseline!important;
  justify-self:start!important;
  text-align:left!important;
  font-size:12px!important;
  line-height:1!important;
  letter-spacing:.14em!important;
  color:#8E1930!important;
  opacity:.92!important;
}
body .srv-card .srv-num::after{
  content:"—"!important;
  margin-left:10px!important;
  color:rgba(142,25,48,.72)!important;
}
body .srv-card .srv-title{
  grid-area:title!important;
  margin:0!important;
  align-self:baseline!important;
  line-height:1.08!important;
}
body .srv-card .srv-desc{
  grid-area:desc!important;
  margin:6px 0 0!important;
  max-width:42rem!important;
}
body .srv-card .srv-price{grid-area:price!important;margin-top:2px!important;}
@media(max-width:640px){
  body .srv-card{
    grid-template-columns:auto minmax(0,1fr)!important;
    column-gap:13px!important;
    row-gap:17px!important;
  }
  body .srv-card .srv-num{width:auto!important;margin:0!important;font-size:11px!important;}
  body .srv-card .srv-num::after{margin-left:8px!important;}
}


/* Mobile visual consistency pass */
body .about-trust{
  border:1px solid rgba(242,241,237,.13)!important;
  border-radius:20px!important;
  overflow:hidden!important;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.014) 38%,rgba(142,25,48,.012)),rgba(13,13,14,.54)!important;
  -webkit-backdrop-filter:blur(26px) saturate(148%)!important;
  backdrop-filter:blur(26px) saturate(148%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 20px 48px rgba(0,0,0,.22)!important;
}
body .about-trust>*{border-color:rgba(242,241,237,.08)!important;}
body .about-trust strong,body .about-trust b{color:#8E1930!important;}

/* Services: generous inset and title-led hierarchy */
body .srv-card{
  padding:34px 34px 32px!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  column-gap:14px!important;
  row-gap:22px!important;
}
body .srv-card .srv-num{margin:0!important;padding:3px 0 0!important;opacity:.82!important;}
body .srv-card .srv-title{padding:0!important;}
body .srv-card .srv-desc{padding:0!important;margin:0!important;line-height:1.58!important;}
@media(max-width:640px){
  body .srv-card{
    padding:28px 24px 28px!important;
    grid-template-columns:54px minmax(0,1fr)!important;
    column-gap:10px!important;
    row-gap:24px!important;
  }
  body .srv-card .srv-num{
    width:54px!important;
    padding-top:4px!important;
    font-size:10px!important;
    letter-spacing:.10em!important;
  }
  body .srv-card .srv-num::after{margin-left:6px!important;}
  body .srv-card .srv-title{font-size:clamp(29px,8vw,39px)!important;line-height:1.06!important;}
  body .srv-card .srv-desc{font-size:clamp(17px,4.6vw,21px)!important;line-height:1.58!important;}
}

/* One crimson token for visual accents that previously used legacy red */
body .contact-row i,
body .about-photo-label small,
body .about-photo-label .dn,
body .sec-label,
body .process-kicker,
body .feature-eyebrow,
body .port-tag,
body .srv-num,
body .step-num{color:#8E1930!important;}
body .about-photo::after,
body .about-photo-label .dn,
body .feature-product-window::after{border-color:#8E1930!important;}


/* Final liquid-glass cohesion */
body .contact #contact-form{
  background:
    radial-gradient(120% 90% at 8% 0%,rgba(255,255,255,.13),transparent 38%),
    linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.018) 38%,rgba(142,25,48,.018)),
    rgba(11,11,12,.64)!important;
  border-color:rgba(242,241,237,.16)!important;
  -webkit-backdrop-filter:blur(30px) saturate(155%)!important;
  backdrop-filter:blur(30px) saturate(155%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.35),0 28px 70px rgba(0,0,0,.28)!important;
}
body .contact #contact-form .btn-red,
body .contact #contact-form button[type="submit"]{
  position:relative!important;
  overflow:hidden!important;
  color:#F2F1ED!important;
  border:1px solid rgba(142,25,48,.72)!important;
  border-radius:18px!important;
  background:
    radial-gradient(130% 120% at 22% 0%,rgba(255,255,255,.20),transparent 34%),
    linear-gradient(180deg,rgba(142,25,48,.48),rgba(142,25,48,.20) 52%,rgba(30,8,13,.66))!important;
  -webkit-backdrop-filter:blur(24px) saturate(175%)!important;
  backdrop-filter:blur(24px) saturate(175%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(0,0,0,.40),0 14px 36px rgba(142,25,48,.15)!important;
}
body .contact #contact-form .btn-red::before,
body .contact #contact-form button[type="submit"]::before{
  content:""!important;position:absolute!important;inset:1px 10% auto!important;height:42%!important;border-radius:999px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.18),transparent)!important;filter:blur(8px)!important;pointer-events:none!important;
}

/* Trust/principles panel: same glass language as service/contact cards */
body .about-trust,
body .trust-grid,
body .principles,
body .principles-grid{
  border-radius:20px!important;
}
body .about-trust{
  background:
    radial-gradient(120% 90% at 8% 0%,rgba(255,255,255,.11),transparent 38%),
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.012) 42%,rgba(142,25,48,.012)),
    rgba(11,11,12,.60)!important;
}

/* Never allow legacy vivid red to win through inherited theme variables */
:root{--red:#8E1930!important;}


/* Geometry guard: keep glass surfaces inside their containing block */
body nav,body .mobile-menu,body .srv-card,body .about-trust,body #contact-form,body footer{
  box-sizing:border-box!important;
  max-width:100%!important;
}
body .srv-card,body .about-trust,body #contact-form,body footer{
  min-width:0!important;
}
body .srv-card>*{min-width:0!important;}


/* CI overflow fix — explicit geometry after all legacy phase rules */
html body nav{
  left:10px!important;
  right:10px!important;
  width:calc(100% - 20px)!important;
  max-width:calc(100% - 20px)!important;
  box-sizing:border-box!important;
}
@media(max-width:640px){
  html body nav{
    left:7px!important;
    right:7px!important;
    width:calc(100% - 14px)!important;
    max-width:calc(100% - 14px)!important;
  }
  html body .process-steps{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
    transform:none!important;
  }
  html body .process-steps .step{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0 0 16px!important;
    transform:none!important;
  }
}


/* Requested polish: stronger button gloss, muted contact icons, remove red shard above founder */
body .btn-red,
body .btn-ghost,
body .nav-cta,
body .lang-current,
body .contact .form button[type="submit"]{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
body .btn-red::after,
body .btn-ghost::after,
body .nav-cta::after,
body .lang-current::after,
body .contact .form button[type="submit"]::after{
  content:""!important;
  position:absolute!important;
  z-index:2!important;
  left:7%!important;
  right:7%!important;
  top:2px!important;
  height:46%!important;
  border-radius:999px 999px 48% 48%!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.09) 42%,transparent 100%)!important;
  filter:blur(.2px)!important;
  opacity:.72!important;
  mix-blend-mode:screen!important;
}
body .btn-red,
body .contact .form button[type="submit"]{
  background:
    radial-gradient(100% 90% at 18% -12%,rgba(255,255,255,.34),transparent 42%),
    linear-gradient(180deg,rgba(142,25,48,.86) 0%,rgba(142,25,48,.82) 46%,rgba(142,25,48,.92) 100%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    inset 0 -1px 0 rgba(0,0,0,.48),
    inset 1px 0 0 rgba(255,255,255,.10),
    0 12px 28px rgba(0,0,0,.30),
    0 0 24px rgba(142,25,48,.15)!important;
}
body .btn-ghost,
body .nav-cta,
body .lang-current{
  background:
    radial-gradient(100% 90% at 18% -12%,rgba(255,255,255,.18),transparent 42%),
    linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.025) 48%,rgba(0,0,0,.10))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -1px 0 rgba(0,0,0,.32),
    0 10px 26px rgba(0,0,0,.24)!important;
}
body .contact-icon,
body .contact-info i,
body .contact-links i,
body .contact-meta i,
body .contact-details i{
  color:#8E1930!important;
  text-shadow:none!important;
}
/* Founder portrait: no decorative outer frame; use the real DNPROD brand asset */
body .about-photo-wrap::before{
  content:none!important;
  display:none!important;
  border:0!important;
}
body .about-photo-label::after{
  content:''!important;
  width:52px!important;
  height:32px!important;
  border:0!important;
  background:url('/images/brand/dnprod-wordmark.png') center/contain no-repeat!important;
  filter:brightness(0) saturate(100%) invert(16%) sepia(43%) saturate(3435%) hue-rotate(327deg) brightness(89%) contrast(91%)!important;
}


/* Final visual correction from device QA */
body .contact-row i,
body .contact-row .fa-brands,
body .contact-row .fa-regular,
body .contact-row .fa-solid{
  color:#8E1930!important;
  -webkit-text-fill-color:#8E1930!important;
  opacity:.82!important;
  filter:saturate(.72) brightness(.86)!important;
  text-shadow:none!important;
}
body .btn-red,
body .contact .form button[type="submit"]{
  border-color:rgba(142,25,48,.52)!important;
  background:
    radial-gradient(90% 68% at 22% -4%,rgba(255,255,255,.24),transparent 45%),
    linear-gradient(180deg,rgba(142,25,48,.72) 0%,rgba(142,25,48,.72) 48%,rgba(142,25,48,.92) 100%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(0,0,0,.54),
    0 10px 28px rgba(0,0,0,.32),
    0 0 18px rgba(142,25,48,.08)!important;
}
body .btn-red::after,
body .contact .form button[type="submit"]::after{
  opacity:.52!important;
  background:linear-gradient(180deg,rgba(255,255,255,.27),rgba(255,255,255,.055) 46%,transparent)!important;
}

/* Founder card: no fabricated logo mark — repository has no standalone DN symbol */
body .about-photo-label::after{content:none!important;display:none!important;background:none!important;}
body .about-photo-label{padding-right:18px!important;}


/* Device QA correction: refined flat liquid-glass controls, no inflated 3D volume */
body .btn-red,
body .btn-ghost,
body .nav-cta,
body .lang-current,
body .contact .form button[type="submit"]{
  transform:none!important;
  filter:none!important;
}
body .btn-red,
body .contact .form button[type="submit"]{
  border:1px solid rgba(142,25,48,.58)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.075) 0%,rgba(255,255,255,.018) 20%,transparent 42%),
    linear-gradient(180deg,rgba(142,25,48,.52),rgba(142,25,48,.58))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(0,0,0,.22),
    0 6px 16px rgba(0,0,0,.18)!important;
}
body .btn-ghost,
body .nav-cta,
body .lang-current{
  border-color:rgba(242,241,237,.20)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.018) 22%,rgba(255,255,255,.008) 100%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 6px 16px rgba(0,0,0,.16)!important;
}
body .btn-red::after,
body .btn-ghost::after,
body .nav-cta::after,
body .lang-current::after,
body .contact .form button[type="submit"]::after{
  left:8%!important;
  right:8%!important;
  top:1px!important;
  height:1px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.48) 28%,rgba(255,255,255,.24) 72%,transparent)!important;
  opacity:.78!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}

/* Restore founder logo slot; use the repository's real DNPROD brand asset */
body .about-photo-label{padding-right:88px!important;}
body .about-photo-label::after{
  content:''!important;
  display:block!important;
  position:absolute!important;
  right:18px!important;
  top:50%!important;
  width:58px!important;
  height:30px!important;
  transform:translateY(-50%)!important;
  border:0!important;
  background:url('/images/brand/dnprod-wordmark.png') center/contain no-repeat!important;
  filter:brightness(0) invert(1)!important;
  opacity:.94!important;
}

}

/* DNPROD final mobile visual lock. Desktop is intentionally untouched. */
@media (max-width:900px){
:root{--red:#8E1930!important}
body .hero-kicker::before,body .hero-v2 .hero-kicker::before{background:#8E1930!important}
body .hero-kicker,body .ia-founder-kicker,body .port-tag,body .srv-num,body .about-proof-num,body .process-steps .step-num,body .positioning-copy em,body .feature-link,body .port-link,body .about-photo-label::before,body .about-photo-label small,body .about-photo-label .dn{color:#8E1930!important}
body .contact-row i,body .contact-icon,body .contact-info i,body .contact-links i,body .contact-meta i,body .contact-details i{color:#8E1930!important;-webkit-text-fill-color:#8E1930!important;opacity:.82!important;filter:saturate(.72) brightness(.86)!important;text-shadow:none!important}
body .about-proof{grid-template-columns:1fr!important;gap:12px!important;background:transparent!important;border:0!important}
body .about-proof-item{padding:18px!important;min-height:0!important;border:1px solid rgba(242,241,237,.10)!important;border-radius:18px!important;background:radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.07),transparent 42%),linear-gradient(180deg,rgba(25,25,27,.76),rgba(9,9,10,.82))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 30px rgba(0,0,0,.20)!important;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important}
body .about-photo-wrap::before{content:none!important;display:none!important}
body .about-photo-label{padding-right:88px!important;border-left:0!important}
body .about-photo-label::after{content:''!important;display:block!important;position:absolute!important;right:18px!important;top:50%!important;width:58px!important;height:30px!important;transform:translateY(-50%)!important;border:0!important;background:url('/images/brand/dnprod-wordmark.png') center/contain no-repeat!important;filter:brightness(0) invert(1)!important;opacity:.94!important}
body .positioning-manifesto{background:radial-gradient(70% 65% at 78% 18%,rgba(142,25,48,.12),transparent 44%),#070707!important}
}
@media (max-width:900px){body .about-photo-label::before{color:#F2F1ED!important;opacity:.72!important;}}

@media(max-width:900px){
 body .sec-label,body .positioning-kicker,body .case-study-label,body .case-proof,
 body .port-card .port-tag,body .port-card .live-link,body .port-card a[href].live-site,
 body .portfolio a[href*="http"],body .about-photo-label::before{
   color:#8E1930!important;-webkit-text-fill-color:#8E1930!important;text-shadow:none!important;
 }
 body .case-study-grid{gap:12px!important;border:0!important;background:transparent!important}
 body .case-study-cell{
   border:1px solid rgba(242,241,237,.10)!important;border-radius:18px!important;
   background:radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.065),transparent 42%),linear-gradient(180deg,rgba(25,25,27,.74),rgba(9,9,10,.84))!important;
   box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 12px 28px rgba(0,0,0,.20)!important;
   backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;
 }
 body .about-photo-label::before{color:#F2F1ED!important;-webkit-text-fill-color:#F2F1ED!important;opacity:.72!important}
}

@media(max-width:900px){
 body .case-proof,body .case-proof-row .case-proof,body .case-proof-row span,body .case-proof-row a{
   color:#8E1930!important;-webkit-text-fill-color:#8E1930!important;text-shadow:none!important;
 }
 body .contact-row,body .contact-row a,body .contact-row i,body .contact-row svg{
   color:#8E1930!important;-webkit-text-fill-color:#8E1930!important;
 }
 body .contact-row svg *,body .contact-icon svg *,body .contact-info svg *{
   stroke:#8E1930!important;
 }
 body .contact-row svg [fill]:not([fill="none"]),body .contact-icon svg [fill]:not([fill="none"]){
   fill:#8E1930!important;
 }
 body .contact-row i,body .contact-icon,body .contact-info i{
   filter:saturate(.55) brightness(.72)!important;opacity:.86!important;
 }
}

@media(max-width:900px){
 body .case-proof,body .case-proof-row .case-proof,body .case-proof-row span,body .case-proof-row a{
   color:#F2F1ED!important;-webkit-text-fill-color:#F2F1ED!important;
   border-radius:12px!important;text-shadow:none!important;
 }
 body .contact-row,body .contact-row a,body .contact-row a:link,body .contact-row a:visited,
 body .contact-info a,body .contact-info span,body .contact-info p{
   color:#F2F1ED!important;-webkit-text-fill-color:#F2F1ED!important;
 }
 body .contact-row i,body .contact-icon,body .contact-info i,body .contact-row svg{
   color:#8E1930!important;-webkit-text-fill-color:#8E1930!important;
 }
 body .contact-row svg *,body .contact-icon svg *,body .contact-info svg *{stroke:#8E1930!important}
 body .contact-row svg [fill]:not([fill="none"]),body .contact-icon svg [fill]:not([fill="none"]){fill:#8E1930!important}
}

@media(max-width:900px){
 html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
 body main,body section,body .container,body .portfolio,body #portfolio,
 body #portfolio .port-grid,body #portfolio .port-card,body #portfolio .port-info,
 body #portfolio .case-study-grid,body #portfolio .case-study-cell{
   box-sizing:border-box!important;min-width:0!important;max-width:100%!important;
 }
 body #portfolio .port-card{width:100%!important;margin-left:0!important;margin-right:0!important;transform:none!important}
 body #portfolio .port-card .port-info{width:100%!important;margin-left:0!important;margin-right:0!important}
 body #portfolio .case-study-grid{width:100%!important;margin-left:0!important;margin-right:0!important;transform:none!important}
 body #portfolio .case-study-cell{width:100%!important}
 body #portfolio .port-card .case-proof-row{
   width:100%!important;max-width:100%!important;min-width:0!important;
   margin-left:0!important;margin-right:0!important;transform:none!important;
   overflow:hidden!important;
 }
 body #portfolio .port-card .case-proof-row>*{min-width:0!important;max-width:100%!important}
}

/* DNPROD — WLFF flagship card + standalone case study. */

@media (min-width:901px){
  #portfolio .port-card.port-card--wlff{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:minmax(0,1.08fr) minmax(400px,.92fr)!important;
    align-items:start!important;
    min-height:0!important;
    position:relative!important;
    border-color:rgba(255,255,255,.16)!important;
  }
  #portfolio .port-card.port-card--wlff::before{
    content:'FLAGSHIP / EVENT COMMERCE';
    position:absolute;
    top:18px;
    right:22px;
    z-index:5;
    color:rgba(255,255,255,.38);
    font-size:8px;
    letter-spacing:.3em;
  }
  #portfolio .port-card.port-card--wlff .port-img{
    aspect-ratio:16/9!important;
    height:auto!important;
    min-height:0!important;
    align-self:start!important;
    padding:0!important;
    background:
      radial-gradient(circle at 18% 12%,rgba(203,160,54,.15),transparent 48%),
      #050505!important;
  }
  #portfolio .port-card.port-card--wlff .port-picture{
    display:block!important;
    width:100%!important;
    height:100%!important;
  }
  #portfolio .port-card.port-card--wlff .port-img img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center top!important;
    border-radius:0!important;
  }
  #portfolio .port-card.port-card--wlff .port-info{
    min-height:100%!important;
    padding:clamp(32px,3.2vw,48px)!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    background:
      radial-gradient(circle at 100% 0,rgba(142,25,48,.10),transparent 36%),
      linear-gradient(180deg,#0b0b0b,#070707)!important;
  }
  #portfolio .port-card.port-card--wlff .port-name{
    max-width:650px;
    font-size:clamp(46px,4.7vw,76px)!important;
    line-height:.92!important;
  }
  #portfolio .port-card.port-card--wlff .port-desc{
    max-width:650px;
    font-size:clamp(15px,1.15vw,18px)!important;
    color:rgba(255,255,255,.68)!important;
  }

  /* Third selected case: use the full row instead of leaving half the grid empty. */
  #portfolio .port-card:nth-child(3){
    grid-column:1 / -1!important;
    width:100%!important;
    justify-self:stretch!important;
    display:grid!important;
    grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr)!important;
    align-items:stretch!important;
    min-height:0!important;
  }
  #portfolio .port-card:nth-child(3) .port-img{
    aspect-ratio:16/9!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
  }
  #portfolio .port-card:nth-child(3) .port-info{
    padding:clamp(30px,3vw,46px)!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
  }
}

#portfolio .wlff-engineering{
  grid-column:1 / -1!important;
  border-top:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg,rgba(255,255,255,.014),rgba(255,255,255,0)),
    #070707;
  padding:0 clamp(28px,3vw,46px) clamp(26px,3vw,40px);
}
#portfolio .wlff-engineering-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border:1px solid rgba(255,255,255,.10);
  border-top:0;
  background:rgba(255,255,255,.09);
}
#portfolio .wlff-engineering-cell{
  min-width:0;
  padding:22px 24px 24px;
  background:#080808;
  border-right:1px solid rgba(255,255,255,.09);
}
#portfolio .wlff-engineering-cell:last-child{border-right:0;}
#portfolio .wlff-engineering-label{
  margin:0 0 10px;
  color:#8E1930;
  font-size:9px;
  line-height:1.2;
  letter-spacing:.24em;
  text-transform:uppercase;
}
#portfolio .wlff-engineering-value{
  margin:0;
  color:rgba(255,255,255,.70);
  font-size:13px;
  line-height:1.65;
}
#portfolio .wlff-proof-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}
#portfolio .wlff-proof{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 11px;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.018);
  color:rgba(255,255,255,.52);
  font-size:9px;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
}

#portfolio .port-role{
  margin-top:18px;
  color:rgba(255,255,255,.86);
  font-size:12px;
  line-height:1.6;
  letter-spacing:.06em;
}
#portfolio .port-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  margin-top:24px;
}
#portfolio .port-actions .port-link{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:46px!important;
  margin-top:0!important;
  padding:12px 18px!important;
  border:1px solid rgba(255,255,255,.28)!important;
  background:rgba(255,255,255,.025)!important;
  color:#f5f5f2!important;
  text-decoration:none!important;
  font-size:11px!important;
  font-weight:600!important;
  line-height:1!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  cursor:pointer!important;
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    color .18s ease,
    box-shadow .18s ease!important;
}
#portfolio .port-actions .port-link:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(255,255,255,.72)!important;
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
}
#portfolio .port-actions .port-link:active{
  transform:translateY(0) scale(.985)!important;
}
#portfolio .port-actions .port-link:focus-visible{
  outline:2px solid #fff!important;
  outline-offset:3px!important;
}
#portfolio .port-actions .port-link--primary{
  border-color:#8E1930!important;
  background:#8E1930!important;
  color:#fff!important;
  box-shadow:0 10px 30px rgba(142,25,48,.16)!important;
}
#portfolio .port-actions .port-link--primary:hover{
  border-color:#8E1930!important;
  background:#8E1930!important;
  box-shadow:0 14px 38px rgba(142,25,48,.28)!important;
}

@media(max-width:900px){
  #portfolio .port-card.port-card--wlff::before{display:none!important;}
  #portfolio .wlff-engineering{padding:0 18px 24px;}
  #portfolio .wlff-engineering-grid{grid-template-columns:1fr;}
  #portfolio .wlff-engineering-cell{
    padding:18px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.09);
  }
  #portfolio .wlff-engineering-cell:last-child{border-bottom:0;}
  #portfolio .wlff-proof-row{margin-top:12px;}
  #portfolio .port-card.port-card--wlff .port-img{min-height:0!important;}
  #portfolio .port-role{font-size:11px;margin-top:14px;}
  #portfolio .port-actions{margin-top:20px;gap:10px;}
  #portfolio .port-actions .port-link{
    min-height:48px!important;
    padding:13px 16px!important;
  }
}
@media(max-width:520px){
  #portfolio .wlff-engineering{padding:0 14px 20px;}
  #portfolio .wlff-engineering-cell{padding:16px;}
  #portfolio .wlff-proof{font-size:8px;padding:7px 9px;}
  #portfolio .port-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  #portfolio .port-actions .port-link{
    width:100%!important;
  }
}

/* Standalone WLFF case study */
.wlff-case-page{background:#050505;color:#f2f1ed;}
.wlff-case-page *{box-sizing:border-box;}
.wlff-case-page a:focus-visible{outline:2px solid #8E1930;outline-offset:4px;}
.wlff-case-nav{
  min-height:68px;padding:0 clamp(20px,4vw,56px);
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  border-bottom:1px solid rgba(255,255,255,.09);
  background:rgba(5,5,5,.92);
}
.wlff-case-brand{display:block;width:126px;height:38px;position:relative;overflow:hidden;}
.wlff-case-brand img{position:absolute;width:152px;max-width:none;left:-14px;top:-6px;display:block;}
.wlff-case-nav-right{display:flex;align-items:center;gap:18px;}
.wlff-case-back,.wlff-case-lang{
  color:rgba(255,255,255,.62);text-decoration:none;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
}
.wlff-case-back:hover,.wlff-case-lang:hover,.wlff-case-lang[aria-current="page"]{color:#fff;}
.wlff-case-lang[aria-current="page"]{border-bottom:1px solid #8E1930;padding-bottom:3px;}
.wlff-case-shell{width:min(1380px,calc(100% - 48px));margin:0 auto;}
.wlff-case-hero{
  position:relative;overflow:hidden;padding:clamp(74px,9vw,138px) 0 clamp(56px,7vw,100px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.wlff-case-hero::after{
  content:'WLFF';position:absolute;right:-.03em;top:42%;transform:translateY(-50%);
  font-family:'Bebas Neue',sans-serif;font-size:clamp(170px,29vw,520px);line-height:.75;
  color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.035);pointer-events:none;
}
.wlff-case-kicker,.wlff-case-section-label{
  color:#8E1930;font-size:10px;letter-spacing:.28em;text-transform:uppercase;
}
.wlff-case-title{
  position:relative;z-index:2;margin:22px 0 26px;max-width:1050px;
  font-family:'Bebas Neue',sans-serif;font-size:clamp(66px,10vw,150px);line-height:.82;font-weight:400;letter-spacing:.01em;
}
.wlff-case-title em{color:#8E1930;font-style:normal;}
.wlff-case-lead{position:relative;z-index:2;max-width:790px;color:rgba(255,255,255,.67);font-size:clamp(17px,1.5vw,21px);line-height:1.7;}
.wlff-case-role{margin-top:28px;display:flex;flex-wrap:wrap;gap:10px;}
.wlff-case-role span{border:1px solid rgba(255,255,255,.12);padding:8px 12px;font-size:11px;letter-spacing:.08em;color:rgba(255,255,255,.76);}
.wlff-case-metrics{
  position:relative;z-index:2;margin-top:clamp(52px,7vw,90px);display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.10);border-bottom:1px solid rgba(255,255,255,.10);
}
.wlff-case-metric{padding:26px 22px;border-right:1px solid rgba(255,255,255,.10);}
.wlff-case-metric:last-child{border-right:0;}
.wlff-case-metric strong{display:block;font-family:'Bebas Neue',sans-serif;font-size:clamp(36px,4vw,58px);font-weight:400;line-height:1;color:#fff;}
.wlff-case-metric span{display:block;margin-top:7px;color:rgba(255,255,255,.48);font-size:11px;line-height:1.5;letter-spacing:.06em;}
.wlff-case-visual{padding:clamp(42px,6vw,84px) 0;}
.wlff-case-frame{
  padding:10px;border:1px solid rgba(255,255,255,.13);background:#090909;
  box-shadow:0 40px 100px rgba(0,0,0,.45);
}
.wlff-case-frame img{display:block;width:100%;height:auto;background:#050505;}
.wlff-case-section{padding:clamp(72px,8vw,120px) 0;border-top:1px solid rgba(255,255,255,.08);}
.wlff-case-grid{display:grid;grid-template-columns:minmax(220px,.58fr) minmax(0,1.42fr);gap:clamp(42px,8vw,128px);}
.wlff-case-heading{font-family:'Bebas Neue',sans-serif;font-size:clamp(46px,6vw,88px);line-height:.94;font-weight:400;margin-top:14px;}
.wlff-case-copy{max-width:820px;color:rgba(255,255,255,.64);font-size:16px;line-height:1.85;}
.wlff-case-copy strong{color:#fff;font-weight:500;}
.wlff-case-scope{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.09);}
.wlff-case-scope article{padding:30px;background:#080808;}
.wlff-case-scope h3{font-family:'Bebas Neue',sans-serif;font-size:30px;font-weight:400;letter-spacing:.03em;}
.wlff-case-scope p{margin-top:12px;color:rgba(255,255,255,.56);font-size:14px;line-height:1.75;}
.wlff-case-architecture{display:flex;align-items:stretch;gap:8px;overflow-x:auto;padding:10px 0 18px;scrollbar-width:thin;}
.wlff-case-node{flex:0 0 150px;min-height:112px;padding:18px;border:1px solid rgba(255,255,255,.11);background:#090909;display:flex;flex-direction:column;justify-content:space-between;}
.wlff-case-node small{color:#8E1930;font-size:9px;letter-spacing:.16em;text-transform:uppercase;}
.wlff-case-node span{font-size:13px;line-height:1.45;color:rgba(255,255,255,.82);}
.wlff-case-arrow{align-self:center;color:#8E1930;font-size:16px;opacity:.8;}
.wlff-case-challenges{display:grid;gap:1px;background:rgba(255,255,255,.09);}
.wlff-case-challenge{display:grid;grid-template-columns:64px minmax(220px,.55fr) minmax(0,1.45fr);gap:24px;padding:28px;background:#080808;align-items:start;}
.wlff-case-challenge-num{color:#8E1930;font-size:10px;letter-spacing:.18em;}
.wlff-case-challenge h3{font-family:'Bebas Neue',sans-serif;font-size:28px;font-weight:400;line-height:1.05;}
.wlff-case-challenge p{color:rgba(255,255,255,.56);font-size:14px;line-height:1.75;}
.wlff-case-outcome{
  padding:clamp(36px,5vw,64px);border:1px solid rgba(255,255,255,.11);
  background:radial-gradient(circle at 100% 0,rgba(142,25,48,.09),transparent 36%),#080808;
}
.wlff-case-outcome p{max-width:920px;font-family:'Bebas Neue',sans-serif;font-size:clamp(34px,4.2vw,64px);line-height:1.04;}
.wlff-case-outcome p em{color:#8E1930;font-style:normal;}
.wlff-case-footer{padding:48px 0 70px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;align-items:center;gap:24px;}
.wlff-case-cta{display:flex;flex-wrap:wrap;gap:12px;}
.wlff-case-btn{display:inline-flex;padding:12px 18px;border:1px solid rgba(255,255,255,.18);color:#fff;text-decoration:none;font-size:12px;letter-spacing:.08em;}
.wlff-case-btn--primary{background:#8E1930;border-color:#8E1930;}
.wlff-case-btn:hover{border-color:#fff;}

@media(max-width:760px){
  .wlff-case-shell{width:min(100% - 32px,1380px);}
  .wlff-case-nav{padding:0 16px;min-height:62px;}
  .wlff-case-brand{width:72px;height:36px;}
  .wlff-case-brand img{width:88px;left:-8px;top:3px;}
  .wlff-case-back{display:none;}
  .wlff-case-nav-right{gap:12px;}
  .wlff-case-hero{padding-top:62px;}
  .wlff-case-title{font-size:clamp(58px,19vw,92px);}
  .wlff-case-metrics{grid-template-columns:repeat(2,1fr);}
  .wlff-case-metric:nth-child(2){border-right:0;}
  .wlff-case-metric:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.10);}
  .wlff-case-grid{grid-template-columns:1fr;gap:28px;}
  .wlff-case-scope{grid-template-columns:1fr;}
  .wlff-case-challenge{grid-template-columns:42px 1fr;gap:14px 18px;}
  .wlff-case-challenge p{grid-column:2;}
  .wlff-case-footer{align-items:flex-start;flex-direction:column;}
}
@media(prefers-reduced-motion:reduce){.wlff-case-page *{scroll-behavior:auto!important;transition:none!important;animation:none!important;}}


/* WLFF visual refinement — DNPROD editorial desktop + current mobile language. */

/* Landing flagship: keep all engineering proof, but present it as designed content rather than a table. */
#portfolio .wlff-engineering{
  border-top:0!important;
  padding:clamp(18px,2.2vw,30px) clamp(22px,3vw,46px) clamp(28px,3vw,42px)!important;
  background:
    radial-gradient(75% 90% at 88% 0%,rgba(142,25,48,.07),transparent 58%),
    linear-gradient(180deg,#080808,#060606)!important;
}
#portfolio .wlff-engineering-grid{
  gap:12px!important;
  border:0!important;
  background:transparent!important;
}
#portfolio .wlff-engineering-cell{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(242,241,237,.10)!important;
  border-radius:16px!important;
  background:
    radial-gradient(120% 95% at 18% 0%,rgba(255,255,255,.045),transparent 42%),
    linear-gradient(180deg,rgba(18,18,20,.92),rgba(8,8,9,.96))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 14px 36px rgba(0,0,0,.18)!important;
}
#portfolio .wlff-engineering-cell::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:2px;
  background:linear-gradient(180deg,#8E1930,transparent 82%);
  opacity:.78;
}
#portfolio .wlff-engineering-label{color:#8E1930!important;}
#portfolio .wlff-engineering-value{color:rgba(242,241,237,.72)!important;}
#portfolio .wlff-proof-row{gap:9px!important;margin-top:16px!important;}
#portfolio .wlff-proof{
  border-radius:10px!important;
  border-color:rgba(242,241,237,.11)!important;
  background:rgba(242,241,237,.025)!important;
  color:rgba(242,241,237,.58)!important;
}
#portfolio .port-actions .port-link{
  border-radius:12px!important;
}
#portfolio .port-actions .port-link--primary{
  background:linear-gradient(135deg,#8E1930,#8E1930)!important;
  box-shadow:0 12px 34px rgba(142,25,48,.18)!important;
}

/* Standalone case study — desktop art direction. */
.wlff-case-page{
  background:
    radial-gradient(900px 620px at 82% 8%,rgba(142,25,48,.12),transparent 64%),
    radial-gradient(700px 520px at 10% 40%,rgba(203,160,54,.045),transparent 68%),
    #050505!important;
  color:#F2F1ED!important;
}
.wlff-case-nav{
  position:sticky;
  top:0;
  z-index:40;
  min-height:72px;
  border-bottom:1px solid rgba(242,241,237,.08)!important;
  background:rgba(5,5,5,.78)!important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.wlff-case-back,.wlff-case-lang{
  transition:color .2s ease,opacity .2s ease,border-color .2s ease;
}
.wlff-case-lang{
  min-width:34px;
  text-align:center;
}
.wlff-case-lang[aria-current="page"]{
  color:#F2F1ED!important;
  border-color:#8E1930!important;
}
.wlff-case-shell{width:min(1320px,calc(100% - 64px))!important;}

@media(min-width:901px){
  .wlff-case-hero{
    min-height:760px;
    display:flex;
    align-items:center;
    padding:96px 0 88px!important;
    border-bottom:0!important;
  }
  .wlff-case-hero::before{
    content:'';
    position:absolute;
    inset:5% 4% auto auto;
    width:min(48vw,700px);
    aspect-ratio:1;
    border-radius:50%;
    background:radial-gradient(circle,rgba(142,25,48,.11),transparent 66%);
    filter:blur(10px);
    pointer-events:none;
  }
  .wlff-case-hero::after{
    right:-.02em!important;
    top:50%!important;
    font-size:clamp(220px,27vw,470px)!important;
    -webkit-text-stroke:1px rgba(242,241,237,.04)!important;
  }
  .wlff-case-hero .wlff-case-shell{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:18px 24px;
    align-items:start;
  }
  .wlff-case-kicker{grid-column:1 / 8;margin-top:8px;}
  .wlff-case-title{
    grid-column:1 / 9;
    margin:12px 0 18px!important;
    max-width:none!important;
    font-size:clamp(82px,8.2vw,132px)!important;
    letter-spacing:-.015em!important;
  }
  .wlff-case-lead{
    grid-column:1 / 8;
    max-width:760px!important;
    font-size:19px!important;
    line-height:1.72!important;
    color:rgba(242,241,237,.66)!important;
  }
  .wlff-case-role{
    grid-column:1 / 8;
    margin-top:8px!important;
    gap:9px!important;
  }
  .wlff-case-role span{
    padding:9px 12px!important;
    border-radius:11px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    background:rgba(242,241,237,.025)!important;
    color:rgba(242,241,237,.74)!important;
  }
  .wlff-case-metrics{
    grid-column:9 / -1;
    grid-row:2 / span 4;
    align-self:center;
    margin:0!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    border:0!important;
  }
  .wlff-case-metric{
    min-height:156px;
    padding:24px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 100% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(18,18,20,.88),rgba(8,8,9,.94))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.05),
      0 18px 45px rgba(0,0,0,.20)!important;
  }
  .wlff-case-metric strong{
    font-size:clamp(48px,4.2vw,64px)!important;
    color:#F2F1ED!important;
  }
  .wlff-case-metric span{
    margin-top:12px!important;
    color:rgba(242,241,237,.48)!important;
  }

  .wlff-case-visual{
    padding:20px 0 92px!important;
  }
  .wlff-case-frame{
    position:relative;
    padding:12px!important;
    overflow:hidden;
    border:1px solid rgba(242,241,237,.11)!important;
    border-radius:24px!important;
    background:
      radial-gradient(70% 90% at 10% 0%,rgba(203,160,54,.08),transparent 52%),
      linear-gradient(145deg,#11110d,#070707 68%)!important;
    box-shadow:
      0 44px 110px rgba(0,0,0,.52),
      inset 0 1px 0 rgba(255,255,255,.05)!important;
  }
  .wlff-case-frame::after{
    content:'LIVE PRODUCT / PRODUCTION';
    position:absolute;
    right:24px;
    bottom:20px;
    z-index:3;
    padding:7px 10px;
    border-radius:9px;
    border:1px solid rgba(242,241,237,.10);
    background:rgba(5,5,5,.72);
    backdrop-filter:blur(10px);
    color:rgba(242,241,237,.48);
    font-size:8px;
    letter-spacing:.18em;
  }
  .wlff-case-frame picture,
  .wlff-case-frame img{
    border-radius:16px!important;
    overflow:hidden;
  }

  .wlff-case-section{
    padding:92px 0!important;
    border-top:1px solid rgba(242,241,237,.065)!important;
  }
  .wlff-case-grid{
    grid-template-columns:minmax(240px,.62fr) minmax(0,1.38fr)!important;
    gap:clamp(56px,7vw,116px)!important;
  }
  .wlff-case-heading{
    margin-top:16px!important;
    max-width:480px;
    font-size:clamp(54px,5.4vw,82px)!important;
  }
  .wlff-case-copy{
    padding-top:28px;
    max-width:760px!important;
    font-size:17px!important;
    line-height:1.9!important;
  }
  .wlff-case-scope{
    gap:14px!important;
    background:transparent!important;
    margin-top:32px!important;
  }
  .wlff-case-scope article{
    position:relative;
    min-height:210px;
    padding:30px!important;
    overflow:hidden;
    border:1px solid rgba(242,241,237,.095);
    border-radius:20px;
    background:
      radial-gradient(120% 90% at 12% 0%,rgba(255,255,255,.045),transparent 44%),
      linear-gradient(180deg,rgba(17,17,19,.88),rgba(8,8,9,.94))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
    transition:transform .24s ease,border-color .24s ease,background .24s ease;
  }
  .wlff-case-scope article::before{
    content:'';
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:2px;
    background:linear-gradient(90deg,#8E1930,transparent 62%);
    opacity:.74;
  }
  .wlff-case-scope article:hover{
    transform:translateY(-3px);
    border-color:rgba(242,241,237,.16);
  }
  .wlff-case-scope h3{font-size:34px!important;}
  .wlff-case-scope p{font-size:14px!important;line-height:1.78!important;}

  .wlff-case-architecture{
    gap:10px!important;
    margin-top:30px!important;
    padding:6px 0 20px!important;
  }
  .wlff-case-node{
    flex-basis:158px!important;
    min-height:128px!important;
    padding:20px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(110% 90% at 14% 0%,rgba(255,255,255,.04),transparent 44%),
      #0a0a0b!important;
  }
  .wlff-case-node small{color:#8E1930!important;}
  .wlff-case-arrow{color:#8E1930!important;opacity:.68!important;}

  .wlff-case-challenges{
    gap:12px!important;
    background:transparent!important;
    margin-top:32px!important;
  }
  .wlff-case-challenge{
    grid-template-columns:74px minmax(240px,.62fr) minmax(0,1.38fr)!important;
    gap:28px!important;
    padding:30px 32px!important;
    border:1px solid rgba(242,241,237,.095);
    border-radius:20px;
    background:
      radial-gradient(80% 120% at 100% 0%,rgba(142,25,48,.055),transparent 52%),
      linear-gradient(180deg,rgba(15,15,17,.91),rgba(8,8,9,.96))!important;
  }
  .wlff-case-challenge-num{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:30px;
    border-radius:10px;
    border:1px solid rgba(142,25,48,.28);
    background:rgba(142,25,48,.08);
    color:#8E1930!important;
  }
  .wlff-case-challenge h3{font-size:31px!important;}
  .wlff-case-challenge p{font-size:14px!important;line-height:1.78!important;}

  .wlff-case-outcome{
    padding:64px!important;
    border-radius:24px!important;
    border:1px solid rgba(242,241,237,.11)!important;
    background:
      radial-gradient(60% 120% at 100% 0%,rgba(142,25,48,.14),transparent 58%),
      radial-gradient(50% 90% at 0% 100%,rgba(203,160,54,.055),transparent 62%),
      #0a0a0b!important;
    box-shadow:0 30px 90px rgba(0,0,0,.24);
  }
  .wlff-case-outcome p{max-width:1040px!important;}

  .wlff-case-footer{
    padding:52px 0 72px!important;
  }
  .wlff-case-btn{
    min-height:46px;
    align-items:center;
    justify-content:center;
    padding:13px 18px!important;
    border-radius:12px;
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
  }
  .wlff-case-btn:hover{transform:translateY(-2px);}
  .wlff-case-btn--primary{
    background:linear-gradient(135deg,#8E1930,#8E1930)!important;
    border-color:#8E1930!important;
    box-shadow:0 12px 34px rgba(142,25,48,.18);
  }
}

/* Current DNPROD mobile language: pearl text, muted burgundy, rounded glass cards. */
@media(max-width:900px){
  #portfolio .port-card.port-card--wlff{
    border-radius:22px!important;
    overflow:hidden!important;
    border-color:rgba(242,241,237,.10)!important;
    background:#080808!important;
    box-shadow:0 22px 54px rgba(0,0,0,.34)!important;
  }
  #portfolio .port-card.port-card--wlff .port-info{
    padding:24px 20px 20px!important;
    background:
      radial-gradient(85% 110% at 100% 0%,rgba(142,25,48,.09),transparent 58%),
      #09090a!important;
  }
  #portfolio .port-card.port-card--wlff .port-tag{
    color:#8E1930!important;
    -webkit-text-fill-color:#8E1930!important;
  }
  #portfolio .port-card.port-card--wlff .port-name,
  #portfolio .port-card.port-card--wlff .port-desc,
  #portfolio .port-card.port-card--wlff .port-role{
    color:#F2F1ED!important;
  }
  #portfolio .port-card.port-card--wlff .port-desc{opacity:.70;}
  #portfolio .port-card.port-card--wlff .port-role{
    letter-spacing:.015em!important;
    opacity:.82;
  }
  #portfolio .port-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  #portfolio .port-actions .port-link{
    width:100%!important;
    min-height:50px!important;
    border-radius:14px!important;
    border-color:rgba(242,241,237,.13)!important;
    background:
      radial-gradient(120% 100% at 18% 0%,rgba(255,255,255,.045),transparent 42%),
      rgba(242,241,237,.025)!important;
    color:#F2F1ED!important;
    -webkit-text-fill-color:#F2F1ED!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
  }
  #portfolio .port-actions .port-link--primary{
    border-color:rgba(142,25,48,.58)!important;
    background:
      radial-gradient(120% 100% at 20% 0%,rgba(255,255,255,.08),transparent 44%),
      linear-gradient(135deg,#8E1930,#8E1930)!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.09),
      0 12px 28px rgba(0,0,0,.22)!important;
  }

  #portfolio .wlff-engineering{
    padding:14px 16px 20px!important;
    border-top:0!important;
    background:#09090a!important;
  }
  #portfolio .wlff-engineering-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    border:0!important;
    background:transparent!important;
  }
  #portfolio .wlff-engineering-cell{
    min-height:0!important;
    padding:18px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.065),transparent 42%),
      linear-gradient(180deg,rgba(25,25,27,.74),rgba(9,9,10,.84))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.075),
      0 12px 28px rgba(0,0,0,.20)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }
  #portfolio .wlff-engineering-cell::before{display:none!important;}
  #portfolio .wlff-engineering-label{
    color:#8E1930!important;
    -webkit-text-fill-color:#8E1930!important;
  }
  #portfolio .wlff-engineering-value{
    color:#F2F1ED!important;
    opacity:.74;
  }
  #portfolio .wlff-proof-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-top:12px!important;
  }
  #portfolio .wlff-proof{
    justify-content:center!important;
    min-width:0!important;
    min-height:38px!important;
    padding:9px 8px!important;
    border-radius:12px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    background:rgba(242,241,237,.025)!important;
    color:#F2F1ED!important;
    -webkit-text-fill-color:#F2F1ED!important;
    font-size:8px!important;
    letter-spacing:.08em!important;
    text-align:center;
  }
  #portfolio .wlff-proof:last-child{grid-column:1 / -1;}

  .wlff-case-page{
    background:
      radial-gradient(125% 48% at 100% 0%,rgba(142,25,48,.12),transparent 62%),
      #050505!important;
    color:#F2F1ED!important;
  }
  .wlff-case-nav{
    min-height:60px!important;
    padding:0 16px!important;
    background:rgba(5,5,5,.82)!important;
    border-bottom:1px solid rgba(242,241,237,.07)!important;
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }
  .wlff-case-shell{
    width:min(100% - 28px,1380px)!important;
  }
  .wlff-case-back{display:none!important;}
  .wlff-case-nav-right{gap:10px!important;}
  .wlff-case-lang{
    padding:5px 7px;
    border-radius:8px;
    border:1px solid transparent;
    color:rgba(242,241,237,.56)!important;
  }
  .wlff-case-lang[aria-current="page"]{
    padding-bottom:5px!important;
    border:1px solid rgba(142,25,48,.34)!important;
    background:rgba(142,25,48,.08)!important;
    color:#F2F1ED!important;
  }

  .wlff-case-hero{
    padding:52px 0 34px!important;
    border-bottom:0!important;
    overflow:hidden;
  }
  .wlff-case-hero::after{
    top:31%!important;
    right:-.08em!important;
    font-size:clamp(130px,45vw,210px)!important;
    -webkit-text-stroke:1px rgba(242,241,237,.035)!important;
  }
  .wlff-case-kicker,
  .wlff-case-section-label{
    color:#8E1930!important;
    -webkit-text-fill-color:#8E1930!important;
    font-size:9px!important;
    letter-spacing:.22em!important;
  }
  .wlff-case-title{
    margin:14px 0 18px!important;
    font-size:clamp(54px,16.5vw,78px)!important;
    line-height:.88!important;
    letter-spacing:-.012em!important;
  }
  .wlff-case-title em{color:#F2F1ED!important;}
  .wlff-case-lead{
    max-width:none!important;
    font-size:15px!important;
    line-height:1.72!important;
    color:rgba(242,241,237,.70)!important;
  }
  .wlff-case-role{
    margin-top:20px!important;
    gap:8px!important;
  }
  .wlff-case-role span{
    padding:8px 10px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:12px!important;
    background:
      radial-gradient(120% 100% at 16% 0%,rgba(255,255,255,.055),transparent 44%),
      rgba(242,241,237,.025)!important;
    color:rgba(242,241,237,.72)!important;
    font-size:9px!important;
    line-height:1.35!important;
  }
  .wlff-case-metrics{
    margin-top:24px!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    border:0!important;
  }
  .wlff-case-metric{
    min-height:112px;
    padding:16px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.065),transparent 42%),
      linear-gradient(180deg,rgba(25,25,27,.74),rgba(9,9,10,.84))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.075),
      0 12px 30px rgba(0,0,0,.20)!important;
  }
  .wlff-case-metric strong{
    font-size:38px!important;
    color:#F2F1ED!important;
  }
  .wlff-case-metric span{
    margin-top:8px!important;
    color:rgba(242,241,237,.50)!important;
    font-size:9px!important;
    line-height:1.45!important;
  }

  .wlff-case-visual{
    padding:12px 0 42px!important;
  }
  .wlff-case-frame{
    padding:7px!important;
    overflow:hidden;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:20px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      #0a0a0b!important;
    box-shadow:0 20px 48px rgba(0,0,0,.30)!important;
  }
  .wlff-case-frame picture,
  .wlff-case-frame img{
    display:block;
    border-radius:14px!important;
    overflow:hidden;
  }

  .wlff-case-section{
    padding:28px 0!important;
    border-top:0!important;
  }
  .wlff-case-section > .wlff-case-shell.wlff-case-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:16px!important;
    padding:20px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:20px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(20,20,22,.72),rgba(8,8,9,.82))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.06),
      0 14px 34px rgba(0,0,0,.16)!important;
  }
  .wlff-case-heading{
    margin-top:9px!important;
    font-size:clamp(38px,12vw,56px)!important;
    line-height:.94!important;
  }
  .wlff-case-copy{
    padding:0!important;
    font-size:14px!important;
    line-height:1.78!important;
    color:rgba(242,241,237,.66)!important;
  }

  .wlff-case-scope{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:18px!important;
    background:transparent!important;
  }
  .wlff-case-scope article{
    min-height:0!important;
    padding:19px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(22,22,24,.72),rgba(8,8,9,.84))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.06),
      0 12px 28px rgba(0,0,0,.16)!important;
  }
  .wlff-case-scope h3{
    font-size:29px!important;
    color:#F2F1ED!important;
  }
  .wlff-case-scope p{
    margin-top:8px!important;
    color:rgba(242,241,237,.62)!important;
    font-size:13px!important;
    line-height:1.7!important;
  }

  .wlff-case-architecture{
    gap:10px!important;
    margin-top:18px!important;
    padding:2px 0 10px!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .wlff-case-architecture::-webkit-scrollbar{display:none;}
  .wlff-case-node{
    flex:0 0 148px!important;
    min-height:116px!important;
    padding:16px!important;
    scroll-snap-align:start;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(22,22,24,.72),rgba(8,8,9,.84))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.055)!important;
  }
  .wlff-case-node small{color:#8E1930!important;}
  .wlff-case-node span{color:rgba(242,241,237,.78)!important;}
  .wlff-case-arrow{color:#8E1930!important;opacity:.58!important;}

  .wlff-case-challenges{
    display:grid!important;
    gap:12px!important;
    margin-top:18px!important;
    background:transparent!important;
  }
  .wlff-case-challenge{
    display:grid!important;
    grid-template-columns:auto 1fr!important;
    gap:12px 14px!important;
    padding:19px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(22,22,24,.72),rgba(8,8,9,.84))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.055),
      0 12px 28px rgba(0,0,0,.16)!important;
  }
  .wlff-case-challenge-num{
    grid-column:1;
    grid-row:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:28px;
    border-radius:10px;
    border:1px solid rgba(142,25,48,.28);
    background:rgba(142,25,48,.08);
    color:#8E1930!important;
  }
  .wlff-case-challenge h3{
    grid-column:2;
    grid-row:1;
    align-self:center;
    font-size:27px!important;
    color:#F2F1ED!important;
  }
  .wlff-case-challenge p{
    grid-column:1 / -1!important;
    grid-row:2;
    color:rgba(242,241,237,.62)!important;
    font-size:13px!important;
    line-height:1.72!important;
  }

  .wlff-case-outcome{
    padding:24px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:20px!important;
    background:
      radial-gradient(90% 120% at 100% 0%,rgba(142,25,48,.13),transparent 56%),
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.045),transparent 42%),
      #0a0a0b!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.055)!important;
  }
  .wlff-case-outcome p{
    font-size:clamp(32px,10vw,46px)!important;
    line-height:1.03!important;
  }
  .wlff-case-outcome p em{color:#8E1930!important;}

  .wlff-case-footer{
    width:min(100% - 28px,1380px)!important;
    padding:22px 0 36px!important;
    border-top:0!important;
    align-items:stretch!important;
    flex-direction:column!important;
    gap:16px!important;
  }
  .wlff-case-cta{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%;
  }
  .wlff-case-btn{
    width:100%;
    min-height:50px;
    align-items:center;
    justify-content:center;
    padding:13px 16px!important;
    border:1px solid rgba(242,241,237,.12)!important;
    border-radius:14px!important;
    background:rgba(242,241,237,.025)!important;
    color:#F2F1ED!important;
    font-size:10px!important;
    letter-spacing:.10em!important;
  }
  .wlff-case-btn--primary{
    border-color:rgba(142,25,48,.58)!important;
    background:
      radial-gradient(120% 100% at 18% 0%,rgba(255,255,255,.08),transparent 44%),
      linear-gradient(135deg,#8E1930,#8E1930)!important;
    box-shadow:0 12px 28px rgba(0,0,0,.20)!important;
  }
}

@media(max-width:520px){
  .wlff-case-shell{width:min(100% - 24px,1380px)!important;}
  .wlff-case-section > .wlff-case-shell.wlff-case-grid{padding:18px!important;}
  .wlff-case-title{font-size:clamp(50px,16vw,70px)!important;}
  .wlff-case-metric{min-height:106px;padding:14px!important;}
  .wlff-case-metric strong{font-size:34px!important;}
  .wlff-case-footer{width:min(100% - 24px,1380px)!important;}
}


/* WLFF case footer geometry — isolate from the global DNPROD footer skin. */
body.wlff-case-page footer.wlff-case-footer{
  box-sizing:border-box!important;
  width:min(1320px,calc(100% - 64px))!important;
  max-width:1320px!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  margin:24px auto 30px!important;
  padding:18px 20px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  flex-wrap:nowrap!important;
  border:1px solid rgba(242,241,237,.09)!important;
  border-radius:18px!important;
  background:
    radial-gradient(80% 120% at 100% 0%,rgba(142,25,48,.07),transparent 58%),
    linear-gradient(135deg,rgba(16,16,18,.94),rgba(10,8,9,.96))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 18px 48px rgba(0,0,0,.20)!important;
  overflow:hidden!important;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-section-label{
  flex:0 1 auto;
  margin:0!important;
  white-space:nowrap;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-cta{
  flex:0 0 auto;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  width:auto!important;
  margin:0!important;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-btn{
  width:auto!important;
  min-width:0!important;
  min-height:46px!important;
  margin:0!important;
  padding:12px 18px!important;
}

@media(max-width:900px){
  body.wlff-case-page footer.wlff-case-footer{
    width:calc(100% - 24px)!important;
    max-width:none!important;
    margin:14px 12px 20px!important;
    padding:14px!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:12px!important;
    border-radius:18px!important;
  }
  body.wlff-case-page footer.wlff-case-footer .wlff-case-section-label{
    white-space:normal;
    padding:2px 2px 0;
  }
  body.wlff-case-page footer.wlff-case-footer .wlff-case-cta{
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  body.wlff-case-page footer.wlff-case-footer .wlff-case-btn{
    width:100%!important;
    min-height:48px!important;
    padding:12px 14px!important;
  }
}

@media(max-width:520px){
  body.wlff-case-page footer.wlff-case-footer{
    width:calc(100% - 16px)!important;
    margin:12px 8px 16px!important;
    padding:12px!important;
    gap:10px!important;
    border-radius:17px!important;
  }
}


/* WLFF geometry lock — align the case with DNPROD's sharp editorial language.
   Content, hierarchy, gradients, shadows and responsive structure stay unchanged. */

/* Landing flagship — desktop */
@media(min-width:901px){
  #portfolio .port-card.port-card--wlff{
    border-radius:0!important;
  }
  #portfolio .port-card.port-card--wlff .port-img,
  #portfolio .port-card.port-card--wlff .port-picture,
  #portfolio .port-card.port-card--wlff .port-img img{
    border-radius:0!important;
  }
  #portfolio .wlff-engineering-cell{
    border-radius:3px!important;
  }
  #portfolio .wlff-proof{
    border-radius:4px!important;
  }
  #portfolio .port-actions .port-link{
    border-radius:6px!important;
  }
}

/* Standalone case study — desktop */
@media(min-width:901px){
  .wlff-case-role span{
    border-radius:4px!important;
  }
  .wlff-case-metric{
    border-radius:4px!important;
  }
  .wlff-case-frame{
    border-radius:4px!important;
  }
  .wlff-case-frame picture,
  .wlff-case-frame img{
    border-radius:2px!important;
  }
  .wlff-case-frame::after{
    border-radius:4px!important;
  }
  .wlff-case-scope article{
    border-radius:4px!important;
  }
  .wlff-case-node{
    border-radius:4px!important;
  }
  .wlff-case-challenge{
    border-radius:4px!important;
  }
  .wlff-case-challenge-num{
    border-radius:4px!important;
  }
  .wlff-case-outcome{
    border-radius:4px!important;
  }
  body.wlff-case-page footer.wlff-case-footer{
    border-radius:4px!important;
  }
  .wlff-case-btn{
    border-radius:6px!important;
  }
  .wlff-case-lang{
    border-radius:3px!important;
  }
}

/* Landing flagship — mobile */
@media(max-width:900px){
  #portfolio .port-card.port-card--wlff{
    border-radius:6px!important;
  }
  #portfolio .port-card.port-card--wlff .port-img{
    border-radius:4px!important;
  }
  #portfolio .port-card.port-card--wlff .port-picture,
  #portfolio .port-card.port-card--wlff .port-img img{
    border-radius:2px!important;
  }
  #portfolio .wlff-engineering-cell{
    border-radius:8px!important;
  }
  #portfolio .wlff-proof{
    border-radius:6px!important;
  }
  #portfolio .port-actions .port-link{
    border-radius:8px!important;
  }
}

/* Standalone case study — mobile */
@media(max-width:900px){
  .wlff-case-lang,
  .wlff-case-role span{
    border-radius:6px!important;
  }
  .wlff-case-metric{
    border-radius:8px!important;
  }
  .wlff-case-frame{
    border-radius:6px!important;
  }
  .wlff-case-frame picture,
  .wlff-case-frame img{
    border-radius:4px!important;
  }
  .wlff-case-section > .wlff-case-shell.wlff-case-grid{
    border-radius:6px!important;
  }
  .wlff-case-scope article{
    border-radius:8px!important;
  }
  .wlff-case-node{
    border-radius:8px!important;
  }
  .wlff-case-challenge{
    border-radius:8px!important;
  }
  .wlff-case-challenge-num{
    border-radius:6px!important;
  }
  .wlff-case-outcome{
    border-radius:6px!important;
  }
  body.wlff-case-page footer.wlff-case-footer{
    border-radius:6px!important;
  }
  .wlff-case-btn{
    border-radius:8px!important;
  }
}

@media(max-width:520px){
  #portfolio .port-card.port-card--wlff{
    border-radius:5px!important;
  }
  #portfolio .wlff-engineering-cell{
    border-radius:7px!important;
  }
  .wlff-case-metric,
  .wlff-case-scope article,
  .wlff-case-node,
  .wlff-case-challenge{
    border-radius:7px!important;
  }
  body.wlff-case-page footer.wlff-case-footer{
    border-radius:5px!important;
  }
}


/* Targeted refinement — architecture density + outcome hierarchy. */
.wlff-case-architecture{
  align-items:stretch!important;
}
.wlff-case-node{
  flex:0 0 224px!important;
  min-height:188px!important;
  padding:20px!important;
  gap:18px!important;
  justify-content:flex-start!important;
}
.wlff-case-node small{
  display:block;
  min-height:14px;
  color:#8E1930!important;
  font-size:8px!important;
  line-height:1.3!important;
  letter-spacing:.18em!important;
}
.wlff-case-node strong{
  display:block;
  margin-top:auto;
  color:#F2F1ED;
  font-size:16px;
  line-height:1.25;
  font-weight:550;
}
.wlff-case-node span{
  display:block;
  margin-top:8px;
  color:rgba(242,241,237,.54)!important;
  font-size:11px!important;
  line-height:1.62!important;
}
.wlff-case-arrow{
  flex:0 0 24px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.wlff-case-outcome{
  display:grid;
  grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);
  gap:26px 46px;
  align-items:start;
}
.wlff-case-outcome-label{
  grid-column:1 / -1;
  margin:0!important;
}
.wlff-case-outcome h2{
  grid-column:1;
  margin:0!important;
  max-width:560px;
  color:#F2F1ED;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(54px,5.5vw,86px);
  line-height:.92;
  font-weight:400;
}
.wlff-case-outcome-flow{
  grid-column:2;
  display:grid;
  grid-template-columns:repeat(7,max-content);
  align-items:center;
  justify-content:start;
  gap:12px;
  margin-top:6px;
}
.wlff-case-outcome-flow span{
  display:inline-flex;
  min-height:46px;
  align-items:center;
  justify-content:center;
  padding:11px 14px;
  border:1px solid rgba(242,241,237,.11);
  border-radius:12px;
  background:
    radial-gradient(120% 100% at 18% 0%,rgba(255,255,255,.05),transparent 44%),
    rgba(242,241,237,.018);
  color:#F2F1ED;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.wlff-case-outcome-flow i{
  color:#8E1930;
  font-style:normal;
  font-size:18px;
  opacity:.72;
}
.wlff-case-outcome-copy{
  grid-column:2;
  margin:0!important;
  max-width:760px!important;
  color:rgba(242,241,237,.58)!important;
  font-family:inherit!important;
  font-size:14px!important;
  line-height:1.78!important;
}

@media(max-width:900px){
  .wlff-case-node{
    flex:0 0 236px!important;
    min-height:184px!important;
    padding:18px!important;
    gap:14px!important;
  }
  .wlff-case-node strong{
    font-size:15px!important;
  }
  .wlff-case-node span{
    font-size:11px!important;
    line-height:1.58!important;
  }

  .wlff-case-outcome{
    display:block!important;
    padding:22px!important;
  }
  .wlff-case-outcome-label{
    margin-bottom:12px!important;
  }
  .wlff-case-outcome h2{
    max-width:none!important;
    font-size:clamp(42px,12.2vw,62px)!important;
    line-height:.94!important;
  }
  .wlff-case-outcome-flow{
    display:grid!important;
    grid-template-columns:1fr auto 1fr!important;
    gap:8px!important;
    margin-top:22px!important;
  }
  .wlff-case-outcome-flow span{
    min-width:0;
    min-height:42px;
    padding:10px 8px;
    font-size:9px;
  }
  .wlff-case-outcome-flow i{
    font-size:14px;
  }
  .wlff-case-outcome-flow span:nth-of-type(3){
    grid-column:1;
    grid-row:2;
  }
  .wlff-case-outcome-flow i:nth-of-type(3){
    display:none;
  }
  .wlff-case-outcome-flow span:nth-of-type(4){
    grid-column:3;
    grid-row:2;
  }
  .wlff-case-outcome-flow i:nth-of-type(2){
    grid-column:2;
    grid-row:2;
  }
  .wlff-case-outcome-copy{
    margin-top:20px!important;
    max-width:none!important;
    font-size:12px!important;
    line-height:1.72!important;
  }
}


/* Final CTA panel refinement — WLFF. Scope: footer only. */
body.wlff-case-page footer.wlff-case-footer{
  width:min(1180px,calc(100% - 48px))!important;
  max-width:1180px!important;
  margin:34px auto 28px!important;
  padding:22px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  gap:18px!important;
  border:1px solid rgba(242,241,237,.105)!important;
  border-radius:4px!important;
  background:
    radial-gradient(74% 120% at 100% 0%,rgba(142,25,48,.10),transparent 58%),
    radial-gradient(90% 110% at 0% 100%,rgba(255,255,255,.018),transparent 60%),
    linear-gradient(180deg,rgba(15,15,17,.97),rgba(8,8,9,.985))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 20px 54px rgba(0,0,0,.24)!important;
  overflow:hidden!important;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-section-label{
  margin:0!important;
  padding:0!important;
  color:rgba(142,25,48,.82)!important;
  font-size:9px!important;
  line-height:1.2!important;
  letter-spacing:.28em!important;
  text-transform:uppercase!important;
  white-space:normal!important;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-cta{
  width:100%!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)!important;
  gap:12px!important;
  align-items:stretch!important;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-btn{
  width:100%!important;
  min-width:0!important;
  min-height:62px!important;
  margin:0!important;
  padding:15px 18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(242,241,237,.12)!important;
  border-radius:6px!important;
  background:
    radial-gradient(120% 100% at 20% 0%,rgba(255,255,255,.04),transparent 46%),
    rgba(242,241,237,.018)!important;
  color:#F2F1ED!important;
  font-size:10px!important;
  font-weight:600!important;
  line-height:1!important;
  letter-spacing:.13em!important;
  text-align:center!important;
  text-transform:uppercase!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease!important;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-btn:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(242,241,237,.22)!important;
  background:
    radial-gradient(120% 100% at 20% 0%,rgba(255,255,255,.065),transparent 46%),
    rgba(242,241,237,.028)!important;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-btn--primary{
  border-color:rgba(142,25,48,.76)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.11) 0%,rgba(255,255,255,.025) 28%,rgba(255,255,255,0) 54%),
    #8E1930!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(0,0,0,.20),
    0 12px 28px rgba(0,0,0,.20)!important;
}
body.wlff-case-page footer.wlff-case-footer .wlff-case-btn--primary:hover{
  border-color:rgba(242,241,237,.24)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,.035) 30%,rgba(255,255,255,0) 56%),
    #8E1930!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 14px 30px rgba(0,0,0,.22)!important;
}

@media(max-width:900px){
  body.wlff-case-page footer.wlff-case-footer{
    width:calc(100% - 16px)!important;
    max-width:none!important;
    margin:16px 8px 20px!important;
    padding:16px!important;
    gap:14px!important;
    border-radius:8px!important;
  }
  body.wlff-case-page footer.wlff-case-footer .wlff-case-section-label{
    padding:0 1px!important;
    font-size:8px!important;
    letter-spacing:.24em!important;
  }
  body.wlff-case-page footer.wlff-case-footer .wlff-case-cta{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  body.wlff-case-page footer.wlff-case-footer .wlff-case-btn{
    min-height:56px!important;
    padding:13px 14px!important;
    border-radius:8px!important;
    font-size:9px!important;
    letter-spacing:.12em!important;
  }
  body.wlff-case-page footer.wlff-case-footer .wlff-case-btn--primary{
    min-height:64px!important;
  }
}


/* Outcome v3 — editorial admission rail. */
.wlff-case-outcome{
  display:block!important;
  padding:clamp(34px,4.5vw,56px)!important;
  border:1px solid rgba(242,241,237,.10)!important;
  border-radius:4px!important;
  background:
    radial-gradient(72% 110% at 100% 0%,rgba(142,25,48,.07),transparent 60%),
    linear-gradient(180deg,rgba(14,14,16,.985),rgba(8,8,9,.995))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
}
.wlff-case-outcome-label{
  margin:0 0 24px!important;
}
.wlff-outcome-editorial{
  display:grid;
  grid-template-columns:minmax(0,.74fr) minmax(0,1.26fr);
  gap:clamp(40px,6vw,86px);
  align-items:start;
}
.wlff-outcome-editorial-copy{
  min-width:0;
  padding-top:6px;
}
.wlff-outcome-editorial-copy h2{
  margin:0!important;
  max-width:500px;
  color:#F2F1ED!important;
  font-family:'Bebas Neue',sans-serif!important;
  font-size:clamp(56px,5.8vw,88px)!important;
  line-height:.91!important;
  font-weight:400!important;
  letter-spacing:-.012em!important;
}
.wlff-outcome-editorial-copy p{
  margin:24px 0 0!important;
  max-width:520px!important;
  color:rgba(242,241,237,.56)!important;
  font-family:inherit!important;
  font-size:14px!important;
  line-height:1.82!important;
}
.wlff-outcome-rail{
  min-width:0;
  border-top:1px solid rgba(242,241,237,.12);
}
.wlff-outcome-rail-head{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid rgba(242,241,237,.08);
}
.wlff-outcome-rail-head span{
  color:#F2F1ED;
  font-size:10px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.wlff-outcome-rail-head small{
  color:rgba(242,241,237,.32);
  font-size:8px;
  letter-spacing:.14em;
}
.wlff-outcome-rail-list{
  list-style:none;
  margin:0;
  padding:0;
}
.wlff-outcome-rail-list li{
  min-height:86px;
  display:grid;
  grid-template-columns:42px minmax(180px,.9fr) minmax(180px,1.1fr);
  gap:16px;
  align-items:center;
  position:relative;
  border-bottom:1px solid rgba(242,241,237,.075);
}
.wlff-outcome-rail-list li::before{
  content:'';
  position:absolute;
  left:20px;
  top:0;
  bottom:0;
  width:1px;
  background:rgba(142,25,48,.20);
}
.wlff-outcome-rail-list li:first-child::before{top:50%;}
.wlff-outcome-rail-list li:last-child::before{bottom:50%;}
.wlff-outcome-index{
  position:relative;
  z-index:1;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid rgba(142,25,48,.36);
  background:#0b0b0c;
  color:#8E1930;
  font-size:8px;
  letter-spacing:.12em;
}
.wlff-outcome-rail-list div{
  min-width:0;
}
.wlff-outcome-rail-list div small{
  display:block;
  margin-bottom:5px;
  color:rgba(142,25,48,.86);
  font-size:7px;
  letter-spacing:.18em;
}
.wlff-outcome-rail-list strong{
  display:block;
  color:#F2F1ED;
  font-size:15px;
  line-height:1.28;
  font-weight:550;
}
.wlff-outcome-rail-list li>p{
  margin:0!important;
  max-width:none!important;
  color:rgba(242,241,237,.42)!important;
  font-family:inherit!important;
  font-size:10px!important;
  line-height:1.5!important;
}
.wlff-outcome-recoveryline{
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:16px;
  align-items:center;
  min-height:58px;
  padding-top:14px;
}
.wlff-outcome-recoveryline>span{
  color:#8E1930;
  font-size:8px;
  font-weight:600;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.wlff-outcome-recoveryline p{
  margin:0!important;
  max-width:none!important;
  color:rgba(242,241,237,.38)!important;
  font-family:inherit!important;
  font-size:9px!important;
  line-height:1.5!important;
}
.wlff-outcome-recoveryline i{
  color:rgba(142,25,48,.70);
  font-style:normal;
  padding:0 4px;
}

@media(max-width:900px){
  .wlff-case-outcome{
    padding:20px!important;
    border-radius:8px!important;
  }
  .wlff-case-outcome-label{
    margin-bottom:16px!important;
  }
  .wlff-outcome-editorial{
    grid-template-columns:1fr!important;
    gap:26px!important;
  }
  .wlff-outcome-editorial-copy h2{
    max-width:none!important;
    font-size:clamp(44px,12vw,62px)!important;
    line-height:.93!important;
  }
  .wlff-outcome-editorial-copy p{
    margin-top:16px!important;
    max-width:none!important;
    font-size:12px!important;
    line-height:1.72!important;
  }
  .wlff-outcome-rail-head{
    min-height:48px!important;
    align-items:flex-start;
    flex-direction:column;
    justify-content:center;
    gap:3px;
  }
  .wlff-outcome-rail-list li{
    min-height:82px!important;
    grid-template-columns:36px minmax(0,1fr)!important;
    gap:10px!important;
    padding:10px 0!important;
  }
  .wlff-outcome-rail-list li::before{
    left:14px!important;
  }
  .wlff-outcome-index{
    width:28px!important;
    height:28px!important;
  }
  .wlff-outcome-rail-list li>p{
    grid-column:2!important;
    margin-top:-4px!important;
    font-size:9px!important;
  }
  .wlff-outcome-recoveryline{
    grid-template-columns:1fr!important;
    gap:8px!important;
    min-height:0!important;
    padding-top:14px!important;
  }
  .wlff-outcome-recoveryline p{
    font-size:8px!important;
    line-height:1.65!important;
  }
}




/* Outcome label spacing — external section label. */
body.wlff-case-page .wlff-case-section > .wlff-case-shell > .wlff-case-outcome-label{
  margin:0 0 28px!important;
}
@media(max-width:900px){
  body.wlff-case-page .wlff-case-section > .wlff-case-shell > .wlff-case-outcome-label{
    margin-bottom:18px!important;
  }
}

/* DNPROD — AurumTrade flagship + case study.
   Geometry follows the current WLFF flagship system.
   Palette stays DNPROD black/pearl with the existing AurumTrade green signal. */

:root{
  --aurum-red:#8E1930;
  --aurum-red-hi:#8E1930;
  --aurum-pearl:#F2F1ED;
  --aurum-bg:#050505;
  --aurum-panel:#080808;
  --aurum-line:rgba(242,241,237,.10);
}

/* Selected Work — same flagship geometry as WLFF. */
@media(min-width:901px){
  #portfolio .port-card.port-card--aurumtrade{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:minmax(0,1.08fr) minmax(400px,.92fr)!important;
    align-items:start!important;
    min-height:0!important;
    position:relative!important;
    border-color:rgba(255,255,255,.16)!important;
    background:#070707!important;
  }
  #portfolio .port-card.port-card--aurumtrade::before{
    content:'FLAGSHIP / SOLO-BUILT PRODUCT';
    position:absolute;
    top:18px;
    right:22px;
    z-index:5;
    color:rgba(255,255,255,.38);
    font-size:8px;
    letter-spacing:.3em;
  }
  #portfolio .port-card.port-card--aurumtrade .port-img{
    aspect-ratio:16/9!important;
    height:auto!important;
    min-height:0!important;
    align-self:start!important;
    padding:0!important;
    background:
      radial-gradient(circle at 18% 12%,rgba(142,25,48,.10),transparent 48%),
      #050505!important;
  }
  #portfolio .port-card.port-card--aurumtrade .port-picture{
    display:block!important;
    width:100%!important;
    height:100%!important;
  }
  #portfolio .port-card.port-card--aurumtrade .port-img img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center top!important;
    border-radius:0!important;
    filter:none!important;
    transform:none!important;
  }
  #portfolio .port-card.port-card--aurumtrade .port-info{
    min-height:100%!important;
    padding:clamp(32px,3.2vw,48px)!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    background:
      radial-gradient(circle at 100% 0,rgba(142,25,48,.10),transparent 36%),
      linear-gradient(180deg,#0b0b0b,#070707)!important;
  }
  #portfolio .port-card.port-card--aurumtrade .port-name{
    max-width:650px;
    font-size:clamp(46px,4.7vw,76px)!important;
    line-height:.92!important;
  }
  #portfolio .port-card.port-card--aurumtrade .port-desc{
    max-width:650px;
    font-size:clamp(15px,1.15vw,18px)!important;
    color:rgba(255,255,255,.68)!important;
  }
}

/* Engineering proof mirrors WLFF composition, with AurumTrade green only as a signal. */
#portfolio .aurum-engineering{
  grid-column:1 / -1!important;
  border-top:0!important;
  padding:clamp(18px,2.2vw,30px) clamp(22px,3vw,46px) clamp(28px,3vw,42px)!important;
  background:
    radial-gradient(75% 90% at 88% 0%,rgba(142,25,48,.07),transparent 58%),
    linear-gradient(180deg,#080808,#060606)!important;
}
#portfolio .aurum-engineering-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px!important;
  border:0!important;
  background:transparent!important;
}
#portfolio .aurum-engineering-cell{
  position:relative;
  min-width:0;
  overflow:hidden;
  padding:22px 24px 24px;
  border:1px solid rgba(242,241,237,.10)!important;
  border-radius:16px!important;
  background:
    radial-gradient(120% 95% at 18% 0%,rgba(255,255,255,.045),transparent 42%),
    linear-gradient(180deg,rgba(18,18,20,.92),rgba(8,8,9,.96))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 14px 36px rgba(0,0,0,.18)!important;
}
#portfolio .aurum-engineering-cell::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:2px;
  background:linear-gradient(180deg,var(--aurum-red),transparent 82%);
  opacity:.78;
}
#portfolio .aurum-engineering-label{
  margin:0 0 10px;
  color:var(--aurum-red-hi)!important;
  font-size:9px;
  line-height:1.2;
  letter-spacing:.24em;
  text-transform:uppercase;
}
#portfolio .aurum-engineering-value{
  margin:0;
  color:rgba(242,241,237,.72)!important;
  font-size:13px;
  line-height:1.65;
}
#portfolio .aurum-proof-row{
  display:flex;
  flex-wrap:wrap;
  gap:9px!important;
  margin-top:16px!important;
}
#portfolio .aurum-proof{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 11px;
  border:1px solid rgba(242,241,237,.11)!important;
  border-radius:10px!important;
  background:rgba(242,241,237,.025)!important;
  color:rgba(242,241,237,.58)!important;
  font-size:9px;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
}
#portfolio .port-card--aurumtrade .port-tag{
  color:var(--aurum-red-hi)!important;
  -webkit-text-fill-color:var(--aurum-red-hi)!important;
}
#portfolio .port-card--aurumtrade .port-role{
  color:rgba(255,255,255,.86)!important;
}
#portfolio .port-card--aurumtrade .port-actions .port-link{
  border-radius:12px!important;
}
#portfolio .port-card--aurumtrade .port-actions .port-link--primary{
  border-color:rgba(142,25,48,.88)!important;
  background:linear-gradient(180deg,#8E1930 0%,#8E1930 52%,#8E1930 100%)!important;
  color:#fff!important;
  box-shadow:0 12px 34px rgba(142,25,48,.18)!important;
}
#portfolio .port-card--aurumtrade .port-actions .port-link--primary:hover{
  border-color:#8E1930!important;
  background:linear-gradient(180deg,#8E1930 0%,#8E1930 52%,#8E1930 100%)!important;
  box-shadow:0 14px 38px rgba(142,25,48,.26)!important;
}

/* Standalone AurumTrade case — DNPROD / WLFF editorial geometry. */
.aurum-case-page{
  margin:0;
  background:
    radial-gradient(900px 620px at 82% 8%,rgba(142,25,48,.12),transparent 64%),
    radial-gradient(700px 520px at 10% 40%,rgba(142,25,48,.035),transparent 68%),
    #050505!important;
  color:var(--aurum-pearl)!important;
}
.aurum-case-page *{box-sizing:border-box;}
.aurum-case-page a:focus-visible{outline:2px solid var(--aurum-red-hi);outline-offset:4px;}

.aurum-case-nav{
  position:sticky;
  top:0;
  z-index:40;
  min-height:72px;
  padding:0 clamp(20px,4vw,56px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-bottom:1px solid rgba(242,241,237,.08)!important;
  background:rgba(5,5,5,.78)!important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.aurum-case-brand{display:block;width:126px;height:38px;position:relative;overflow:hidden;}
.aurum-case-brand img{position:absolute;width:152px;max-width:none;left:-14px;top:-6px;display:block;}
.aurum-case-nav-right{display:flex;align-items:center;gap:18px;}
.aurum-case-back,.aurum-case-lang{
  color:rgba(242,241,237,.62);
  text-decoration:none;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  transition:color .2s ease,opacity .2s ease,border-color .2s ease;
}
.aurum-case-back:hover,.aurum-case-lang:hover{color:#fff;}
.aurum-case-lang{min-width:34px;text-align:center;}
.aurum-case-lang[aria-current="page"]{
  color:var(--aurum-pearl)!important;
  border-bottom:1px solid var(--aurum-red)!important;
  padding-bottom:3px;
}
.aurum-case-shell{width:min(1320px,calc(100% - 64px));margin:0 auto;}

.aurum-case-kicker,.aurum-case-section-label{
  margin:0;
  color:var(--aurum-red-hi);
  font-size:10px;
  letter-spacing:.28em;
  text-transform:uppercase;
}
.aurum-case-hero{
  position:relative;
  overflow:hidden;
  min-height:760px;
  display:flex;
  align-items:center;
  padding:96px 0 88px;
  border-bottom:0;
}
.aurum-case-hero::before{
  content:'';
  position:absolute;
  inset:5% 4% auto auto;
  width:min(48vw,700px);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(142,25,48,.11),transparent 66%);
  filter:blur(10px);
  pointer-events:none;
}
.aurum-case-hero::after{
  content:'AT';
  position:absolute;
  right:-.02em;
  top:50%;
  transform:translateY(-50%);
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(220px,27vw,470px);
  line-height:.75;
  color:transparent;
  -webkit-text-stroke:1px rgba(242,241,237,.04);
  pointer-events:none;
}
.aurum-case-hero .aurum-case-shell{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:18px 24px;
  align-items:start;
}
.aurum-case-kicker{grid-column:1 / 8;margin-top:8px;}
.aurum-case-title-row{display:contents;}
.aurum-case-title{
  grid-column:1 / 9;
  margin:12px 0 18px;
  max-width:none;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(82px,8.2vw,132px);
  line-height:.82;
  font-weight:400;
  letter-spacing:-.015em;
}
.aurum-case-title span{color:var(--aurum-red-hi);}
.aurum-case-index{display:none;}
.aurum-case-lead{
  grid-column:1 / 8;
  max-width:760px;
  margin:0;
  color:rgba(242,241,237,.66);
  font-size:19px;
  line-height:1.72;
}
.aurum-case-role{
  grid-column:1 / 8;
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}
.aurum-case-role span{
  padding:9px 12px;
  border:1px solid rgba(242,241,237,.10);
  border-radius:11px;
  background:rgba(242,241,237,.025);
  color:rgba(242,241,237,.74);
  font-size:11px;
  letter-spacing:.08em;
}
.aurum-case-metrics{
  grid-column:9 / -1;
  grid-row:2 / span 4;
  align-self:center;
  margin:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.aurum-case-metrics>div{
  min-height:156px;
  padding:24px;
  border:1px solid rgba(242,241,237,.10);
  border-radius:18px;
  background:
    radial-gradient(120% 100% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
    linear-gradient(180deg,rgba(18,18,20,.88),rgba(8,8,9,.94));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 18px 45px rgba(0,0,0,.20);
}
.aurum-case-metrics strong{
  display:block;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(48px,4.2vw,64px);
  line-height:1;
  font-weight:400;
  color:var(--aurum-pearl);
}
.aurum-case-metrics span{
  display:block;
  margin-top:12px;
  color:rgba(242,241,237,.48);
  font-size:11px;
  line-height:1.5;
  letter-spacing:.06em;
}

.aurum-case-product{padding:20px 0 92px;}
.aurum-product-stage{
  position:relative;
  padding:12px;
  overflow:hidden;
  border:1px solid rgba(242,241,237,.11);
  border-radius:24px;
  background:
    radial-gradient(70% 90% at 10% 0%,rgba(142,25,48,.06),transparent 52%),
    linear-gradient(145deg,#101110,#070707 68%);
  box-shadow:
    0 44px 110px rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.05);
}
.aurum-product-bar{
  min-height:38px;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid rgba(242,241,237,.08);
  color:rgba(242,241,237,.38);
  font-size:8px;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.aurum-product-layout{
  display:grid;
  grid-template-columns:minmax(0,1.42fr) minmax(250px,.58fr);
  gap:12px;
  padding-top:12px;
}
.aurum-product-screen{
  margin:0;
  min-width:0;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(242,241,237,.08);
  border-radius:16px;
  background:#050505;
}
.aurum-product-screen picture,.aurum-product-screen img{display:block;width:100%;height:100%;}
.aurum-product-screen img{object-fit:cover;object-position:center top;}
.aurum-product-rail{
  display:grid;
  grid-template-rows:repeat(4,1fr);
  gap:10px;
}
.aurum-product-rail>div{
  min-height:0;
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border:1px solid rgba(242,241,237,.095);
  border-radius:18px;
  background:
    radial-gradient(120% 90% at 12% 0%,rgba(255,255,255,.045),transparent 44%),
    linear-gradient(180deg,rgba(17,17,19,.88),rgba(8,8,9,.94));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.aurum-product-rail small{color:var(--aurum-red-hi);font-size:8px;letter-spacing:.20em;}
.aurum-product-rail strong{margin-top:9px;color:var(--aurum-pearl);font-size:18px;font-weight:500;}
.aurum-product-rail span{margin-top:5px;color:rgba(242,241,237,.45);font-size:11px;line-height:1.5;}

.aurum-case-section{
  padding:92px 0;
  border-top:1px solid rgba(242,241,237,.065);
}
.aurum-case-split{
  display:grid;
  grid-template-columns:minmax(240px,.62fr) minmax(0,1.38fr);
  gap:clamp(56px,7vw,116px);
}
.aurum-case-heading{
  margin:16px 0 0;
  max-width:480px;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(54px,5.4vw,82px);
  line-height:.94;
  font-weight:400;
}
.aurum-case-copy{
  padding-top:28px;
  max-width:760px;
  color:rgba(242,241,237,.64);
  font-size:17px;
  line-height:1.9;
}
.aurum-case-copy p{margin:0;}

.aurum-scope{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:32px;
  background:transparent;
}
.aurum-scope article{
  position:relative;
  min-height:210px;
  padding:30px;
  overflow:hidden;
  border:1px solid rgba(242,241,237,.095);
  border-radius:20px;
  background:
    radial-gradient(120% 90% at 12% 0%,rgba(255,255,255,.045),transparent 44%),
    linear-gradient(180deg,rgba(17,17,19,.88),rgba(8,8,9,.94));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  transition:transform .24s ease,border-color .24s ease;
}
.aurum-scope article::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:2px;
  background:linear-gradient(90deg,var(--aurum-red),transparent 62%);
  opacity:.74;
}
.aurum-scope article:hover{transform:translateY(-3px);border-color:rgba(242,241,237,.16);}
.aurum-scope article>span{color:var(--aurum-red-hi);font-size:9px;letter-spacing:.18em;}
.aurum-scope h3{margin:38px 0 0;font-family:'Bebas Neue',sans-serif;font-size:34px;font-weight:400;letter-spacing:.03em;}
.aurum-scope p{margin:12px 0 0;color:rgba(242,241,237,.56);font-size:14px;line-height:1.78;}

/* AurumTrade case sections + current DNPROD mobile language. */

.aurum-case-section--grid{
  background:
    linear-gradient(rgba(242,241,237,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(242,241,237,.018) 1px,transparent 1px),
    #070707;
  background-size:48px 48px;
}
.aurum-architecture{
  display:flex;
  align-items:stretch;
  gap:10px;
  overflow-x:auto;
  margin-top:30px;
  padding:6px 0 20px;
  scrollbar-width:thin;
}
.aurum-architecture>div{
  flex:0 0 158px;
  min-height:128px;
  padding:20px;
  border:1px solid rgba(242,241,237,.10);
  border-radius:18px;
  background:
    radial-gradient(110% 90% at 14% 0%,rgba(255,255,255,.04),transparent 44%),
    #0a0a0b;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.aurum-architecture .core{border-color:rgba(142,25,48,.24);}
.aurum-architecture small{color:var(--aurum-red-hi);font-size:9px;letter-spacing:.16em;text-transform:uppercase;}
.aurum-architecture strong{font-size:13px;line-height:1.45;font-weight:500;color:rgba(242,241,237,.82);}
.aurum-architecture span{font-size:11px;line-height:1.5;color:rgba(242,241,237,.48);}
.aurum-architecture i{align-self:center;color:var(--aurum-red);font-style:normal;font-size:16px;opacity:.68;}

.aurum-billing{
  margin-top:14px;
  padding:15px 18px;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  gap:14px;
  border:1px solid rgba(242,241,237,.095);
  border-radius:16px;
  background:rgba(242,241,237,.018);
  color:rgba(242,241,237,.50);
  font-size:9px;
  line-height:1.4;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.aurum-billing b{color:var(--aurum-red);font-weight:400;}

.aurum-ingest{
  display:flex;
  align-items:stretch;
  gap:8px;
  margin-top:28px;
  overflow-x:auto;
  padding-bottom:8px;
  scrollbar-width:thin;
}
.aurum-ingest>div{
  flex:0 0 132px;
  min-height:112px;
  padding:18px;
  border:1px solid rgba(242,241,237,.10);
  border-radius:18px;
  background:
    radial-gradient(110% 90% at 14% 0%,rgba(255,255,255,.04),transparent 44%),
    #0a0a0b;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.aurum-ingest>b{align-self:center;color:var(--aurum-red);font-weight:400;opacity:.68;}
.aurum-ingest small{color:var(--aurum-red-hi);font-size:8px;letter-spacing:.16em;}
.aurum-ingest strong{font-size:13px;font-weight:500;color:var(--aurum-pearl);}
.aurum-tags{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;}
.aurum-tags span{
  padding:8px 10px;
  border:1px solid rgba(242,241,237,.10);
  border-radius:10px;
  background:rgba(242,241,237,.02);
  color:rgba(242,241,237,.56);
  font-size:9px;
  letter-spacing:.05em;
}
.aurum-note{
  margin:18px 0 0;
  padding-left:14px;
  border-left:2px solid rgba(142,25,48,.62);
  color:rgba(242,241,237,.48);
  font-size:11px;
  line-height:1.75;
}

.aurum-case-section--ai{
  background:
    radial-gradient(70% 120% at 100% 0%,rgba(142,25,48,.065),transparent 55%),
    linear-gradient(180deg,#070707,#090909);
}
.aurum-ai{
  display:grid;
  grid-template-columns:.7fr .7fr 1.1fr;
  gap:12px;
  margin-top:30px;
}
.aurum-ai-inputs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.aurum-ai-inputs span{
  min-height:104px;
  padding:17px;
  display:flex;
  align-items:flex-end;
  border:1px solid rgba(242,241,237,.10);
  border-radius:18px;
  background:
    radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.05),transparent 42%),
    linear-gradient(180deg,rgba(20,20,22,.86),rgba(8,8,9,.92));
  color:var(--aurum-red-hi);
  font-size:9px;
  letter-spacing:.14em;
}
.aurum-ai-core{
  min-height:218px;
  padding:24px;
  border:1px solid rgba(142,25,48,.22);
  border-radius:20px;
  background:
    radial-gradient(100% 100% at 50% 0%,rgba(142,25,48,.11),transparent 55%),
    #090a09;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.aurum-ai-core small{color:var(--aurum-red-hi);font-size:8px;letter-spacing:.17em;}
.aurum-ai-core strong{margin-top:16px;font-family:'Bebas Neue',sans-serif;font-size:34px;font-weight:400;}
.aurum-ai-core span{margin-top:7px;color:rgba(242,241,237,.42);font-size:10px;line-height:1.5;}
.aurum-ai-flows{display:grid;gap:10px;}
.aurum-ai-flows div{
  min-height:54px;
  padding:14px 16px;
  border:1px solid rgba(242,241,237,.10);
  border-radius:16px;
  background:
    radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.04),transparent 42%),
    #0a0a0b;
  display:grid;
  grid-template-columns:34px 1fr;
  align-items:center;
}
.aurum-ai-flows b{color:var(--aurum-red-hi);font-size:9px;font-weight:400;}
.aurum-ai-flows strong{font-size:12px;font-weight:500;color:var(--aurum-pearl);}

.aurum-data{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:30px;
}
.aurum-data>div{
  min-height:180px;
  padding:24px;
  border:1px solid rgba(242,241,237,.10);
  border-radius:18px;
  background:
    radial-gradient(120% 100% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
    linear-gradient(180deg,rgba(18,18,20,.88),rgba(8,8,9,.94));
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.aurum-data strong{font-family:'Bebas Neue',sans-serif;font-size:56px;line-height:1;font-weight:400;color:var(--aurum-pearl);}
.aurum-data span{color:rgba(242,241,237,.52);font-size:10px;letter-spacing:.08em;text-transform:uppercase;}

.aurum-analytics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:28px;
}
.aurum-analytics span{
  min-height:52px;
  padding:15px 14px;
  display:flex;
  align-items:center;
  border:1px solid rgba(242,241,237,.095);
  border-radius:14px;
  background:#09090a;
  color:rgba(242,241,237,.58);
  font-size:10px;
  line-height:1.4;
}
.aurum-sim{
  margin-top:14px;
  padding:28px;
  display:grid;
  grid-template-columns:210px 1fr;
  gap:30px;
  align-items:center;
  border:1px solid rgba(242,241,237,.10);
  border-radius:20px;
  background:
    radial-gradient(80% 120% at 100% 0%,rgba(142,25,48,.075),transparent 52%),
    linear-gradient(180deg,rgba(15,15,17,.91),rgba(8,8,9,.96));
}
.aurum-sim strong{font-family:'Bebas Neue',sans-serif;font-size:48px;font-weight:400;color:var(--aurum-pearl);}
.aurum-sim p{margin:0;color:rgba(242,241,237,.56);font-size:12px;line-height:1.78;}

.aurum-case-outcome{
  padding:92px 0;
  border-top:1px solid rgba(242,241,237,.065);
}
.aurum-case-outcome>.aurum-case-shell{
  padding:64px;
  border:1px solid rgba(242,241,237,.11);
  border-radius:24px;
  background:
    radial-gradient(60% 120% at 100% 0%,rgba(142,25,48,.14),transparent 58%),
    radial-gradient(50% 90% at 0% 100%,rgba(142,25,48,.035),transparent 62%),
    #0a0a0b;
  box-shadow:0 30px 90px rgba(0,0,0,.24);
}
.aurum-case-outcome h2{
  margin:18px 0 0;
  max-width:1040px;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(52px,7vw,102px);
  line-height:.92;
  font-weight:400;
}
.aurum-case-outcome p:last-child{
  max-width:820px;
  margin:28px 0 0;
  color:rgba(242,241,237,.62);
  font-size:15px;
  line-height:1.8;
}

.aurum-case-footer{
  width:min(1320px,calc(100% - 64px));
  margin:0 auto;
  padding:52px 0 72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border:0;
  background:transparent;
  color:rgba(242,241,237,.44);
  font-size:9px;
  letter-spacing:.18em;
}
.aurum-case-footer>div{display:flex;flex-wrap:wrap;gap:12px;}
.aurum-case-btn{
  min-height:46px;
  padding:13px 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(242,241,237,.18);
  border-radius:12px;
  color:#fff;
  text-decoration:none;
  font-size:10px;
  font-weight:600;
  line-height:1;
  letter-spacing:.10em;
  text-transform:uppercase;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.aurum-case-btn:hover{transform:translateY(-2px);border-color:#fff;}
.aurum-case-btn.primary{
  border-color:rgba(142,25,48,.88);
  background:linear-gradient(180deg,#8E1930 0%,#8E1930 52%,#8E1930 100%);
  color:#fff;
  box-shadow:0 12px 34px rgba(142,25,48,.18);
}

/* Current DNPROD mobile language: pearl text, soft glass cards, restrained project accent. */
@media(max-width:900px){
  #portfolio .port-card.port-card--aurumtrade{
    border-radius:22px!important;
    overflow:hidden!important;
    border-color:rgba(242,241,237,.10)!important;
    background:#080808!important;
    box-shadow:0 22px 54px rgba(0,0,0,.34)!important;
  }
  #portfolio .port-card.port-card--aurumtrade::before{display:none!important;}
  #portfolio .port-card.port-card--aurumtrade .port-img{min-height:0!important;background:#050505!important;}
  #portfolio .port-card.port-card--aurumtrade .port-info{
    padding:24px 20px 20px!important;
    background:
      radial-gradient(85% 110% at 100% 0%,rgba(142,25,48,.09),transparent 58%),
      #09090a!important;
  }
  #portfolio .port-card.port-card--aurumtrade .port-tag{
    color:var(--aurum-red-hi)!important;
    -webkit-text-fill-color:var(--aurum-red-hi)!important;
  }
  #portfolio .port-card.port-card--aurumtrade .port-name,
  #portfolio .port-card.port-card--aurumtrade .port-desc,
  #portfolio .port-card.port-card--aurumtrade .port-role{
    color:var(--aurum-pearl)!important;
  }
  #portfolio .port-card.port-card--aurumtrade .port-desc{opacity:.70;}
  #portfolio .port-card.port-card--aurumtrade .port-role{letter-spacing:.015em!important;opacity:.82;}

  #portfolio .aurum-engineering{
    padding:14px 16px 20px!important;
    border-top:0!important;
    background:#09090a!important;
  }
  #portfolio .aurum-engineering-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    border:0!important;
    background:transparent!important;
  }
  #portfolio .aurum-engineering-cell{
    min-height:0!important;
    padding:18px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.065),transparent 42%),
      linear-gradient(180deg,rgba(25,25,27,.74),rgba(9,9,10,.84))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.075),
      0 12px 28px rgba(0,0,0,.20)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }
  #portfolio .aurum-engineering-cell::before{display:none!important;}
  #portfolio .aurum-engineering-label{
    color:var(--aurum-red-hi)!important;
    -webkit-text-fill-color:var(--aurum-red-hi)!important;
  }
  #portfolio .aurum-engineering-value{color:var(--aurum-pearl)!important;opacity:.74;}
  #portfolio .aurum-proof-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-top:12px!important;
  }
  #portfolio .aurum-proof{
    justify-content:center!important;
    min-width:0!important;
    min-height:38px!important;
    padding:9px 8px!important;
    border-radius:12px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    background:rgba(242,241,237,.025)!important;
    color:var(--aurum-pearl)!important;
    -webkit-text-fill-color:var(--aurum-pearl)!important;
    font-size:8px!important;
    letter-spacing:.08em!important;
    text-align:center;
  }
  #portfolio .port-card--aurumtrade .port-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  #portfolio .port-card--aurumtrade .port-actions .port-link{
    width:100%!important;
    min-height:50px!important;
    border-radius:14px!important;
    border-color:rgba(242,241,237,.13)!important;
    background:
      radial-gradient(120% 100% at 18% 0%,rgba(255,255,255,.045),transparent 42%),
      rgba(242,241,237,.025)!important;
    color:var(--aurum-pearl)!important;
    -webkit-text-fill-color:var(--aurum-pearl)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
  }
  #portfolio .port-card--aurumtrade .port-actions .port-link--primary{
    border-color:rgba(142,25,48,.58)!important;
    background:
      radial-gradient(120% 100% at 20% 0%,rgba(255,255,255,.08),transparent 44%),
      linear-gradient(180deg,#8E1930 0%,#8E1930 52%,#8E1930 100%)!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.09),
      0 12px 28px rgba(0,0,0,.22)!important;
  }

  .aurum-case-page{
    background:
      radial-gradient(125% 48% at 100% 0%,rgba(142,25,48,.12),transparent 62%),
      #050505!important;
  }
  .aurum-case-nav{
    min-height:60px!important;
    padding:0 16px!important;
    background:rgba(5,5,5,.82)!important;
    border-bottom:1px solid rgba(242,241,237,.07)!important;
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }
  .aurum-case-brand{width:72px;height:36px;}
  .aurum-case-brand img{width:88px;left:-8px;top:3px;}
  .aurum-case-shell{width:min(100% - 28px,1380px)!important;}
  .aurum-case-back{display:none!important;}
  .aurum-case-nav-right{gap:10px!important;}
  .aurum-case-lang{
    padding:5px 7px;
    border-radius:8px;
    border:1px solid transparent;
    color:rgba(242,241,237,.56)!important;
  }
  .aurum-case-lang[aria-current="page"]{
    padding-bottom:5px!important;
    border:1px solid rgba(142,25,48,.34)!important;
    background:rgba(142,25,48,.08)!important;
    color:var(--aurum-pearl)!important;
  }

  .aurum-case-hero{
    min-height:0!important;
    display:block!important;
    padding:52px 0 34px!important;
    border-bottom:0!important;
    overflow:hidden;
  }
  .aurum-case-hero::before{display:none;}
  .aurum-case-hero::after{
    content:'AT';
    top:31%;
    right:-.08em;
    font-size:clamp(130px,45vw,210px);
    -webkit-text-stroke:1px rgba(242,241,237,.035);
  }
  .aurum-case-hero .aurum-case-shell{
    display:block!important;
  }
  .aurum-case-kicker,.aurum-case-section-label{
    color:var(--aurum-red-hi)!important;
    -webkit-text-fill-color:var(--aurum-red-hi)!important;
    font-size:9px!important;
    letter-spacing:.22em!important;
  }
  .aurum-case-title-row{display:block!important;}
  .aurum-case-title{
    margin:14px 0 18px!important;
    font-size:clamp(54px,16.5vw,78px)!important;
    line-height:.88!important;
    letter-spacing:-.012em!important;
  }
  .aurum-case-title span{color:var(--aurum-pearl)!important;}
  .aurum-case-index{display:none!important;}
  .aurum-case-lead{
    max-width:none!important;
    margin:0!important;
    font-size:15px!important;
    line-height:1.72!important;
    color:rgba(242,241,237,.70)!important;
  }
  .aurum-case-role{
    margin-top:20px!important;
    gap:8px!important;
  }
  .aurum-case-role span{
    padding:8px 10px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:12px!important;
    background:
      radial-gradient(120% 100% at 16% 0%,rgba(255,255,255,.055),transparent 44%),
      rgba(242,241,237,.025)!important;
    color:rgba(242,241,237,.72)!important;
    font-size:9px!important;
    line-height:1.35!important;
  }
  .aurum-case-metrics{
    margin-top:24px!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .aurum-case-metrics>div{
    min-height:112px!important;
    padding:16px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.065),transparent 42%),
      linear-gradient(180deg,rgba(25,25,27,.74),rgba(9,9,10,.84))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.075),
      0 12px 30px rgba(0,0,0,.20)!important;
  }
  .aurum-case-metrics strong{font-size:38px!important;color:var(--aurum-pearl)!important;}
  .aurum-case-metrics span{margin-top:8px!important;color:rgba(242,241,237,.50)!important;font-size:9px!important;line-height:1.45!important;}

  .aurum-case-product{padding:12px 0 42px!important;}
  .aurum-product-stage{
    padding:7px!important;
    overflow:hidden;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:20px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      #0a0a0b!important;
    box-shadow:0 20px 48px rgba(0,0,0,.30)!important;
  }
  .aurum-product-bar{min-height:34px;padding:0 8px;font-size:7px;}
  .aurum-product-bar span:last-child{display:none;}
  .aurum-product-layout{
    display:block!important;
    padding-top:7px!important;
  }
  .aurum-product-screen{
    border-radius:14px!important;
  }
  .aurum-product-screen img{
    height:auto!important;
    object-fit:contain!important;
  }
  .aurum-product-rail{
    margin-top:10px;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:auto!important;
    gap:10px!important;
  }
  .aurum-product-rail>div{
    min-height:104px!important;
    padding:16px!important;
    border-radius:16px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(22,22,24,.72),rgba(8,8,9,.84))!important;
  }

  .aurum-case-section{
    padding:28px 0!important;
    border-top:0!important;
  }
  .aurum-case-section>.aurum-case-shell.aurum-case-split{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:16px!important;
    padding:20px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:20px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(20,20,22,.72),rgba(8,8,9,.82))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.06),
      0 14px 34px rgba(0,0,0,.16)!important;
  }
  .aurum-case-heading{
    margin-top:9px!important;
    font-size:clamp(38px,12vw,56px)!important;
    line-height:.94!important;
  }
  .aurum-case-copy{
    padding:0!important;
    font-size:14px!important;
    line-height:1.78!important;
    color:rgba(242,241,237,.66)!important;
  }

  .aurum-scope{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:18px!important;
  }
  .aurum-scope article{
    min-height:0!important;
    padding:19px!important;
    border:1px solid rgba(242,241,237,.10)!important;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(22,22,24,.72),rgba(8,8,9,.84))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.06),
      0 12px 28px rgba(0,0,0,.16)!important;
  }
  .aurum-scope article::before{display:none;}
  .aurum-scope h3{margin-top:24px!important;font-size:29px!important;color:var(--aurum-pearl)!important;}
  .aurum-scope p{margin-top:8px!important;color:rgba(242,241,237,.62)!important;font-size:13px!important;line-height:1.7!important;}

  .aurum-case-section--grid{background:transparent!important;}
  .aurum-architecture{
    gap:10px!important;
    margin-top:18px!important;
    padding:2px 0 10px!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .aurum-architecture::-webkit-scrollbar{display:none;}
  .aurum-architecture>div{
    flex:0 0 148px!important;
    min-height:116px!important;
    padding:16px!important;
    scroll-snap-align:start;
    border-radius:18px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(22,22,24,.72),rgba(8,8,9,.84))!important;
  }
  .aurum-billing{
    justify-content:flex-start!important;
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    white-space:nowrap;
    scrollbar-width:none;
  }
  .aurum-billing::-webkit-scrollbar{display:none;}

  .aurum-ingest{
    gap:10px!important;
    margin-top:18px!important;
    padding:2px 0 10px!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .aurum-ingest::-webkit-scrollbar{display:none;}
  .aurum-ingest>div{flex:0 0 132px!important;min-height:106px!important;scroll-snap-align:start;}
  .aurum-tags{gap:7px!important;}
  .aurum-tags span{font-size:8px!important;}

  .aurum-case-section--ai{background:transparent!important;}
  .aurum-ai{
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:18px!important;
  }
  .aurum-ai-inputs{grid-template-columns:1fr 1fr!important;}
  .aurum-ai-inputs span{min-height:92px!important;border-radius:16px!important;}
  .aurum-ai-core{min-height:176px!important;border-radius:18px!important;}
  .aurum-ai-flows div{min-height:52px!important;border-radius:16px!important;}

  .aurum-data{
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    margin-top:18px!important;
  }
  .aurum-data>div{min-height:142px!important;padding:16px!important;border-radius:18px!important;}
  .aurum-data strong{font-size:42px!important;}
  .aurum-data span{font-size:8px!important;line-height:1.4!important;}

  .aurum-analytics{
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    margin-top:18px!important;
  }
  .aurum-analytics span{min-height:48px!important;padding:12px!important;font-size:9px!important;border-radius:14px!important;}
  .aurum-sim{
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:12px!important;
    padding:18px!important;
    border-radius:18px!important;
  }
  .aurum-sim strong{font-size:40px!important;}
  .aurum-sim p{font-size:11px!important;line-height:1.72!important;}

  .aurum-case-outcome{
    padding:28px 0!important;
    border-top:0!important;
  }
  .aurum-case-outcome>.aurum-case-shell{
    width:min(100% - 28px,1380px)!important;
    padding:20px!important;
    border-radius:20px!important;
    background:
      radial-gradient(120% 90% at 18% 0%,rgba(255,255,255,.055),transparent 42%),
      linear-gradient(180deg,rgba(20,20,22,.72),rgba(8,8,9,.82))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.06),
      0 14px 34px rgba(0,0,0,.16)!important;
  }
  .aurum-case-outcome h2{
    margin-top:12px!important;
    font-size:clamp(42px,13vw,62px)!important;
    line-height:.94!important;
  }
  .aurum-case-outcome p:last-child{
    margin-top:18px!important;
    font-size:13px!important;
    line-height:1.72!important;
  }

  .aurum-case-footer{
    width:calc(100% - 28px)!important;
    margin:0 auto!important;
    padding:24px 0 34px!important;
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:16px!important;
  }
  .aurum-case-footer>div{
    width:100%;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  .aurum-case-btn{width:100%;min-height:50px;border-radius:14px!important;}
}

@media(max-width:560px){
  .aurum-case-shell{width:min(100% - 20px,1380px)!important;}
  .aurum-product-rail{grid-template-columns:1fr!important;}
  .aurum-case-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .aurum-ai-inputs{grid-template-columns:1fr 1fr!important;}
  .aurum-data{grid-template-columns:1fr 1fr!important;}
}

@media(prefers-reduced-motion:reduce){
  .aurum-case-page *{scroll-behavior:auto!important;transition:none!important;animation:none!important;}
}


/* Targeted mobile fix — Data Ingestion must be a contained vertical flow, never a clipped desktop strip. */
@media(max-width:900px){
  .aurum-case-section .aurum-case-split > *{
    min-width:0!important;
  }
  .aurum-ingest{
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    margin-top:18px!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
  }
  .aurum-ingest>div{
    width:100%!important;
    min-width:0!important;
    min-height:84px!important;
    padding:15px 16px!important;
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    gap:4px 10px!important;
    border-radius:16px!important;
    scroll-snap-align:none!important;
  }
  .aurum-ingest>div small{
    grid-column:1!important;
    grid-row:1 / span 2!important;
    align-self:center!important;
    justify-self:start!important;
    font-size:9px!important;
  }
  .aurum-ingest>div strong{
    grid-column:2!important;
    grid-row:1 / span 2!important;
    align-self:center!important;
    margin:0!important;
    font-size:15px!important;
    line-height:1.25!important;
  }
  .aurum-ingest>b{
    position:relative!important;
    width:100%!important;
    height:16px!important;
    display:block!important;
    align-self:auto!important;
    overflow:hidden!important;
    color:transparent!important;
    font-size:0!important;
  }
  .aurum-ingest>b::after{
    content:'↓';
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--aurum-red)!important;
    font-size:14px!important;
    line-height:1;
    opacity:.62;
  }
  .aurum-tags{
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    margin-top:14px!important;
  }
  .aurum-tags span{
    min-width:0!important;
    padding:9px 8px!important;
    text-align:center!important;
    overflow-wrap:anywhere!important;
  }
  .aurum-note{
    width:100%!important;
    min-width:0!important;
    margin-top:16px!important;
    padding:0 0 0 12px!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
}

@media(max-width:560px){
  .aurum-tags{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}


/* Final CTA panel refinement — AurumTrade. Scope: footer only. */
body.aurum-case-page footer.aurum-case-footer{
  width:min(1180px,calc(100% - 48px))!important;
  max-width:1180px!important;
  margin:34px auto 28px!important;
  padding:22px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  gap:18px!important;
  border:1px solid rgba(242,241,237,.105)!important;
  border-radius:4px!important;
  background:
    radial-gradient(74% 120% at 100% 0%,rgba(142,25,48,.10),transparent 58%),
    radial-gradient(90% 110% at 0% 100%,rgba(255,255,255,.018),transparent 60%),
    linear-gradient(180deg,rgba(15,15,17,.97),rgba(8,8,9,.985))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 20px 54px rgba(0,0,0,.24)!important;
  color:rgba(242,241,237,.44)!important;
  font-size:9px!important;
  letter-spacing:.18em!important;
  overflow:hidden!important;
}
body.aurum-case-page footer.aurum-case-footer>span{
  margin:0!important;
  padding:0!important;
  color:rgba(142,25,48,.82)!important;
  font-size:9px!important;
  line-height:1.2!important;
  letter-spacing:.28em!important;
  text-transform:uppercase!important;
}
body.aurum-case-page footer.aurum-case-footer>div{
  width:100%!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)!important;
  gap:12px!important;
}
body.aurum-case-page footer.aurum-case-footer .aurum-case-btn{
  width:100%!important;
  min-width:0!important;
  min-height:62px!important;
  margin:0!important;
  padding:15px 18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(242,241,237,.12)!important;
  border-radius:6px!important;
  background:
    radial-gradient(120% 100% at 20% 0%,rgba(255,255,255,.04),transparent 46%),
    rgba(242,241,237,.018)!important;
  color:#F2F1ED!important;
  font-size:10px!important;
  font-weight:600!important;
  line-height:1!important;
  letter-spacing:.13em!important;
  text-align:center!important;
  text-transform:uppercase!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease!important;
}
body.aurum-case-page footer.aurum-case-footer .aurum-case-btn:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(242,241,237,.22)!important;
  background:
    radial-gradient(120% 100% at 20% 0%,rgba(255,255,255,.065),transparent 46%),
    rgba(242,241,237,.028)!important;
}
body.aurum-case-page footer.aurum-case-footer .aurum-case-btn.primary{
  border-color:rgba(142,25,48,.76)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.11) 0%,rgba(255,255,255,.025) 28%,rgba(255,255,255,0) 54%),
    #8E1930!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(0,0,0,.20),
    0 12px 28px rgba(0,0,0,.20)!important;
}
body.aurum-case-page footer.aurum-case-footer .aurum-case-btn.primary:hover{
  border-color:rgba(242,241,237,.24)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,.035) 30%,rgba(255,255,255,0) 56%),
    #8E1930!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 14px 30px rgba(0,0,0,.22)!important;
}

@media(max-width:900px){
  body.aurum-case-page footer.aurum-case-footer{
    width:calc(100% - 16px)!important;
    max-width:none!important;
    margin:16px 8px 20px!important;
    padding:16px!important;
    gap:14px!important;
    border-radius:8px!important;
  }
  body.aurum-case-page footer.aurum-case-footer>span{
    padding:0 1px!important;
    font-size:8px!important;
    letter-spacing:.24em!important;
  }
  body.aurum-case-page footer.aurum-case-footer>div{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  body.aurum-case-page footer.aurum-case-footer .aurum-case-btn{
    min-height:56px!important;
    padding:13px 14px!important;
    border-radius:8px!important;
    font-size:9px!important;
    letter-spacing:.12em!important;
  }
  body.aurum-case-page footer.aurum-case-footer .aurum-case-btn.primary{
    min-height:64px!important;
  }
}

/* DNPROD unified geometry pass.
   Source geometry: approved AurumTrade/WLFF flagship language.
   Visual-only: preserve content, routes, interactions and project-specific identity. */

:root{
  --dn-crimson:#8E1930;
  --dn-crimson-bright:#8E1930;
  --dn-pearl:#F2F1ED;
  --dn-ink:#070708;
  --dn-surface:#101011;
  --dn-surface-2:#0b0b0c;
  --dn-line:rgba(242,241,237,.10);
  --dn-line-strong:rgba(242,241,237,.16);
  --dn-shell-radius:0px;
  --dn-panel-radius:20px;
  --dn-inner-radius:14px;
  --dn-control-radius:12px;
  --dn-gap:16px;
  --dn-shadow:0 22px 54px rgba(0,0,0,.26);
  --dn-inset:inset 0 1px 0 rgba(255,255,255,.075);
}

html,body{background:#070708!important;color:var(--dn-pearl)!important;}
body{overflow-x:hidden;}

/* Shared section rhythm */
body .portfolio,
body .services,
body .about,
body .process,
body .contact{
  position:relative;
  padding-top:clamp(86px,8vw,126px)!important;
  padding-bottom:clamp(86px,8vw,126px)!important;
}
body .portfolio .max,
body .services .max,
body .about .max,
body .process .max,
body .contact .max{
  width:min(1320px,calc(100% - 48px))!important;
  max-width:1320px!important;
  margin-inline:auto!important;
}
body .sec-label,
body .about-label,
body .positioning-kicker,
body .ia-founder-kicker{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--dn-crimson-bright)!important;
  font-size:10px!important;
  line-height:1.25!important;
  letter-spacing:.26em!important;
  text-transform:uppercase!important;
}
body .sec-label::before,
body .about-label::before,
body .positioning-kicker::before,
body .ia-founder-kicker::before{
  content:'';
  width:28px;
  height:1px;
  flex:0 0 28px;
  background:var(--dn-crimson);
}
body .sec-title,
body .about-title,
body .contact-title{
  margin-top:14px!important;
  letter-spacing:-.01em!important;
}
body .sec-title em,
body .about-title em,
body .contact-title em{
  color:var(--dn-pearl)!important;
  font-style:normal!important;
}

/* Navigation — same compact lacquer geometry as flagship controls. */
@media(min-width:901px){
  body nav{
    top:12px!important;
    left:50%!important;
    right:auto!important;
    width:min(1320px,calc(100% - 32px))!important;
    max-width:1320px!important;
    height:62px!important;
    padding:0 22px!important;
    transform:translateX(-50%)!important;
    border:1px solid var(--dn-line)!important;
    border-radius:0!important;
    background:
      radial-gradient(80% 140% at 0% 0%,rgba(255,255,255,.055),transparent 50%),
      linear-gradient(180deg,rgba(26,26,28,.80),rgba(10,10,11,.88))!important;
    box-shadow:var(--dn-inset),0 14px 38px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(24px) saturate(130%)!important;
    -webkit-backdrop-filter:blur(24px) saturate(130%)!important;
  }
  body .nav-cta,
  body .lang-current,
  body .lang-dropdown{
    border-radius:var(--dn-control-radius)!important;
  }
}

/* Hero — keep cinematic scale, apply approved nested panel geometry. */
body .hero-v2 .feature-shell{
  padding:12px!important;
  overflow:hidden!important;
  clip-path:none!important;
  border:1px solid var(--dn-line)!important;
  border-radius:0!important;
  background:
    radial-gradient(80% 120% at 100% 0%,rgba(142,25,48,.065),transparent 52%),
    linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.010)),
    rgba(12,12,13,.74)!important;
  box-shadow:var(--dn-inset),var(--dn-shadow)!important;
}
body .hero-v2 .feature-copy{
  padding:clamp(22px,2.5vw,34px)!important;
}
body .hero-v2 .feature-product-window{
  border-radius:18px!important;
  border:1px solid var(--dn-line)!important;
  box-shadow:var(--dn-inset),0 18px 42px rgba(0,0,0,.28)!important;
}
body .hero-v2 .feature-product-window__viewport,
body .hero-v2 .feature-product-window img{
  border-radius:12px!important;
}
body .hero-v2 .hero-actions .btn-red,
body .hero-v2 .hero-actions .btn-ghost,
body .btn-red,
body .btn-ghost{
  min-height:48px!important;
  border-radius:var(--dn-control-radius)!important;
}
body .hero-v2 .hero-proofline{
  gap:8px!important;
}
body .hero-v2 .hero-proofline span{
  padding:7px 10px!important;
  border:1px solid rgba(242,241,237,.09)!important;
  border-radius:10px!important;
  background:rgba(242,241,237,.018)!important;
}

/* Selected Work — generic cards follow flagship geometry. Project-specific cards keep their own art direction. */
body #portfolio .port-grid{
  gap:var(--dn-gap)!important;
}
body #portfolio .port-card{
  border:1px solid var(--dn-line)!important;
  border-radius:0!important;
  background:
    radial-gradient(110% 90% at 14% 0%,rgba(255,255,255,.045),transparent 44%),
    linear-gradient(180deg,rgba(17,17,19,.88),rgba(8,8,9,.95))!important;
  box-shadow:var(--dn-inset),var(--dn-shadow)!important;
}
body #portfolio .port-card .port-img{
  border-radius:16px!important;
  border:1px solid rgba(242,241,237,.065)!important;
}
body #portfolio .port-card .port-picture,
body #portfolio .port-card .port-picture img,
body #portfolio .port-card .port-img img{
  border-radius:12px!important;
}
body #portfolio .port-card:not(.port-card--aurumtrade):not(.port-card--wlff) .port-info{
  padding:28px!important;
}
body #portfolio .port-card .port-actions{
  gap:10px!important;
}
body #portfolio .port-card .port-link{
  min-height:44px!important;
  padding:11px 15px!important;
  border-radius:var(--dn-control-radius)!important;
  border:1px solid rgba(242,241,237,.12)!important;
  background:rgba(242,241,237,.018)!important;
}
body #portfolio .port-card .port-link--primary{
  color:#fff!important;
  border-color:rgba(142,25,48,.68)!important;
  background:linear-gradient(180deg,#8E1930 0%,#8E1930 52%,#8E1930 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 24px rgba(0,0,0,.22)!important;
}

/* Founder bridge + manifesto — full-width ideas, contained in the same shell geometry. */
body .ia-founder-strip,
body .positioning-manifesto{
  width:min(1320px,calc(100% - 32px))!important;
  margin:24px auto!important;
  padding:clamp(42px,5vw,72px)!important;
  border:1px solid var(--dn-line)!important;
  border-radius:0!important;
  background:
    radial-gradient(72% 120% at 100% 0%,rgba(142,25,48,.11),transparent 58%),
    radial-gradient(70% 100% at 0% 100%,rgba(255,255,255,.025),transparent 58%),
    linear-gradient(180deg,#0d0d0e,#09090a)!important;
  box-shadow:var(--dn-inset),var(--dn-shadow)!important;
}
body .ia-founder-inner,
body .positioning-inner{
  max-width:none!important;
}
body .ia-founder-meta span{
  padding:8px 10px!important;
  border:1px solid rgba(242,241,237,.09)!important;
  border-radius:10px!important;
  background:rgba(242,241,237,.018)!important;
}

/* Services — three capabilities become one deliberate 3-panel system. */
body .services{
  background:
    radial-gradient(70% 80% at 95% 15%,rgba(142,25,48,.045),transparent 62%),
    #070708!important;
}
body .services .srv-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:var(--dn-gap)!important;
  margin-top:42px!important;
  border:0!important;
  background:transparent!important;
}
body .services .srv-card{
  position:relative!important;
  display:flex!important;
  min-height:292px!important;
  padding:28px!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:0!important;
  overflow:hidden!important;
  border:1px solid var(--dn-line)!important;
  border-radius:var(--dn-panel-radius)!important;
  background:
    radial-gradient(120% 90% at 14% 0%,rgba(255,255,255,.052),transparent 44%),
    linear-gradient(180deg,rgba(18,18,20,.90),rgba(8,8,9,.96))!important;
  box-shadow:var(--dn-inset),0 18px 42px rgba(0,0,0,.20)!important;
}
body .services .srv-card::after{
  content:'';
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:2px;
  background:linear-gradient(90deg,var(--dn-crimson),transparent 62%);
  opacity:.9;
}
body .services .srv-num{
  margin:0!important;
  color:var(--dn-crimson-bright)!important;
  font-size:10px!important;
  letter-spacing:.16em!important;
}
body .services .srv-title{
  margin:46px 0 0!important;
  font-size:clamp(30px,2.4vw,40px)!important;
  line-height:.98!important;
}
body .services .srv-desc{
  margin:14px 0 0!important;
  max-width:34ch!important;
  color:rgba(242,241,237,.60)!important;
  font-size:14px!important;
  line-height:1.72!important;
}

/* About — photo and narrative are sibling flagship panels. */
body .about{
  background:#09090a!important;
}
body .about .about-inner{
  display:grid!important;
  grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr)!important;
  gap:var(--dn-gap)!important;
  align-items:stretch!important;
}
body .about .about-photo-wrap,
body .about .about-inner>div:last-child{
  position:relative;
  overflow:hidden;
  border:1px solid var(--dn-line)!important;
  border-radius:0!important;
  background:
    radial-gradient(100% 90% at 12% 0%,rgba(255,255,255,.045),transparent 44%),
    linear-gradient(180deg,rgba(17,17,19,.90),rgba(8,8,9,.96))!important;
  box-shadow:var(--dn-inset),var(--dn-shadow)!important;
}
body .about .about-photo-wrap{
  padding:8px!important;
}
body .about .about-photo{
  height:100%!important;
  min-height:520px!important;
  border:0!important;
  border-radius:18px!important;
  box-shadow:none!important;
}
body .about .about-photo img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:18px!important;
}
body .about .about-photo-label{
  left:16px!important;
  right:16px!important;
  bottom:16px!important;
  margin:0!important;
  border-radius:14px!important;
}
body .about .about-inner>div:last-child{
  padding:clamp(30px,4vw,54px)!important;
}
body .about .about-tags{
  gap:8px!important;
}
body .about .tag{
  padding:8px 11px!important;
  border:1px solid rgba(242,241,237,.10)!important;
  border-radius:10px!important;
  background:rgba(242,241,237,.018)!important;
}
body .about .about-proof{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  margin-top:28px!important;
  border:0!important;
  background:transparent!important;
}
body .about .about-proof-item{
  min-height:160px!important;
  padding:18px!important;
  border:1px solid rgba(242,241,237,.09)!important;
  border-radius:16px!important;
  background:
    radial-gradient(120% 90% at 14% 0%,rgba(255,255,255,.045),transparent 44%),
    rgba(8,8,9,.72)!important;
}

/* Process — same compact 2x2 logic as AurumTrade detail matrices. */
body .process{
  background:
    radial-gradient(70% 90% at 0% 100%,rgba(142,25,48,.04),transparent 60%),
    #070708!important;
}
body .process .process-steps{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:var(--dn-gap)!important;
  margin-top:42px!important;
  border:0!important;
  background:transparent!important;
}
body .process .step{
  position:relative!important;
  display:grid!important;
  grid-template-columns:54px minmax(0,1fr)!important;
  grid-template-rows:auto 1fr!important;
  gap:10px 18px!important;
  min-height:210px!important;
  padding:26px!important;
  overflow:hidden!important;
  border:1px solid var(--dn-line)!important;
  border-radius:var(--dn-panel-radius)!important;
  background:
    radial-gradient(100% 100% at 100% 0%,rgba(142,25,48,.055),transparent 48%),
    linear-gradient(180deg,rgba(18,18,20,.90),rgba(8,8,9,.96))!important;
  box-shadow:var(--dn-inset),0 18px 42px rgba(0,0,0,.18)!important;
}
body .process .step::after{
  content:'';
  position:absolute;
  left:0;
  top:0;
  width:2px;
  height:100%;
  background:linear-gradient(180deg,var(--dn-crimson),transparent 76%);
}
body .process .step-num{
  grid-column:1!important;
  grid-row:1 / span 2!important;
  margin:4px 0 0!important;
  color:var(--dn-crimson-bright)!important;
}
body .process .step-title{
  grid-column:2!important;
  grid-row:1!important;
  margin:0!important;
  font-size:clamp(30px,2.5vw,40px)!important;
}
body .process .step-desc{
  grid-column:2!important;
  grid-row:2!important;
  margin:0!important;
  max-width:48ch!important;
  color:rgba(242,241,237,.58)!important;
  font-size:14px!important;
  line-height:1.72!important;
}

/* Contact — two balanced flagship panels with nested controls. */
body .contact{
  background:
    radial-gradient(72% 100% at 100% 15%,rgba(142,25,48,.075),transparent 58%),
    #09090a!important;
}
body .contact .contact-inner{
  display:grid!important;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr)!important;
  gap:var(--dn-gap)!important;
  align-items:stretch!important;
}
body .contact .contact-inner>div:first-child,
body .contact #contact-form{
  position:relative!important;
  padding:clamp(28px,4vw,50px)!important;
  border:1px solid var(--dn-line)!important;
  border-radius:0!important;
  background:
    radial-gradient(110% 100% at 12% 0%,rgba(255,255,255,.045),transparent 42%),
    linear-gradient(180deg,rgba(17,17,19,.90),rgba(8,8,9,.96))!important;
  box-shadow:var(--dn-inset),var(--dn-shadow)!important;
}
body .contact .contact-info{
  display:grid!important;
  gap:10px!important;
  margin-top:30px!important;
}
body .contact .contact-row{
  min-height:48px!important;
  padding:12px 14px!important;
  border:1px solid rgba(242,241,237,.09)!important;
  border-radius:12px!important;
  background:rgba(242,241,237,.018)!important;
}
body .contact #contact-form{
  display:grid!important;
  gap:12px!important;
}
body .contact #contact-form input,
body .contact #contact-form select,
body .contact #contact-form textarea{
  width:100%!important;
  border:1px solid rgba(242,241,237,.11)!important;
  border-radius:var(--dn-inner-radius)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.010)),
    #0b0b0c!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
body .contact #contact-form textarea{min-height:160px!important;}
body .contact #contact-form .btn-red{
  min-height:52px!important;
  border-radius:var(--dn-inner-radius)!important;
}

/* Footer — same outer shell, intentionally quieter. */
body:not(.wlff-case-page):not(.aurum-case-page) footer{
  width:min(1320px,calc(100% - 32px))!important;
  margin:24px auto 16px!important;
  padding:22px 26px!important;
  border:1px solid rgba(242,241,237,.085)!important;
  border-radius:0!important;
  background:
    radial-gradient(70% 120% at 100% 0%,rgba(142,25,48,.055),transparent 58%),
    linear-gradient(180deg,#0d0d0e,#09090a)!important;
  box-shadow:var(--dn-inset),0 18px 42px rgba(0,0,0,.18)!important;
}

/* Mobile is designed as its own vertical system, not a compressed desktop grid. */
@media(max-width:900px){
  body .portfolio,
  body .services,
  body .about,
  body .process,
  body .contact{
    padding:64px 14px!important;
  }
  body .portfolio .max,
  body .services .max,
  body .about .max,
  body .process .max,
  body .contact .max{
    width:100%!important;
  }

  body nav{
    top:7px!important;
    left:8px!important;
    right:8px!important;
    width:auto!important;
    height:58px!important;
    padding:0 15px!important;
    border:1px solid var(--dn-line)!important;
    border-radius:16px!important;
    background:rgba(11,11,12,.88)!important;
    box-shadow:var(--dn-inset),0 12px 30px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(20px) saturate(125%)!important;
    -webkit-backdrop-filter:blur(20px) saturate(125%)!important;
  }
  body .mobile-menu{
    left:8px!important;
    right:8px!important;
    top:66px!important;
    border:1px solid var(--dn-line)!important;
    border-radius:0 0 18px 18px!important;
  }

  body .hero-v2 .feature-shell{
    padding:8px!important;
    border-radius:20px!important;
  }
  body .hero-v2 .feature-layout{
    gap:12px!important;
  }
  body .hero-v2 .feature-copy{
    padding:18px 14px!important;
  }
  body .hero-v2 .feature-product-window{
    border-radius:14px!important;
  }
  body .hero-v2 .hero-proofline span{
    padding:6px 8px!important;
    border-radius:9px!important;
  }

  body #portfolio .port-card{
    border-radius:20px!important;
  }
  body #portfolio .port-card .port-img{
    border-radius:14px!important;
  }

  body .ia-founder-strip,
  body .positioning-manifesto{
    width:calc(100% - 20px)!important;
    margin:12px auto!important;
    padding:26px 20px!important;
    border-radius:20px!important;
  }

  body .services .srv-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:28px!important;
  }
  body .services .srv-card{
    min-height:0!important;
    padding:22px!important;
    border-radius:18px!important;
  }
  body .services .srv-title{
    margin-top:30px!important;
    font-size:32px!important;
  }

  body .about .about-inner{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  body .about .about-photo-wrap,
  body .about .about-inner>div:last-child{
    border-radius:20px!important;
  }
  body .about .about-photo{min-height:420px!important;}
  body .about .about-inner>div:last-child{padding:24px!important;}
  body .about .about-proof{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  body .about .about-proof-item{min-height:0!important;}

  body .process .process-steps{
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:28px!important;
  }
  body .process .step{
    min-height:0!important;
    padding:22px!important;
    border-radius:18px!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:8px 14px!important;
  }
  body .process .step-title{font-size:30px!important;}

  body .contact .contact-inner{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  body .contact .contact-inner>div:first-child,
  body .contact #contact-form{
    padding:24px!important;
    border-radius:20px!important;
  }
  body .contact #contact-form textarea{min-height:140px!important;}

  body:not(.wlff-case-page):not(.aurum-case-page) footer{
    width:calc(100% - 16px)!important;
    margin:10px 8px 14px!important;
    padding:18px!important;
    border-radius:16px!important;
  }
}

@media(max-width:560px){
  body .sec-label,
  body .about-label,
  body .positioning-kicker,
  body .ia-founder-kicker{
    font-size:8px!important;
    letter-spacing:.20em!important;
  }
  body .sec-label::before,
  body .about-label::before,
  body .positioning-kicker::before,
  body .ia-founder-kicker::before{
    width:20px;
    flex-basis:20px;
  }
  body .portfolio,
  body .services,
  body .about,
  body .process,
  body .contact{
    padding-left:10px!important;
    padding-right:10px!important;
  }
  body .about .about-photo{min-height:360px!important;}
  body .contact .contact-inner>div:first-child,
  body .contact #contact-form,
  body .about .about-inner>div:last-child{
    padding:20px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body .services .srv-card,
  body .process .step,
  body .about .about-proof-item{
    transition:none!important;
    transform:none!important;
  }
}


/* Founder lower-third — desktop uses the real DNPROD wordmark, never a text DN badge. */
@media(min-width:901px){
  body .about .about-photo-label{
    position:absolute!important;
    padding-right:132px!important;
  }
  body .about .about-photo-label .dn{
    display:none!important;
  }
  body .about .about-photo-label::after{
    content:''!important;
    display:block!important;
    position:absolute!important;
    right:20px!important;
    top:50%!important;
    width:96px!important;
    height:34px!important;
    transform:translateY(-50%)!important;
    border:0!important;
    background:url('/images/brand/dnprod-wordmark.png') center/contain no-repeat!important;
    filter:brightness(0) invert(1)!important;
    opacity:.96!important;
    pointer-events:none!important;
  }
}