:root{--ink:#111;--paper:#f5f5f1;--muted:#777;--line:#d7d7d1;--dark:#111;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.45}a{text-decoration:none;color:inherit}.nav{height:76px;display:flex;align-items:center;gap:32px;padding:0 5vw;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(245,245,241,.9);backdrop-filter:blur(16px);z-index:20}.brand{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:.12em}.brand img{width:42px;height:18px;object-fit:cover;object-position:left center;filter:grayscale(1);mix-blend-mode:multiply}.nav nav{display:flex;gap:26px;margin:auto;font-size:13px}.nav nav a:hover,.footlinks a:hover{opacity:.5}.pill{border:1px solid #111;padding:12px 18px;border-radius:30px;font-size:12px;display:inline-block}.pill:hover{background:#111;color:#fff}.hamb{display:none;margin-left:auto;background:none;border:0}.hero{min-height:680px;background:#101112;color:#fff;display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden}.hero-copy{padding:9vw 5vw 7vw;display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:10px;letter-spacing:.22em;font-weight:700;margin-bottom:18px;color:#777}.hero .eyebrow{color:#aaa}.hero h1{font-size:clamp(52px,7vw,104px);line-height:.92;letter-spacing:-.065em;font-weight:500;max-width:850px;margin:0 0 30px}.hero p{font-size:18px;color:#bbb;max-width:480px}.actions{display:flex;gap:24px;align-items:center;margin-top:30px}.light{color:#111;background:#fff;border-color:#fff}.textlink{font-size:13px}.hero-art{position:relative;background:radial-gradient(circle at 55% 42%,#d7d7d0 0,#777 20%,#292929 48%,#111 72%);min-height:620px}.orb{position:absolute;width:72%;height:55%;left:12%;top:20%;border-radius:50%;background:linear-gradient(145deg,#e4e4de,#555);box-shadow:inset 35px -30px 50px #222;transform:rotate(-8deg)}.figure{position:absolute;width:25px;height:115px;background:#080808;left:50%;bottom:16%;border-radius:40% 40% 0 0}.hero-note{position:absolute;right:7%;bottom:8%;font-size:11px;line-height:1.8;color:#ddd}.intro{padding:100px 5vw;display:grid;grid-template-columns:1.2fr .8fr;gap:10vw;border-bottom:1px solid var(--line)}.intro h2,.section h2,.about h2,.contact h2{font-size:clamp(36px,4vw,64px);line-height:.98;letter-spacing:-.045em;font-weight:500;margin:0}.intro p{font-size:17px;color:#666;max-width:480px}.section{padding:110px 5vw}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:45px}.section-head>p{max-width:360px;color:#777}.section-head>a{font-size:13px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{min-height:370px;border:1px solid #ccc;background:#ddd;position:relative;overflow:hidden}.card .image{height:100%;min-height:370px;background:linear-gradient(135deg,#333,#aaa);background-size:cover;background-position:center}.card .shade{position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(0,0,0,.75));}.card .meta{position:absolute;left:20px;right:20px;bottom:18px;color:#fff}.meta small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.16em;opacity:.75}.meta strong{display:block;font-size:22px;margin-top:5px}.services{background:#fff}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.service{padding:28px 18px 35px 0;border-bottom:1px solid var(--line);min-height:190px}.service:nth-child(4n+2),.service:nth-child(4n+3),.service:nth-child(4n+4){padding-left:25px}.service b{font-size:12px}.service h3{font-size:19px;margin:38px 0 10px}.service p{font-size:13px;color:#777;margin:0;max-width:230px}.statement{display:grid;grid-template-columns:1fr 1fr;gap:7vw;margin-top:90px;align-items:center}.statement-img{height:420px;background:linear-gradient(135deg,#1a1a1a,#888);position:relative;overflow:hidden}.statement-img:after{content:'';position:absolute;width:50%;height:70%;background:#222;border-radius:50%;left:25%;top:15%;box-shadow:inset 25px -20px 30px #888}.statement h2{font-size:48px;margin-bottom:30px}.about{background:#151617;color:#fff;padding:120px 5vw;display:grid;grid-template-columns:1fr 1fr;gap:8vw}.about .eyebrow{color:#aaa}.about p{color:#aaa;max-width:580px;font-size:17px}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:#333}.stats div{background:#151617;padding:30px}.stats b{font-size:48px;font-weight:400;display:block}.stats span{font-size:11px;color:#999;text-transform:uppercase;letter-spacing:.12em}.insights .card{min-height:330px}.insights .image{min-height:330px}.contact{padding:100px 5vw;display:grid;grid-template-columns:1fr 1fr 320px;gap:60px;background:#e9e9e4}.contact p{max-width:470px;color:#666}.contact-meta{display:grid;gap:8px;margin-top:35px;font-size:13px}.contact form{display:grid;gap:12px}.contact input,.contact textarea,.contact select{font:inherit;border:0;border-bottom:1px solid #aaa;background:transparent;padding:15px 0;outline:none}.submit{justify-self:start;margin-top:15px;background:#111;color:#fff;border-color:#111}.contact-art{background:linear-gradient(145deg,#111,#666);min-height:390px}.contact-art:after{content:'RUMUDE';display:flex;align-items:center;justify-content:center;height:100%;font-size:35px;letter-spacing:.3em;color:#fff;transform:rotate(-45deg)}footer{background:#111;color:#fff;padding:28px 5vw;display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;align-items:center;font-size:10px;color:#aaa}.footerbrand{color:#fff}.footlinks{display:flex;gap:20px;justify-content:end;color:#fff}.brand.footerbrand img{filter:invert(1) grayscale(1);mix-blend-mode:screen}@media(max-width:900px){.nav nav,.nav>.pill{display:none}.hamb{display:block}.hero{grid-template-columns:1fr}.hero-art{min-height:380px}.intro,.about,.statement,.contact{grid-template-columns:1fr}.grid{grid-template-columns:1fr 1fr}.service-grid{grid-template-columns:1fr 1fr}.contact-art{display:none}footer{grid-template-columns:1fr}.footlinks{justify-content:start}}@media(max-width:560px){.nav{padding:0 20px}.hero-copy,.section,.intro,.about,.contact{padding-left:20px;padding-right:20px}.grid,.service-grid{grid-template-columns:1fr}.hero h1{font-size:56px}.section{padding-top:75px;padding-bottom:75px}.statement h2{font-size:38px}.section-head{display:block}.section-head>a{display:block;margin-top:20px}}

/* =========================================================
   V6.11.5 — SOCIAL ICONS + CONTACT CTA
   ========================================================= */

.rumude-v6115-social{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-top:24px;
}

.rumude-v6115-social a{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:42px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  text-decoration:none;
  transition:
    transform .2s ease,
    border-color .2s ease,
    background .2s ease,
    opacity .2s ease;
}

.rumude-v6115-social a:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.32);
  background:rgba(255,255,255,.06);
}

.rumude-v6115-social a:focus-visible{
  outline:2px solid currentColor;
  outline-offset:3px;
}

.rumude-v6115-social-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  font-size:14px;
  font-weight:700;
  line-height:1;
}

.rumude-v6115-contact-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 18px;
  margin-top:18px;
  font-size:.9rem;
  opacity:.78;
}

.rumude-v6115-contact-meta a,
.rumude-v6115-contact-meta span{
  color:inherit;
  text-decoration:none;
}

.rumude-v6115-contact-meta a:hover{
  opacity:1;
  text-decoration:underline;
}

@media (max-width:700px){

  .rumude-v6115-social{
    gap:8px;
  }

  .rumude-v6115-social a{
    min-height:40px;
    padding:0 12px;
  }

  .rumude-v6115-social a span:last-child{
    font-size:.82rem;
  }

  .rumude-v6115-contact-meta{
    align-items:flex-start;
    flex-direction:column;
    gap:7px;
  }

}


/* V6.11.6 — SOCIAL HARD VISIBILITY */
.rumude-v6115-social {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
  margin-top: 24px !important;
}

.rumude-v6115-social a[data-rumude-social] {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center !important;
  gap: 9px !important;
  min-height: 42px !important;
  padding: 0 14px !important;
  color: #111 !important;
  background: #f5f5f1 !important;
  border: 1px solid #aaa !important;
  border-radius: 999px !important;
  text-decoration: none !important;
}

.rumude-v6115-social a[data-rumude-social]:hover {
  color: #fff !important;
  background: #111 !important;
  border-color: #111 !important;
}


/* =========================================================
   V6.11.7 — RUMUDE PREMIUM SOCIAL UI
   ========================================================= */

.rumude-v6115-social{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:10px !important;
  margin-top:26px !important;
  width:100% !important;
}

.rumude-v6115-social a[data-rumude-social]{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;

  min-height:40px !important;
  padding:0 15px !important;

  color:#171717 !important;
  background:rgba(255,255,255,.32) !important;

  border:1px solid rgba(17,17,17,.18) !important;
  border-radius:999px !important;

  font-size:12px !important;
  font-weight:500 !important;
  letter-spacing:.01em !important;

  text-decoration:none !important;

  opacity:1 !important;
  visibility:visible !important;

  transition:
    background .22s ease,
    color .22s ease,
    border-color .22s ease,
    transform .22s ease,
    box-shadow .22s ease !important;
}

.rumude-v6115-social a[data-rumude-social]:hover{
  color:#fff !important;
  background:#111 !important;
  border-color:#111 !important;
  transform:translateY(-2px) !important;
  box-shadow:0 8px 22px rgba(0,0,0,.10) !important;
}

.rumude-v6115-social a[data-rumude-social]:active{
  transform:translateY(0) !important;
}

.rumude-v6115-social a[data-rumude-social]:focus-visible{
  outline:2px solid #111 !important;
  outline-offset:3px !important;
}

.rumude-v6115-social-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  width:20px !important;
  height:20px !important;

  flex:0 0 20px !important;

  font-size:13px !important;
  font-weight:700 !important;
  line-height:1 !important;

  color:inherit !important;
}

.rumude-v6115-social a[data-rumude-social="linkedin"]
.rumude-v6115-social-icon{
  font-size:12px !important;
}

.rumude-v6115-social a[data-rumude-social="twitter"]
.rumude-v6115-social-icon{
  font-size:14px !important;
}

.rumude-v6115-social a[data-rumude-social="whatsapp"]
.rumude-v6115-social-icon{
  font-size:15px !important;
}

@media(max-width:700px){

  .rumude-v6115-social{
    gap:8px !important;
    margin-top:22px !important;
  }

  .rumude-v6115-social a[data-rumude-social]{
    min-height:38px !important;
    padding:0 12px !important;
    gap:7px !important;
    font-size:11px !important;
  }

  .rumude-v6115-social-icon{
    width:18px !important;
    height:18px !important;
    flex-basis:18px !important;
  }
}

@media(max-width:420px){

  .rumude-v6115-social{
    gap:7px !important;
  }

  .rumude-v6115-social a[data-rumude-social]{
    padding:0 10px !important;
  }
}


/* =========================================================
   V6.11.9 — CONTACT CONTAINER WIDTH FIX
   ========================================================= */

#contact > .container{
  width:100% !important;
  max-width:1400px !important;
  min-width:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

#contact .section-head{
  width:100% !important;
  max-width:none !important;
}

#contact .contact-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:clamp(50px,7vw,110px) !important;
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-copy{
  width:100% !important;
  max-width:520px !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-form{
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-form input,
#contact .contact-form textarea{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

#contact .rumude-v6115-social{
  width:100% !important;
  max-width:520px !important;
}

@media(max-width:900px){

  #contact > .container{
    width:100% !important;
    max-width:none !important;
  }

  #contact .contact-grid{
    grid-template-columns:1fr !important;
    gap:50px !important;
  }

  #contact .contact-copy,
  #contact .contact-form{
    max-width:none !important;
  }
}

@media(max-width:560px){

  #contact{
    padding-left:20px !important;
    padding-right:20px !important;
  }

  #contact .contact-grid{
    gap:40px !important;
  }
}


/* =========================================================
   V6.11.10 — CONTACT ISOLATION
   Semua styling Contact hanya berlaku di #contact.
   Tidak mengubah section lain.
   ========================================================= */

#contact{
  width:100% !important;
  box-sizing:border-box !important;
}

#contact > .container{
  width:min(calc(100% - 64px), 1400px) !important;
  max-width:1400px !important;
  min-width:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

#contact > .container > .section-head{
  width:100% !important;
  max-width:none !important;
}

#contact .contact-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:clamp(50px,7vw,110px) !important;
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-copy{
  width:100% !important;
  max-width:520px !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-form{
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-form input,
#contact .contact-form textarea,
#contact .contact-form select{
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

#contact .rumude-v6115-social{
  width:100% !important;
  max-width:520px !important;
}

@media(max-width:900px){
  #contact > .container{
    width:calc(100% - 40px) !important;
    max-width:none !important;
  }

  #contact .contact-grid{
    grid-template-columns:1fr !important;
    gap:50px !important;
  }

  #contact .contact-copy,
  #contact .contact-form{
    max-width:none !important;
  }
}

@media(max-width:560px){
  #contact > .container{
    width:calc(100% - 32px) !important;
  }

  #contact .contact-grid{
    gap:40px !important;
  }

  #contact .rumude-v6115-social{
    max-width:none !important;
  }
}


/* =========================================================
   V6.11.11 — RUMUDE BLACK PREMIUM THEME
   ========================================================= */

:root{
  --ink:#f5f5f1 !important;
  --paper:#0b0b0b !important;
  --muted:#999 !important;
  --line:#292929 !important;
  --dark:#080808 !important;
  --white:#fff !important;
}

html,
body{
  background:#0b0b0b !important;
  color:#f5f5f1 !important;
}

body{
  color:#f5f5f1 !important;
}

.nav{
  background:rgba(11,11,11,.92) !important;
  border-bottom-color:#292929 !important;
  color:#fff !important;
}

.nav nav a{
  color:#fff !important;
}

.nav nav a:hover{
  opacity:.55 !important;
}

.brand{
  color:#fff !important;
}

.pill{
  color:#fff !important;
  border-color:#fff !important;
}

.pill:hover{
  background:#fff !important;
  color:#111 !important;
}

/* INTRO */

.intro{
  background:#0b0b0b !important;
  color:#fff !important;
  border-bottom-color:#292929 !important;
}

.intro h2,
.intro p{
  color:#fff !important;
}

.intro p{
  color:#aaa !important;
}

/* GENERAL SECTIONS */

.section{
  background:#0b0b0b !important;
  color:#fff !important;
}

.section h2,
.section-title{
  color:#fff !important;
}

.section-label,
.section-head{
  color:#fff !important;
}

.section-head>p{
  color:#999 !important;
}

.section-head>a{
  color:#fff !important;
}

/* WORK / CARDS */

.card{
  background:#171717 !important;
  border-color:#292929 !important;
}

.card .image{
  background:linear-gradient(135deg,#111,#444) !important;
}

.card .meta{
  color:#fff !important;
}

/* SERVICES */

.services{
  background:#0b0b0b !important;
  color:#fff !important;
}

.service-grid{
  border-top-color:#292929 !important;
}

.service{
  background:#0b0b0b !important;
  border-bottom-color:#292929 !important;
  color:#fff !important;
}

.service b,
.service h3{
  color:#fff !important;
}

.service p{
  color:#999 !important;
}

.service-grid,
.service{
  border-color:#292929 !important;
}

/* STATEMENT */

.statement{
  color:#fff !important;
}

.statement h2{
  color:#fff !important;
}

.statement-img{
  background:linear-gradient(135deg,#111,#444) !important;
}

/* ABOUT */

.about{
  background:#151515 !important;
  color:#fff !important;
}

.about h2{
  color:#fff !important;
}

.about p{
  color:#aaa !important;
}

.stats{
  background:#292929 !important;
}

.stats div{
  background:#151515 !important;
}

.stats b{
  color:#fff !important;
}

.stats span{
  color:#888 !important;
}

/* INSIGHTS */

.insights{
  background:#0b0b0b !important;
  color:#fff !important;
}

.insights .card{
  background:#151515 !important;
  border-color:#292929 !important;
}

/* CONTACT */

#contact{
  background:#0b0b0b !important;
  color:#fff !important;
}

#contact h2,
#contact .section-title{
  color:#fff !important;
}

#contact .section-label{
  color:#aaa !important;
}

#contact .contact-copy{
  color:#fff !important;
}

#contact .contact-links,
#contact .contact-links a,
#contact .contact-links span{
  color:#fff !important;
}

#contact .contact-form input,
#contact .contact-form textarea,
#contact .contact-form select{
  color:#fff !important;
  border-bottom-color:#444 !important;
  background:transparent !important;
}

#contact .contact-form input::placeholder,
#contact .contact-form textarea::placeholder{
  color:#777 !important;
}

#contact .contact-form input:focus,
#contact .contact-form textarea:focus,
#contact .contact-form select:focus{
  border-bottom-color:#fff !important;
}

#contact .contact-submit,
#contact .submit{
  background:#fff !important;
  color:#111 !important;
  border-color:#fff !important;
}

/* SOCIAL */

#contact .rumude-v6115-social a[data-rumude-social]{
  color:#fff !important;
  background:rgba(255,255,255,.06) !important;
  border-color:rgba(255,255,255,.25) !important;
}

#contact .rumude-v6115-social a[data-rumude-social]:hover{
  color:#111 !important;
  background:#fff !important;
  border-color:#fff !important;
}

/* FOOTER */

footer{
  background:#050505 !important;
  color:#999 !important;
  border-top:1px solid #292929 !important;
}

.footerbrand{
  color:#fff !important;
}

.footlinks{
  color:#fff !important;
}

.footlinks a{
  color:#fff !important;
}

/* MOBILE */

@media(max-width:900px){
  .nav{
    background:rgba(11,11,11,.96) !important;
  }
}


/* =========================================================
   V6.11.12 — CONTACT DARK PREMIUM LAYOUT
   ========================================================= */

#contact{
  display:block !important;
  width:100% !important;
  padding:110px 5vw 100px !important;
  background:#0b0b0b !important;
  color:#fff !important;
  box-sizing:border-box !important;
}

#contact > .container{
  width:100% !important;
  max-width:1400px !important;
  margin:0 auto !important;
  padding:0 !important;
  box-sizing:border-box !important;
}

#contact > .container > .section-head{
  display:flex !important;
  width:100% !important;
  max-width:none !important;
  margin-bottom:55px !important;
}

#contact .contact-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  align-items:start !important;
  column-gap:clamp(70px,8vw,140px) !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-copy{
  width:100% !important;
  max-width:560px !important;
  min-width:0 !important;
  margin:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-copy > .contact-links{
  display:grid !important;
  gap:9px !important;
  margin-top:32px !important;
}

#contact .contact-form{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
}

#contact .contact-form input,
#contact .contact-form textarea,
#contact .contact-form select{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  box-sizing:border-box !important;
}

#contact .contact-form textarea{
  min-height:150px !important;
  resize:vertical !important;
}

#contact .rumude-v6115-social{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:10px !important;
  width:100% !important;
  max-width:560px !important;
  margin-top:28px !important;
}

#contact .rumude-v6115-social a[data-rumude-social]{
  display:inline-flex !important;
  width:auto !important;
  min-width:0 !important;
  min-height:40px !important;
  padding:0 15px !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
}

/* Dark heading */
#contact .section-title,
#contact h2{
  color:#fff !important;
}

/* Dark form */
#contact .contact-form input,
#contact .contact-form textarea,
#contact .contact-form select{
  color:#fff !important;
  background:transparent !important;
  border-bottom:1px solid #3a3a3a !important;
}

#contact .contact-form input::placeholder,
#contact .contact-form textarea::placeholder{
  color:#777 !important;
}

#contact .contact-form input:focus,
#contact .contact-form textarea:focus,
#contact .contact-form select:focus{
  border-bottom-color:#fff !important;
}

/* Submit */
#contact .contact-submit,
#contact .submit{
  width:auto !important;
  min-width:200px !important;
  justify-self:start !important;
  background:#fff !important;
  color:#111 !important;
  border:1px solid #fff !important;
}

/* Mobile */
@media(max-width:900px){
  #contact{
    padding:90px 5vw !important;
  }

  #contact .contact-grid{
    grid-template-columns:1fr !important;
    row-gap:60px !important;
  }

  #contact .contact-copy,
  #contact .contact-form{
    max-width:none !important;
  }

  #contact .rumude-v6115-social{
    max-width:none !important;
  }
}

@media(max-width:560px){
  #contact{
    padding:75px 20px !important;
  }

  #contact .contact-grid{
    row-gap:45px !important;
  }

  #contact .rumude-v6115-social{
    gap:8px !important;
  }

  #contact .rumude-v6115-social a[data-rumude-social]{
    min-height:38px !important;
    padding:0 12px !important;
  }
}


/* =========================================================
   V6.11.13 — SERVICES DARK HOVER RESTORE
   ========================================================= */

#services,
.services{
  background:#0b0b0b !important;
  color:#fff !important;
}

#services .service,
.services .service{
  background:#0b0b0b !important;
  color:#fff !important;
  border-color:#292929 !important;
}

#services .service:hover,
#services .service:focus-within,
.services .service:hover,
.services .service:focus-within{
  background:#171717 !important;
  color:#fff !important;
}

#services .service b,
#services .service h3,
#services .service p,
.services .service b,
.services .service h3,
.services .service p{
  color:inherit !important;
}

#services .service p,
.services .service p{
  color:#999 !important;
}

#services .service:hover b,
#services .service:hover h3,
#services .service:hover p,
.services .service:hover b,
.services .service:hover h3,
.services .service:hover p{
  color:#fff !important;
}

#services .service a,
.services .service a{
  color:#fff !important;
}

#services .service-grid,
.services .service-grid{
  border-color:#292929 !important;
}


/* =========================================================
   V6.11.14 — SERVICES BACKGROUND LOCK
   ========================================================= */

#services #servicesList > .service,
#services #servicesList > .service.static-cms-item{
  background-color:#0b0b0b !important;
  background:#0b0b0b !important;
  color:#fff !important;
}

#services #servicesList > .service:hover,
#services #servicesList > .service.static-cms-item:hover,
#services #servicesList > .service:focus,
#services #servicesList > .service.static-cms-item:focus,
#services #servicesList > .service:focus-within,
#services #servicesList > .service.static-cms-item:focus-within{
  background-color:#171717 !important;
  background:#171717 !important;
  color:#fff !important;
}

#services #servicesList > .service > *,
#services #servicesList > .service.static-cms-item > *{
  background-color:transparent !important;
  color:inherit !important;
}

#services #servicesList > .service h3,
#services #servicesList > .service p,
#services #servicesList > .service .service-number,
#services #servicesList > .service .service-arrow{
  color:#fff !important;
}

#services #servicesList > .service p{
  color:#999 !important;
}

#services #servicesList > .service:hover p,
#services #servicesList > .service:focus-within p{
  color:#fff !important;
}


/* =========================================================
   V6.11.15 — SERVICES PSEUDO ELEMENT DARK OVERRIDE
   ========================================================= */

#services #servicesList > .service::before{
  background:#171717 !important;
}

#services #servicesList > .service:hover::before{
  background:#171717 !important;
}

#services #servicesList > .service:hover h3,
#services #servicesList > .service:hover p,
#services #servicesList > .service:hover .service-number,
#services #servicesList > .service:hover .service-arrow{
  color:#fff !important;
}

#services #servicesList > .service:hover{
  background:#171717 !important;
  color:#fff !important;
}


/* =========================================================
   V6.12.1 — PREMIUM HERO + NAVIGATION
   Scoped final visual layer.
   Services / Contact / CMS data untouched.
   ========================================================= */

/* ---------- NAVIGATION ---------- */

.site-header{
  position:sticky !important;
  top:0 !important;
  z-index:100 !important;
  background:transparent !important;
}

.site-header .nav{
  min-height:76px !important;
  height:76px !important;
  width:100% !important;
  padding:0 clamp(20px,5vw,72px) !important;
  display:flex !important;
  align-items:center !important;
  background:rgba(8,8,8,.86) !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  backdrop-filter:blur(18px) saturate(120%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(120%) !important;
}

.site-header .nav-links{
  display:flex !important;
  align-items:center !important;
  gap:clamp(20px,2.4vw,38px) !important;
}

.site-header .nav-links a{
  color:#fff !important;
  font-size:12px !important;
  font-weight:500 !important;
  letter-spacing:.02em !important;
  opacity:.72 !important;
  transition:opacity .25s ease,color .25s ease !important;
}

.site-header .nav-links a:hover,
.site-header .nav-links a.active{
  color:#fff !important;
  opacity:1 !important;
}

.site-header .nav-links .nav-cta{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:40px !important;
  padding:0 17px !important;
  border:1px solid rgba(255,255,255,.32) !important;
  border-radius:999px !important;
  color:#fff !important;
  background:rgba(255,255,255,.04) !important;
  opacity:1 !important;
  transition:
    background .25s ease,
    color .25s ease,
    border-color .25s ease,
    transform .25s ease !important;
}

.site-header .nav-links .nav-cta:hover{
  background:#fff !important;
  color:#080808 !important;
  border-color:#fff !important;
  transform:translateY(-1px) !important;
}

.site-header .mobile-button{
  width:42px !important;
  height:42px !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:column !important;
  gap:6px !important;
  background:transparent !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:50% !important;
  cursor:pointer !important;
}

.site-header .mobile-button span{
  display:block !important;
  width:16px !important;
  height:1px !important;
  background:#fff !important;
}

/* ---------- HERO ---------- */

section.hero{
  position:relative !important;
  isolation:isolate !important;
  min-height:min(860px,calc(100vh - 76px)) !important;
  width:100% !important;
  overflow:hidden !important;
  background:#080808 !important;
  color:#fff !important;
  display:flex !important;
  align-items:center !important;
}

section.hero::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-3 !important;
  background:
    radial-gradient(
      circle at 78% 38%,
      rgba(255,255,255,.085) 0%,
      rgba(255,255,255,.035) 18%,
      transparent 48%
    ) !important;
  pointer-events:none !important;
}

section.hero::after{
  content:"" !important;
  position:absolute !important;
  inset:auto 0 0 !important;
  height:38% !important;
  z-index:-2 !important;
  background:linear-gradient(
    to top,
    rgba(0,0,0,.65),
    transparent
  ) !important;
  pointer-events:none !important;
}

section.hero > .container.hero-content{
  position:relative !important;
  z-index:3 !important;
  width:min(100% - 10vw,1400px) !important;
  max-width:1400px !important;
  min-height:clamp(620px,calc(100vh - 76px),860px) !important;
  margin:0 auto !important;
  padding:clamp(90px,11vw,150px) 0 clamp(70px,8vw,110px) !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:flex-start !important;
}

section.hero #heroEyebrow{
  margin:0 0 25px !important;
  color:rgba(255,255,255,.55) !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:600 !important;
  letter-spacing:.24em !important;
  text-transform:uppercase !important;
}

section.hero #heroTitle{
  max-width:1050px !important;
  margin:0 !important;
  color:#fff !important;
  font-size:clamp(54px,7.4vw,112px) !important;
  line-height:.90 !important;
  letter-spacing:-.065em !important;
  font-weight:500 !important;
  text-wrap:balance !important;
}

section.hero #heroTitle span{
  display:block !important;
  color:rgba(255,255,255,.42) !important;
}

section.hero #heroText{
  max-width:540px !important;
  margin:34px 0 0 !important;
  color:rgba(255,255,255,.60) !important;
  font-size:clamp(15px,1.35vw,18px) !important;
  line-height:1.65 !important;
  letter-spacing:-.01em !important;
}

section.hero .hero-actions{
  display:flex !important;
  align-items:center !important;
  gap:18px !important;
  margin-top:42px !important;
}

section.hero .hero-arrow{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:48px !important;
  height:48px !important;
  border:1px solid rgba(255,255,255,.28) !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.035) !important;
  color:#fff !important;
  font-size:18px !important;
  transition:
    background .25s ease,
    border-color .25s ease,
    transform .25s ease !important;
}

section.hero .hero-arrow:hover{
  background:#fff !important;
  border-color:#fff !important;
  color:#080808 !important;
  transform:translateY(3px) !important;
}

section.hero .hero-scroll{
  color:rgba(255,255,255,.42) !important;
  font-size:10px !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
}

/* ---------- HERO GLOW ---------- */

section.hero .hero-glow{
  position:absolute !important;
  width:clamp(280px,42vw,680px) !important;
  height:clamp(280px,42vw,680px) !important;
  right:-8% !important;
  top:12% !important;
  z-index:-1 !important;
  border-radius:50% !important;
  background:radial-gradient(
    circle,
    rgba(255,255,255,.10) 0%,
    rgba(255,255,255,.035) 32%,
    transparent 70%
  ) !important;
  filter:blur(8px) !important;
  opacity:.75 !important;
  pointer-events:none !important;
}

/* ---------- MOBILE ---------- */

@media(max-width:900px){

  .site-header .nav{
    min-height:68px !important;
    height:68px !important;
    padding:0 5vw !important;
  }

  .site-header .nav-links{
    display:none !important;
  }

  .site-header .mobile-button{
    display:flex !important;
    margin-left:auto !important;
  }

  section.hero{
    min-height:calc(100svh - 68px) !important;
  }

  section.hero > .container.hero-content{
    width:90% !important;
    min-height:calc(100svh - 68px) !important;
    padding:85px 0 70px !important;
  }

  section.hero #heroTitle{
    max-width:760px !important;
    font-size:clamp(48px,10vw,78px) !important;
  }

  section.hero #heroText{
    max-width:520px !important;
    margin-top:27px !important;
  }

  section.hero .hero-actions{
    margin-top:34px !important;
  }

  section.hero .hero-glow{
    width:500px !important;
    height:500px !important;
    right:-35% !important;
    top:18% !important;
  }
}

@media(max-width:560px){

  .site-header .nav{
    padding:0 20px !important;
  }

  section.hero > .container.hero-content{
    width:calc(100% - 40px) !important;
    min-height:calc(100svh - 68px) !important;
    padding:75px 0 60px !important;
  }

  section.hero #heroEyebrow{
    margin-bottom:20px !important;
    font-size:9px !important;
    letter-spacing:.20em !important;
  }

  section.hero #heroTitle{
    font-size:clamp(46px,13.5vw,64px) !important;
    line-height:.92 !important;
    letter-spacing:-.06em !important;
  }

  section.hero #heroText{
    margin-top:25px !important;
    font-size:15px !important;
    line-height:1.6 !important;
  }

  section.hero .hero-actions{
    margin-top:30px !important;
  }

  section.hero .hero-arrow{
    width:44px !important;
    height:44px !important;
  }

  section.hero .hero-scroll{
    font-size:9px !important;
  }
}


/* =========================================================
   V6.12.2 — NAVIGATION VISIBILITY LOCK
   Fix legacy scrolled-state hiding.
   Hero / Services / CMS data untouched.
   ========================================================= */

#header.site-header,
#header.site-header.scrolled,
#header.site-header.rumude-nav-scrolled,
#header.site-header.rumude-v11-scrolled,
#header.site-header.scrolled.rumude-nav-scrolled,
#header.site-header.scrolled.rumude-v11-scrolled,
#header.site-header.rumude-nav-scrolled.rumude-v11-scrolled{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  transform:none !important;
  pointer-events:auto !important;
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:10000 !important;
}

#header.site-header .nav{
  visibility:visible !important;
  opacity:1 !important;
  transform:none !important;
  pointer-events:auto !important;
}

#header.site-header .logo,
#header.site-header #siteLogo,
#header.site-header .nav-links,
#header.site-header .nav-links a,
#header.site-header .nav-cta,
#header.site-header .mobile-button{
  visibility:visible !important;
  opacity:1 !important;
}

#header.site-header .nav-links{
  display:flex !important;
}

#header.site-header .nav-cta{
  display:inline-flex !important;
}

@media(max-width:900px){
  #header.site-header .nav-links{
    display:none !important;
  }

  #header.site-header .mobile-button{
    display:flex !important;
  }
}


/* =========================================================
   V6.12.3 — NAVIGATION LOGO VISIBILITY
   ========================================================= */

#header.site-header #siteLogo{
  display:flex !important;
  align-items:center !important;
  visibility:visible !important;
  opacity:1 !important;
  color:#fff !important;
  mix-blend-mode:normal !important;
  filter:none !important;
}

#header.site-header #siteLogo img,
#header.site-header #siteLogo > img,
#header.site-header #siteLogo > img.rumude-v694-logo-image{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  width:auto !important;
  height:auto !important;
  max-width:150px !important;
  max-height:34px !important;
  object-fit:contain !important;
  object-position:center !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}


/* V6.12.4 — NAV LOGO DIMENSIONS */

#header.site-header #siteLogo{
  width:auto !important;
  min-width:150px !important;
  max-width:190px !important;
}

#header.site-header #siteLogo img,
#header.site-header #siteLogo > img{
  display:block !important;
  width:150px !important;
  height:auto !important;
  max-width:150px !important;
  max-height:32px !important;
  object-fit:contain !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}

@media(max-width:560px){
  #header.site-header #siteLogo{
    min-width:120px !important;
  }

  #header.site-header #siteLogo img,
  #header.site-header #siteLogo > img{
    width:120px !important;
    max-width:120px !important;
  }
}


/* =========================================================
   V6.13.1 — INTRO + ABOUT PREMIUM EDITORIAL
   Scoped visual layer.
   Hero / Navigation / Work / Services / Contact untouched.
   ========================================================= */

/* ---------- INTRO ---------- */

#intro,
section.intro,
.intro{
  position:relative !important;
  width:100% !important;
  background:#0b0b0b !important;
  color:#f5f5f1 !important;
  border-top:1px solid #202020 !important;
  border-bottom:1px solid #202020 !important;
  padding:clamp(100px,12vw,170px) 5vw !important;
  box-sizing:border-box !important;
}

#intro > .container,
section.intro > .container{
  width:100% !important;
  max-width:1400px !important;
  margin:0 auto !important;
  box-sizing:border-box !important;
}

#intro .intro-copy,
.intro .intro-copy{
  max-width:1100px !important;
}

#intro .eyebrow,
.intro .eyebrow{
  color:rgba(255,255,255,.42) !important;
  font-size:10px !important;
  font-weight:600 !important;
  letter-spacing:.24em !important;
  text-transform:uppercase !important;
}

#intro h2,
.intro h2{
  max-width:1050px !important;
  margin:0 !important;
  color:#fff !important;
  font-size:clamp(42px,5.7vw,82px) !important;
  line-height:.96 !important;
  letter-spacing:-.055em !important;
  font-weight:500 !important;
}

#intro p,
.intro p{
  max-width:620px !important;
  margin-top:32px !important;
  color:rgba(255,255,255,.58) !important;
  font-size:clamp(16px,1.35vw,19px) !important;
  line-height:1.7 !important;
}

#intro::after,
.intro::after{
  content:"" !important;
  display:block !important;
  width:72px !important;
  height:1px !important;
  margin-top:65px !important;
  background:rgba(255,255,255,.28) !important;
}

/* ---------- ABOUT ---------- */

#about{
  position:relative !important;
  width:100% !important;
  background:#121212 !important;
  color:#fff !important;
  padding:clamp(105px,12vw,170px) 5vw !important;
  box-sizing:border-box !important;
}

#about > .container{
  width:100% !important;
  max-width:1400px !important;
  margin:0 auto !important;
  box-sizing:border-box !important;
}

#about .section-head{
  width:100% !important;
  max-width:none !important;
  margin-bottom:65px !important;
}

#about .section-label,
#about .eyebrow{
  color:rgba(255,255,255,.42) !important;
  letter-spacing:.22em !important;
}

#about .section-title,
#about h2{
  color:#fff !important;
  font-size:clamp(44px,5.5vw,78px) !important;
  line-height:.94 !important;
  letter-spacing:-.055em !important;
  font-weight:500 !important;
}

#about .about-copy{
  max-width:700px !important;
}

#about .about-copy p{
  color:rgba(255,255,255,.62) !important;
  font-size:clamp(16px,1.25vw,18px) !important;
  line-height:1.72 !important;
}

#about .stats{
  background:#292929 !important;
  border:1px solid #292929 !important;
}

#about .stats > div{
  background:#121212 !important;
  color:#fff !important;
  border:0 !important;
}

#about .stats b{
  color:#fff !important;
  font-weight:400 !important;
  letter-spacing:-.045em !important;
}

#about .stats span{
  color:rgba(255,255,255,.42) !important;
}

@media(max-width:900px){

  #intro,
  section.intro,
  .intro,
  #about{
    padding-left:5vw !important;
    padding-right:5vw !important;
  }

  #intro h2,
  .intro h2{
    font-size:clamp(42px,8vw,68px) !important;
  }

  #about .section-head{
    margin-bottom:45px !important;
  }
}

@media(max-width:560px){

  #intro,
  section.intro,
  .intro,
  #about{
    padding-left:20px !important;
    padding-right:20px !important;
  }

  #intro,
  section.intro,
  .intro{
    padding-top:85px !important;
    padding-bottom:90px !important;
  }

  #about{
    padding-top:90px !important;
    padding-bottom:90px !important;
  }

  #intro h2,
  .intro h2,
  #about .section-title,
  #about h2{
    font-size:clamp(40px,12vw,58px) !important;
  }

  #intro p,
  .intro p,
  #about .about-copy p{
    font-size:15px !important;
    line-height:1.65 !important;
  }
}


/* =========================================================
   V6.13.2 — SELECTED WORK BOUNDARY LOCK
   Prevent project reveal/text from leaking into About.
   ========================================================= */

#work{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate !important;
}

#work > .container{
  position:relative !important;
  z-index:1 !important;
}

#work #projectsList{
  position:relative !important;
  overflow:hidden !important;
}

#work #projectsList > .project{
  position:relative !important;
  overflow:hidden !important;
}

#about{
  position:relative !important;
  z-index:2 !important;
  isolation:isolate !important;
}


/* =========================================================
   V6.13.3 — INSIGHTS + FOOTER PREMIUM DARK
   Scoped final visual layer.
   Hero / Navigation / Services / About / Contact untouched.
   ========================================================= */

/* ---------- INSIGHTS ---------- */

#insights{
  position:relative !important;
  width:100% !important;
  background:#0b0b0b !important;
  color:#fff !important;
  padding:clamp(100px,11vw,150px) 5vw !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}

#insights > .container{
  width:100% !important;
  max-width:1400px !important;
  margin:0 auto !important;
  box-sizing:border-box !important;
}

#insights .section-head{
  width:100% !important;
  max-width:none !important;
  margin-bottom:60px !important;
}

#insights .section-label{
  color:rgba(255,255,255,.42) !important;
  font-size:10px !important;
  font-weight:600 !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
}

#insights .section-title,
#insights h2{
  color:#fff !important;
  font-size:clamp(44px,5.5vw,78px) !important;
  line-height:.94 !important;
  letter-spacing:-.055em !important;
  font-weight:500 !important;
}

#insights .section-head p{
  color:rgba(255,255,255,.48) !important;
}

/* CMS insight list */

#insights #insightsList{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:0 !important;
  width:100% !important;
  max-width:none !important;
  border-top:1px solid #292929 !important;
  background:#0b0b0b !important;
}

#insights #insightsList > .insight,
#insights #insightsList > .insight.static-cms-item{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  min-height:300px !important;
  padding:28px 28px 32px !important;
  margin:0 !important;
  border:0 !important;
  border-right:1px solid #292929 !important;
  border-bottom:1px solid #292929 !important;
  border-radius:0 !important;
  background:#0b0b0b !important;
  color:#fff !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  transition:
    background-color .28s ease,
    transform .28s ease,
    border-color .28s ease !important;
}

#insights #insightsList > .insight:nth-child(3n){
  border-right:0 !important;
}

#insights #insightsList > .insight:hover,
#insights #insightsList > .insight:focus-within{
  background:#151515 !important;
  transform:translateY(-3px) !important;
}

#insights #insightsList .insight-date{
  color:rgba(255,255,255,.38) !important;
  font-size:10px !important;
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
}

#insights #insightsList .insight-title{
  margin-top:auto !important;
  padding-top:70px !important;
  color:#fff !important;
  font-size:clamp(22px,2vw,30px) !important;
  line-height:1.05 !important;
  letter-spacing:-.035em !important;
  font-weight:500 !important;
}

#insights #insightsList .insight-arrow{
  position:absolute !important;
  top:28px !important;
  right:28px !important;
  color:rgba(255,255,255,.62) !important;
  font-size:18px !important;
  transition:
    color .25s ease,
    transform .25s ease !important;
}

#insights #insightsList > .insight:hover .insight-arrow,
#insights #insightsList > .insight:focus-within .insight-arrow{
  color:#fff !important;
  transform:translate(3px,-3px) !important;
}

/* prevent legacy light surfaces */
#insights #insightsList > .insight *,
#insights #insightsList > .insight.static-cms-item *{
  background-color:transparent !important;
}

/* ---------- FOOTER ---------- */

footer{
  position:relative !important;
  width:100% !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important;
  align-items:center !important;
  gap:30px !important;
  padding:32px 5vw !important;
  background:#050505 !important;
  color:rgba(255,255,255,.42) !important;
  border-top:1px solid #292929 !important;
  box-sizing:border-box !important;
}

footer .footerbrand{
  color:#fff !important;
  font-size:12px !important;
  font-weight:600 !important;
  letter-spacing:.14em !important;
}

footer .footerbrand img{
  filter:none !important;
  mix-blend-mode:normal !important;
  opacity:1 !important;
}

footer .footlinks{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:22px !important;
}

footer .footlinks a{
  color:rgba(255,255,255,.58) !important;
  font-size:11px !important;
  transition:color .22s ease,opacity .22s ease !important;
}

footer .footlinks a:hover{
  color:#fff !important;
  opacity:1 !important;
}

footer .footer-copy,
footer small,
footer p{
  color:rgba(255,255,255,.36) !important;
  font-size:10px !important;
}

@media(max-width:900px){

  #insights{
    padding-left:5vw !important;
    padding-right:5vw !important;
  }

  #insights #insightsList{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  #insights #insightsList > .insight:nth-child(3n){
    border-right:1px solid #292929 !important;
  }

  #insights #insightsList > .insight:nth-child(2n){
    border-right:0 !important;
  }

  footer{
    grid-template-columns:1fr !important;
    gap:22px !important;
    align-items:start !important;
  }

  footer .footlinks{
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }
}

@media(max-width:560px){

  #insights{
    padding:80px 20px 90px !important;
  }

  #insights .section-head{
    margin-bottom:42px !important;
  }

  #insights .section-title,
  #insights h2{
    font-size:clamp(40px,12vw,58px) !important;
  }

  #insights #insightsList{
    grid-template-columns:1fr !important;
  }

  #insights #insightsList > .insight,
  #insights #insightsList > .insight.static-cms-item{
    min-height:250px !important;
    padding:24px 22px 28px !important;
    border-right:0 !important;
  }

  #insights #insightsList .insight-title{
    padding-top:55px !important;
    font-size:24px !important;
  }

  #insights #insightsList .insight-arrow{
    top:24px !important;
    right:22px !important;
  }

  footer{
    padding:28px 20px !important;
  }

  footer .footlinks{
    gap:15px !important;
  }
}


/* =========================================================
   V6.14.2 — MOBILE NAVIGATION RUNTIME FIX
   Scoped only to mobile navigation.
   ========================================================= */

@media(max-width:900px){
  #header.site-header .mobile-menu{
    display:block !important;
    position:fixed !important;
    top:68px !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    max-height:calc(100svh - 68px) !important;
    overflow-y:auto !important;
    background:#080808 !important;
    border-top:1px solid rgba(255,255,255,.10) !important;
    z-index:9999 !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(-10px) !important;
    transition:
      opacity .25s ease,
      visibility .25s ease,
      transform .25s ease !important;
  }

  #header.site-header .mobile-menu.open{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
  }

  #header.site-header .mobile-menu-inner{
    width:100% !important;
    padding:22px 20px 30px !important;
  }

  #header.site-header .mobile-menu a{
    display:block !important;
    width:100% !important;
    padding:17px 0 !important;
    color:#fff !important;
    border-bottom:1px solid rgba(255,255,255,.10) !important;
    font-size:15px !important;
  }

  #header.site-header .mobile-menu a:last-child{
    border-bottom:0 !important;
  }

  body.mobile-menu-open{
    overflow:hidden !important;
  }
}

@media(min-width:901px){
  #header.site-header .mobile-menu{
    display:none !important;
  }
}


/* V6.19 HERO REPOSITION
   -----------------------------------------
   Logo/header tetap.
   Hero eyebrow       : kiri atas
   Hero title         : center
   Hero description   : kiri bawah
   Hero scroll        : kanan bawah
   ----------------------------------------- */

section.hero{
  position:relative;
  min-height:calc(100vh - 76px);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

section.hero > .container.hero-content{
  position:relative;
  width:min(calc(100% - 10vw), var(--max));
  min-height:calc(100vh - 76px);
  margin:0 auto;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

section.hero #heroEyebrow{
  position:absolute;
  top:10vh;
  left:0;
  margin:0;
  text-align:left;
  z-index:3;
}

section.hero #heroTitle{
  width:min(100%,1100px);
  margin:0 auto;
  text-align:center;
  position:relative;
  z-index:2;
}

section.hero #heroText{
  position:absolute;
  left:0;
  bottom:7vh;
  margin:0;
  max-width:520px;
  text-align:left;
  z-index:3;
}

section.hero .hero-actions{
  position:absolute;
  right:0;
  bottom:6vh;
  margin:0;
  z-index:3;
}

section.hero .hero-scroll{
  position:absolute;
  right:0;
  bottom:7vh;
  margin:0;
  text-align:right;
  z-index:3;
}

/* Mobile */
@media(max-width:850px){

  section.hero{
    min-height:calc(100svh - 70px);
    padding-top:0;
  }

  section.hero > .container.hero-content{
    width:calc(100% - 40px);
    min-height:calc(100svh - 70px);
    padding:0;
  }

  section.hero #heroEyebrow{
    top:5vh;
    left:0;
  }

  section.hero #heroTitle{
    width:100%;
  }

  section.hero #heroText{
    left:0;
    bottom:12vh;
    max-width:72%;
    font-size:15px;
    text-align:left;
  }

  section.hero .hero-actions{
    right:0;
    bottom:5vh;
  }

  section.hero .hero-scroll{
    right:0;
    bottom:6vh;
    font-size:9px;
  }
}

@media(max-width:560px){

  section.hero > .container.hero-content{
    width:calc(100% - 30px);
  }

  section.hero #heroEyebrow{
    top:4vh;
    left:0;
    font-size:9px;
  }

  section.hero #heroTitle{
    font-size:clamp(48px,13vw,68px);
    letter-spacing:-3px;
  }

  section.hero #heroText{
    bottom:13vh;
    max-width:78%;
    font-size:14px;
  }

  section.hero .hero-scroll{
    bottom:5vh;
    font-size:8px;
  }
}

/* =========================================================
   RUMUDE V6.19.1 — FINAL HERO POSITION
   ========================================================= */

section.hero{
  position:relative !important;
  min-height:calc(100vh - 76px) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
}

section.hero > .container.hero-content{
  position:relative !important;
  width:min(calc(100% - 10vw), var(--max)) !important;
  min-height:calc(100vh - 76px) !important;
  height:calc(100vh - 76px) !important;
  margin:0 auto !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
}

/* 1 — CREATIVE DIGITAL STUDIO
      kiri atas, di bawah area logo/navbar */
section.hero #heroEyebrow{
  position:absolute !important;
  top:8vh !important;
  left:0 !important;
  right:auto !important;
  margin:0 !important;
  text-align:left !important;
  z-index:10 !important;
}

/* 2 — JUDUL BESAR
      tetap center */
section.hero #heroTitle{
  position:relative !important;
  z-index:5 !important;
  width:min(100%,1100px) !important;
  margin:0 auto !important;
  text-align:center !important;
}

/* 3 — DESCRIPTION
      kiri bawah */
section.hero #heroText{
  position:absolute !important;
  left:0 !important;
  right:auto !important;
  bottom:8vh !important;
  margin:0 !important;
  width:min(520px,42vw) !important;
  max-width:520px !important;
  text-align:left !important;
  z-index:10 !important;
}

/* Wrapper tidak boleh ikut layout normal */
section.hero .hero-actions{
  position:static !important;
  display:block !important;
  width:100% !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
}

/* Arrow tetap kanan bawah */
section.hero .hero-arrow{
  position:absolute !important;
  right:0 !important;
  bottom:6vh !important;
  z-index:10 !important;
}

/* 4 — SCROLL TO EXPLORE
      kanan bawah, sejajar dengan area bawah */
section.hero .hero-scroll{
  position:absolute !important;
  right:72px !important;
  bottom:8vh !important;
  margin:0 !important;
  z-index:10 !important;
  text-align:right !important;
  white-space:nowrap !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:850px){

  section.hero{
    min-height:calc(100svh - 70px) !important;
  }

  section.hero > .container.hero-content{
    width:calc(100% - 40px) !important;
    min-height:calc(100svh - 70px) !important;
    height:calc(100svh - 70px) !important;
  }

  section.hero #heroEyebrow{
    top:5vh !important;
    left:0 !important;
  }

  section.hero #heroTitle{
    width:100% !important;
  }

  section.hero #heroText{
    left:0 !important;
    bottom:12vh !important;
    width:min(72%,420px) !important;
    max-width:72% !important;
    font-size:15px !important;
    text-align:left !important;
  }

  section.hero .hero-scroll{
    right:58px !important;
    bottom:6vh !important;
    font-size:9px !important;
  }

  section.hero .hero-arrow{
    right:0 !important;
    bottom:4.8vh !important;
  }
}

@media(max-width:560px){

  section.hero > .container.hero-content{
    width:calc(100% - 30px) !important;
  }

  section.hero #heroEyebrow{
    top:4vh !important;
    font-size:9px !important;
  }

  section.hero #heroTitle{
    font-size:clamp(48px,13vw,68px) !important;
    letter-spacing:-3px !important;
  }

  section.hero #heroText{
    bottom:13vh !important;
    width:78% !important;
    max-width:78% !important;
    font-size:14px !important;
  }

  section.hero .hero-scroll{
    right:48px !important;
    bottom:5vh !important;
    font-size:8px !important;
  }

  section.hero .hero-arrow{
    right:0 !important;
    bottom:3.8vh !important;
  }
}


/* =========================================================
   RUMUDE V6.19.7 — HERO CONTAINING BLOCK FIX
   Fix posisi terhadap hero-content yang sebenarnya.
   ========================================================= */

section.hero{
  position:relative !important;
  min-height:100vh !important;
  height:100vh !important;
  overflow:hidden !important;
}

/* HERO CONTENT menjadi containing block utama */
section.hero .hero-content{
  position:absolute !important;
  inset:0 !important;

  width:100% !important;
  max-width:none !important;

  height:100% !important;
  min-height:100% !important;

  margin:0 !important;
  padding:0 5vw !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  box-sizing:border-box !important;
}

/* CREATIVE DIGITAL STUDIO
   kiri atas, tepat di bawah area navbar */
section.hero .hero-content #heroEyebrow{
  position:absolute !important;

  top:108px !important;
  left:5vw !important;
  right:auto !important;

  width:auto !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 !important;

  text-align:left !important;

  z-index:20 !important;
}

/* JUDUL BESAR
   tetap center */
section.hero .hero-content #heroTitle{
  position:relative !important;

  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;

  width:min(1100px,90vw) !important;
  max-width:1100px !important;

  margin:0 auto !important;

  text-align:center !important;

  z-index:5 !important;
}

/* DESCRIPTION
   kiri bawah */
section.hero .hero-content #heroText{
  position:absolute !important;

  left:5vw !important;
  right:auto !important;
  bottom:72px !important;

  width:min(520px,42vw) !important;
  max-width:520px !important;

  margin:0 !important;
  padding:0 !important;

  text-align:left !important;

  z-index:20 !important;
}

/* ACTION WRAPPER
   tidak ikut menggeser title */
section.hero .hero-content .hero-actions{
  position:absolute !important;

  inset:0 !important;

  width:100% !important;
  height:100% !important;

  margin:0 !important;
  padding:0 !important;

  display:block !important;

  pointer-events:none !important;

  z-index:20 !important;
}

/* SCROLL TO EXPLORE
   kanan bawah */
section.hero .hero-content .hero-actions .hero-scroll{
  position:absolute !important;

  right:72px !important;
  bottom:72px !important;

  top:auto !important;
  left:auto !important;

  margin:0 !important;

  text-align:right !important;
  white-space:nowrap !important;

  pointer-events:auto !important;

  z-index:21 !important;
}

/* PANAH
   kanan bawah */
section.hero .hero-content .hero-actions .hero-arrow{
  position:absolute !important;

  right:0 !important;
  bottom:62px !important;

  top:auto !important;
  left:auto !important;

  margin:0 !important;

  pointer-events:auto !important;

  z-index:21 !important;
}

/* MOBILE */
@media(max-width:850px){

  section.hero{
    min-height:100svh !important;
    height:100svh !important;
  }

  section.hero .hero-content{
    width:100% !important;
    height:100% !important;
    padding:0 20px !important;
  }

  section.hero .hero-content #heroEyebrow{
    top:92px !important;
    left:20px !important;

    font-size:9px !important;

    text-align:left !important;
  }

  section.hero .hero-content #heroTitle{
    width:100% !important;
    max-width:100% !important;

    font-size:clamp(48px,13vw,68px) !important;
    letter-spacing:-3px !important;
  }

  section.hero .hero-content #heroText{
    left:20px !important;
    bottom:88px !important;

    width:min(72%,420px) !important;
    max-width:72% !important;

    font-size:14px !important;
    line-height:1.5 !important;

    text-align:left !important;
  }

  section.hero .hero-content .hero-actions .hero-scroll{
    right:58px !important;
    bottom:48px !important;

    font-size:8px !important;
  }

  section.hero .hero-content .hero-actions .hero-arrow{
    right:0 !important;
    bottom:38px !important;
  }
}

@media(max-width:560px){

  section.hero .hero-content{
    padding:0 15px !important;
  }

  section.hero .hero-content #heroEyebrow{
    top:82px !important;
    left:15px !important;
  }

  section.hero .hero-content #heroTitle{
    font-size:clamp(44px,13vw,64px) !important;
    letter-spacing:-3px !important;
  }

  section.hero .hero-content #heroText{
    left:15px !important;
    bottom:82px !important;

    width:78% !important;
    max-width:78% !important;
  }

  section.hero .hero-content .hero-actions .hero-scroll{
    right:48px !important;
    bottom:43px !important;
  }

  section.hero .hero-content .hero-actions .hero-arrow{
    right:0 !important;
    bottom:33px !important;
  }
}


/* =========================================================
   RUMUDE V6.19.8 — HERO TRANSFORM / ANIMATION RESET
   ========================================================= */

/* Jangan biarkan animasi hero lama mengubah containing block */
section.hero .hero-content{
  position:absolute !important;

  inset:0 !important;

  width:100vw !important;
  max-width:none !important;
  min-width:100vw !important;

  height:100vh !important;
  min-height:100vh !important;

  margin:0 !important;
  padding:0 5vw !important;

  box-sizing:border-box !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  transform:none !important;
  animation:none !important;

  translate:none !important;
  scale:none !important;
  rotate:none !important;
}

/* Matikan transform pada elemen hero yang diwarisi dari animasi lama */
section.hero #heroEyebrow,
section.hero #heroTitle,
section.hero #heroText,
section.hero .hero-actions,
section.hero .hero-scroll,
section.hero .hero-arrow{
  transform:none !important;
}

/* Eyebrow */
section.hero .hero-content #heroEyebrow{
  position:absolute !important;

  top:108px !important;
  left:5vw !important;
  right:auto !important;

  width:auto !important;
  max-width:none !important;

  margin:0 !important;

  text-align:left !important;

  animation:none !important;
}

/* Title */
section.hero .hero-content #heroTitle{
  position:relative !important;

  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;

  width:min(1100px,90vw) !important;
  max-width:1100px !important;

  height:auto !important;

  margin:0 auto !important;

  text-align:center !important;

  animation:none !important;
}

/* Description */
section.hero .hero-content #heroText{
  position:absolute !important;

  left:5vw !important;
  right:auto !important;
  bottom:72px !important;

  width:520px !important;
  max-width:42vw !important;

  height:auto !important;

  margin:0 !important;

  text-align:left !important;

  animation:none !important;
}

/* Action layer */
section.hero .hero-content .hero-actions{
  position:absolute !important;

  inset:0 !important;

  width:100% !important;
  min-width:100% !important;
  max-width:none !important;

  height:100% !important;

  margin:0 !important;
  padding:0 !important;

  display:block !important;

  transform:none !important;
  animation:none !important;

  pointer-events:none !important;
}

/* Scroll */
section.hero .hero-content .hero-actions .hero-scroll{
  position:absolute !important;

  top:auto !important;
  left:auto !important;

  right:72px !important;
  bottom:72px !important;

  width:auto !important;

  margin:0 !important;

  transform:none !important;
  animation:none !important;

  white-space:nowrap !important;
}

/* Arrow */
section.hero .hero-content .hero-actions .hero-arrow{
  position:absolute !important;

  top:auto !important;
  left:auto !important;

  right:0 !important;
  bottom:62px !important;

  transform:none !important;
  animation:none !important;
}

/* MOBILE */
@media(max-width:850px){

  section.hero .hero-content{
    width:100vw !important;
    min-width:100vw !important;
    height:100svh !important;
    min-height:100svh !important;

    padding:0 20px !important;
  }

  section.hero .hero-content #heroEyebrow{
    top:92px !important;
    left:20px !important;
  }

  section.hero .hero-content #heroTitle{
    width:100% !important;
    max-width:100% !important;

    height:auto !important;
  }

  section.hero .hero-content #heroText{
    left:20px !important;
    bottom:88px !important;

    width:72% !important;
    max-width:72% !important;
  }

  section.hero .hero-content .hero-actions .hero-scroll{
    right:58px !important;
    bottom:48px !important;
  }

  section.hero .hero-content .hero-actions .hero-arrow{
    right:0 !important;
    bottom:38px !important;
  }
}

@media(max-width:560px){

  section.hero .hero-content{
    padding:0 15px !important;
  }

  section.hero .hero-content #heroEyebrow{
    top:82px !important;
    left:15px !important;
  }

  section.hero .hero-content #heroTitle{
    width:100% !important;
    max-width:100% !important;
  }

  section.hero .hero-content #heroText{
    left:15px !important;
    bottom:82px !important;
    width:78% !important;
    max-width:78% !important;
  }

  section.hero .hero-content .hero-actions .hero-scroll{
    right:48px !important;
    bottom:43px !important;
  }

  section.hero .hero-content .hero-actions .hero-arrow{
    right:0 !important;
    bottom:33px !important;
  }
}


/* =========================================================
   RUMUDE V6.19.9 — FINAL HERO CONTAINING BLOCK
   ========================================================= */

section.hero > .container.hero-content{
  position:absolute !important;

  top:0 !important;
  left:0 !important;
  right:auto !important;
  bottom:auto !important;

  inset:auto !important;

  width:100vw !important;
  max-width:none !important;
  min-width:100vw !important;

  height:100vh !important;
  min-height:100vh !important;

  margin:0 !important;

  padding:0 5vw !important;
  box-sizing:border-box !important;

  transform:none !important;
  translate:none !important;
  scale:none !important;
  rotate:none !important;

  animation:none !important;
}

/* Pastikan semua child dihitung terhadap viewport hero */
section.hero > .container.hero-content #heroEyebrow{
  left:5vw !important;
}

section.hero > .container.hero-content #heroText{
  left:5vw !important;
}

section.hero > .container.hero-content .hero-actions{
  left:0 !important;
  right:auto !important;

  width:100vw !important;
  min-width:100vw !important;

  transform:none !important;
}

section.hero > .container.hero-content .hero-actions .hero-scroll{
  right:72px !important;
}

section.hero > .container.hero-content .hero-actions .hero-arrow{
  right:0 !important;
}

@media(max-width:850px){

  section.hero > .container.hero-content{
    width:100vw !important;
    min-width:100vw !important;

    height:100svh !important;
    min-height:100svh !important;

    padding:0 20px !important;
  }

  section.hero > .container.hero-content #heroEyebrow{
    left:20px !important;
  }

  section.hero > .container.hero-content #heroText{
    left:20px !important;
  }

  section.hero > .container.hero-content .hero-actions{
    width:100vw !important;
    min-width:100vw !important;
  }

}

@media(max-width:560px){

  section.hero > .container.hero-content{
    padding:0 15px !important;
  }

  section.hero > .container.hero-content #heroEyebrow{
    left:15px !important;
  }

  section.hero > .container.hero-content #heroText{
    left:15px !important;
  }

}


/* =========================================================
   RUMUDE V6.20 — HERO STAGE FINAL FIX
   Root cause:
   .rumude-v30-hero-stage = sticky + width:0 + centered offset
   ========================================================= */

section.hero .rumude-v30-hero-stage{
  position:absolute !important;

  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;

  width:100% !important;
  min-width:100% !important;
  max-width:none !important;

  height:100% !important;
  min-height:100% !important;

  margin:0 !important;
  padding:0 !important;

  display:block !important;

  transform:none !important;
  translate:none !important;
  scale:none !important;
  rotate:none !important;

  inset:0 !important;
}

/* Hero content sekarang dihitung terhadap full hero stage */
section.hero .rumude-v30-hero-stage .hero-content{
  position:absolute !important;

  top:0 !important;
  left:0 !important;
  right:auto !important;
  bottom:auto !important;

  width:100% !important;
  min-width:100% !important;
  max-width:none !important;

  height:100% !important;
  min-height:100% !important;

  margin:0 !important;

  padding:0 5vw !important;
  box-sizing:border-box !important;

  transform:none !important;
  translate:none !important;
  scale:none !important;
  rotate:none !important;
}

/* Eyebrow — kiri atas bawah logo */
section.hero .rumude-v30-hero-stage #heroEyebrow{
  position:absolute !important;

  top:108px !important;
  left:5vw !important;
  right:auto !important;

  width:auto !important;
  max-width:none !important;

  margin:0 !important;

  text-align:left !important;
}

/* Title — tetap center */
section.hero .rumude-v30-hero-stage #heroTitle{
  position:relative !important;

  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;

  width:min(1100px,90vw) !important;
  max-width:1100px !important;

  height:auto !important;

  margin:0 auto !important;

  text-align:center !important;

  transform:none !important;
}

/* Description — kiri bawah */
section.hero .rumude-v30-hero-stage #heroText{
  position:absolute !important;

  top:auto !important;
  left:5vw !important;
  right:auto !important;
  bottom:72px !important;

  width:min(520px,42vw) !important;
  max-width:520px !important;

  height:auto !important;

  margin:0 !important;

  text-align:left !important;

  transform:none !important;
}

/* Action layer */
section.hero .rumude-v30-hero-stage .hero-actions{
  position:absolute !important;

  top:0 !important;
  left:0 !important;
  right:auto !important;
  bottom:auto !important;

  width:100% !important;
  min-width:100% !important;
  max-width:none !important;

  height:100% !important;

  margin:0 !important;
  padding:0 !important;

  display:block !important;

  transform:none !important;
  pointer-events:none !important;
}

/* Scroll — kanan bawah */
section.hero .rumude-v30-hero-stage .hero-scroll{
  position:absolute !important;

  top:auto !important;
  left:auto !important;

  right:72px !important;
  bottom:72px !important;

  width:auto !important;

  margin:0 !important;

  transform:none !important;

  white-space:nowrap !important;
  pointer-events:auto !important;
}

/* Arrow */
section.hero .rumude-v30-hero-stage .hero-arrow{
  position:absolute !important;

  top:auto !important;
  left:auto !important;

  right:0 !important;
  bottom:62px !important;

  margin:0 !important;

  transform:none !important;
  pointer-events:auto !important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:850px){

  section.hero .rumude-v30-hero-stage{
    width:100% !important;
    min-width:100% !important;
    height:100% !important;
  }

  section.hero .rumude-v30-hero-stage .hero-content{
    width:100% !important;
    min-width:100% !important;

    height:100% !important;
    min-height:100% !important;

    padding:0 20px !important;
  }

  section.hero .rumude-v30-hero-stage #heroEyebrow{
    top:92px !important;
    left:20px !important;
  }

  section.hero .rumude-v30-hero-stage #heroTitle{
    width:100% !important;
    max-width:100% !important;
  }

  section.hero .rumude-v30-hero-stage #heroText{
    left:20px !important;
    bottom:88px !important;

    width:72% !important;
    max-width:72% !important;
  }

  section.hero .rumude-v30-hero-stage .hero-scroll{
    right:58px !important;
    bottom:48px !important;
  }

  section.hero .rumude-v30-hero-stage .hero-arrow{
    right:0 !important;
    bottom:38px !important;
  }
}

@media(max-width:560px){

  section.hero .rumude-v30-hero-stage .hero-content{
    padding:0 15px !important;
  }

  section.hero .rumude-v30-hero-stage #heroEyebrow{
    top:82px !important;
    left:15px !important;
  }

  section.hero .rumude-v30-hero-stage #heroText{
    left:15px !important;
    bottom:82px !important;

    width:78% !important;
    max-width:78% !important;
  }

  section.hero .rumude-v30-hero-stage .hero-scroll{
    right:48px !important;
    bottom:43px !important;
  }

  section.hero .rumude-v30-hero-stage .hero-arrow{
    right:0 !important;
    bottom:33px !important;
  }
}



/* Flash tipis saat karakter selesai decode */
section.hero #heroTitle.code-decoded .code-char{
  animation:
    rumudeCodeReveal 1.25s
      cubic-bezier(.22,1,.36,1)
      both,
    rumudeCodeSettle .7s
      ease-out
      calc(1.25s + var(--code-i) * .035s)
      both;
}

@keyframes rumudeCodeSettle{

  0%{
    text-shadow:0 0 12px currentColor;
  }

  100%{
    text-shadow:none;
  }

}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){

  section.hero #heroTitle .code-char{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
  }

}

/* Mobile */
@media(max-width:850px){

  section.hero #heroTitle .code-char{
    animation-duration:1s;
    animation-delay:calc(var(--code-i) * .025s);
  }

}


/* =========================================================
   RUMUDE V6.22.4 — CLEAN HERO FINAL
   Plain title. No Wavy. No Editorial. No loading.
   ========================================================= */

section.hero #heroTitle{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  position:relative !important;

  width:min(1100px,90vw) !important;
  max-width:1100px !important;

  height:auto !important;

  margin:0 auto !important;

  color:#fff !important;
  text-align:center !important;

  transform:none !important;
  filter:none !important;
  animation:none !important;
  transition:none !important;

  overflow:visible !important;
  will-change:auto !important;
}

section.hero #heroTitle span{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;

  transform:none !important;
  filter:none !important;
  animation:none !important;
}

section.hero #heroTitle::before,
section.hero #heroTitle::after{
  display:none !important;
  content:none !important;
}


/* =========================================================
   RUMUDE V6.23 — PREMIUM TYPOGRAPHY & HERO POLISH
   No animation
   ========================================================= */

section.hero #heroTitle{
  width:min(1000px,88vw) !important;
  max-width:1000px !important;
  margin:0 auto !important;

  font-size:clamp(58px,7.05vw,108px) !important;
  line-height:.88 !important;
  letter-spacing:-.068em !important;
  font-weight:500 !important;

  text-align:center !important;
  text-wrap:balance !important;
  overflow:visible !important;

  animation:none !important;
  transition:none !important;
  transform:none !important;
  filter:none !important;
  opacity:1 !important;
  visibility:visible !important;
}

section.hero #heroTitle span{
  display:block !important;
  margin:0 !important;
  padding:0 !important;

  font-weight:500 !important;
  letter-spacing:-.068em !important;

  animation:none !important;
  transition:none !important;
  transform:none !important;
  filter:none !important;
  opacity:1 !important;
  visibility:visible !important;
}

@media (max-width:1100px){
  section.hero #heroTitle{
    width:min(900px,88vw) !important;
    font-size:clamp(54px,7.4vw,88px) !important;
  }
}

@media (max-width:700px){
  section.hero #heroTitle{
    width:calc(100vw - 40px) !important;
    max-width:none !important;
    font-size:clamp(42px,11.5vw,68px) !important;
    line-height:.91 !important;
    letter-spacing:-.06em !important;
  }

  section.hero #heroTitle span{
    letter-spacing:-.06em !important;
  }
}

@media (max-width:420px){
  section.hero #heroTitle{
    width:calc(100vw - 32px) !important;
    font-size:clamp(38px,11.8vw,54px) !important;
  }
}