
:root{
  --black:#070808;
  --black-2:#101112;
  --paper:#f5f3ef;
  --paper-2:#efede8;
  --ink:#141414;
  --muted:#585650;
  --line:#dad6cf;
  --white:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--black);
  color:#fff;
  font-family:Arial, Helvetica, sans-serif;
}
img{display:block;width:100%}
a{text-decoration:none;color:inherit}
.wrap{width:min(1380px,92vw);margin:0 auto}

h1,h2,h3{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;
  margin:0;
}
h1{font-size:clamp(56px,5.65vw,90px);line-height:.96;letter-spacing:-.035em}
h2{font-size:clamp(40px,3.5vw,56px);line-height:1.02;letter-spacing:-.025em}
h3{font-size:28px;line-height:1.05}
p{margin:0}
.kicker{
  font-size:12px;
  letter-spacing:.20em;
  color:#7e7a72;
  margin-bottom:14px;
}
.kicker-dark{color:#bbb5ae}

.topbar{
  position:absolute;
  top:0;left:0;right:0;
  z-index:50;
  height:92px;
  display:flex;
  align-items:center;
}
.topbar-inner{
  width:min(1420px,94vw);
  margin:0 auto;
  display:grid;
  grid-template-columns:270px 1fr 250px;
  align-items:center;
  gap:20px;
}
.logo img{height:50px;width:auto}
.nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:34px;
}
.nav a{
  font-size:14px;
  color:#f3f3f3;
  padding:7px 0;
  border-bottom:1px solid transparent;
}
.nav a.active,.nav a:hover{border-color:#c9b79d}
.top-cta{
  justify-self:end;
  background:rgba(0,0,0,.55);
  color:#fff;
  border:1px solid rgba(255,255,255,.78);
  padding:17px 19px;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:12px;
  font-weight:700;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.top-cta:hover{
  background:#fff;
  color:#000;
  border-color:#fff;
}
.menu-toggle{display:none}

.hero{
  position:relative;
  min-height:clamp(700px,78svh,920px);
  overflow:hidden;
  background:#111;
}
.hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:58% 52%;
}
.hero-shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.72) 27%,rgba(0,0,0,.25) 58%,rgba(0,0,0,.08) 100%),
    linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.08) 55%,rgba(0,0,0,.32));
}
.hero-inner{
  position:relative;
  z-index:2;
  width:min(1380px,92vw);
  min-height:clamp(700px,78svh,920px);
  margin:0 auto;
  padding-top:clamp(118px,10vw,148px);
  padding-bottom:clamp(54px,7vw,88px);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
}
.hero-copy{
  align-self:start;
  max-width:600px;
}
.hero-copy p{
  margin-top:24px;
  max-width:545px;
  font-size:19px;
  line-height:1.42;
  color:#f3f3f3;
}
.hero-buttons{
  margin-top:28px;
  display:flex;
  flex-wrap:wrap;
  gap:15px;
}
.button{
  display:inline-block;
  padding:17px 24px;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-weight:700;
  border:1px solid rgba(255,255,255,.42);
}
.button-light,
.button-outline{
  background:rgba(0,0,0,.55);
  color:#fff;
  border-color:rgba(255,255,255,.78);
}
.button-light:hover,
.button-outline:hover{
  background:#fff;
  color:#000;
  border-color:#fff;
}
.hero-note{
  align-self:end;
  margin-bottom:42px;
  padding-left:15px;
  border-left:1px solid rgba(255,255,255,.45);
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:12px;
  letter-spacing:.11em;
  line-height:1.2;
}

.why{
  background:var(--paper);
  color:var(--ink);
  padding:44px 0 40px;
}
.why-grid{
  display:grid;
  grid-template-columns:1.1fr 1.15fr;
  gap:50px;
  align-items:center;
}
.why-copy p{
  margin-top:18px;
  max-width:610px;
  font-size:16px;
  line-height:1.53;
  color:#3c3b38;
}
.value-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}
.value{
  min-height:135px;
  padding:10px 22px;
  border-left:1px solid var(--line);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.value:first-child{border-left:none}
.value svg{
  width:42px;height:42px;
  margin-bottom:15px;
  fill:none;
  stroke:#111;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.value span{
  max-width:150px;
  font-size:14px;
  line-height:1.42;
}

.portfolio{
  background:#050606;
  padding:29px 0 24px;
}
.section-head{
  display:flex;
  justify-content:space-between;
  align-items:start;
  gap:20px;
  margin-bottom:23px;
}
.section-head a{
  margin-top:14px;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.portfolio-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.portfolio-row figure{
  margin:0;
  height:260px;
  overflow:hidden;
}
.portfolio-row img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:.35s ease;
}
.portfolio-row figure:hover img{transform:scale(1.025)}

.services{
  background:var(--paper);
  color:var(--ink);
  padding:34px 0 28px;
}
.services-grid{
  display:grid;
  grid-template-columns:1.25fr .72fr .72fr;
  gap:24px;
  align-items:stretch;
}
.service-intro{padding-right:30px}
.service-intro p{
  margin-top:17px;
  max-width:545px;
  font-size:15px;
  line-height:1.55;
  color:#45433f;
}
.service-card{
  background:#050505;
  border:1px solid rgba(255,255,255,.24);
  padding:22px 24px 24px;
  min-height:280px;
  display:flex;
  flex-direction:column;
  box-shadow:none;
}
.service-icon{
  width:30px;height:30px;
  margin-bottom:13px;
}
.service-icon svg{
  width:100%;height:100%;
  fill:none;
  stroke:#fff;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.92;
}
.service-card h3{font-size:25px;color:#fff}
.service-card p{
  margin-top:9px;
  color:rgba(255,255,255,.78);
  font-size:14px;
  line-height:1.45;
}
.service-card ul{
  padding-left:18px;
  margin:13px 0 20px;
  color:rgba(255,255,255,.86);
  font-size:13px;
  line-height:1.55;
}
.service-card li{margin:5px 0}
.card-button{
  margin-top:auto;
  border:1px solid rgba(255,255,255,.75);
  color:#fff;
  background:transparent;
  text-align:center;
  padding:12px 10px;
  text-transform:uppercase;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.card-button.black{
  background:transparent;
  color:#fff;
  border-color:rgba(255,255,255,.75);
}
.card-button:hover,
.card-button.black:hover{
  background:#fff;
  color:#000;
  border-color:#fff;
}

.workflow{
  background:#f8f7f3;
  color:#111;
  padding:27px 0 32px;
  border-top:1px solid #ebe7df;
}
.workflow-grid{
  display:grid;
  grid-template-columns:1.15fr repeat(4,1fr);
  gap:0;
}
.workflow-title{padding-right:25px}
.step{
  padding:0 23px;
  border-left:1px solid #ddd8d0;
}
.step span{
  display:block;
  font-family:Georgia,"Times New Roman",serif;
  font-size:33px;
  margin-bottom:7px;
}
.step h3{
  font-family:Arial,Helvetica,sans-serif;
  font-size:14px;
  font-weight:700;
  margin-bottom:7px;
}
.step p{
  color:#44423d;
  font-size:12.5px;
  line-height:1.45;
}

.bottom-cta{
  position:relative;
  min-height:clamp(420px,48vw,620px);
  overflow:hidden;
}
.bottom-cta>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 54%;
}
.bottom-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.91) 0%,rgba(0,0,0,.69) 43%,rgba(0,0,0,.34) 70%,rgba(0,0,0,.20) 100%);
}
.cta-grid{
  position:relative;
  z-index:2;
  min-height:clamp(420px,48vw,620px);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:70px;
  padding:64px 0;
}
.cta-copy h2{font-size:48px}
.cta-copy p{
  margin:15px 0 23px;
  color:#e0ded9;
  font-size:14px;
}
.cta-footer{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:28px;
  grid-column:1/-1;
  margin-top:26px;
}
.cta-contact-row{
  display:flex;
  flex-wrap:wrap;
  gap:18px 28px;
  align-items:center;
}
.cta-contact-item{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:#fff;
}
.cta-contact-icon{
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 42px;
  color:#fff;
  font-size:17px;
  line-height:1;
}
.cta-brand-icon{
  width:19px;
  height:19px;
  fill:currentColor;
}
.cta-instagram-icon{
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.cta-instagram-icon circle:last-child{
  fill:currentColor;
  stroke:none;
}
.cta-contact-text{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.cta-contact-text small{
  font-size:10px;
  letter-spacing:.18em;
  color:#cfc8bc;
}
.cta-contact-text strong{
  font-size:14px;
  font-weight:500;
}
.closing-note{
  padding-left:16px;
  border-left:1px solid rgba(255,255,255,.45);
  display:flex;
  flex-direction:column;
  gap:3px;
  font-size:11px;
  letter-spacing:.12em;
  line-height:1.2;
  white-space:nowrap;
}

@media (min-width:1600px){
  .hero{min-height:820px}
  .hero-inner{min-height:820px;padding-top:132px;padding-bottom:72px}
  .hero-bg{object-position:56% 51%}
  .bottom-cta{min-height:560px}
  .bottom-cta>img{object-position:center 52%}
  .cta-grid{min-height:560px}
}

@media (max-width:1050px){
  .topbar-inner{grid-template-columns:220px 1fr}
  .top-cta{display:none}
  .hero{min-height:760px}
  .hero-inner{min-height:760px;padding-top:124px;padding-bottom:56px}
  .hero-bg{object-position:60% 50%}
  .why-grid,.services-grid,.workflow-grid,.cta-grid{grid-template-columns:1fr}
  .value-grid{margin-top:25px}
  .workflow-title{margin-bottom:20px}
  .step{border-left:0;border-top:1px solid #ddd8d0;padding:18px 0}
  .portfolio-row{grid-template-columns:1fr 1fr}
  .portfolio-row figure{height:300px}
  .bottom-cta{min-height:540px}
  .bottom-cta>img{object-position:center 50%}
  .cta-grid{min-height:540px;gap:34px;padding:58px 0}
}
@media (max-width:1050px){
  .cta-footer{
    flex-direction:column;
    align-items:flex-start;
    gap:18px;
  }
  .closing-note{
    padding-left:0;
    border-left:0;
  }
}

@media (max-width:780px){
  .cta-contact-row{
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
  }
  .cta-contact-item{
    width:100%;
  }
}

@media (max-width:780px){
  .topbar{height:76px}
  .topbar-inner{display:flex}
  .logo img{height:42px}
  .menu-toggle{
    display:block;
    margin-left:auto;
    border:0;
    background:none;
    color:#fff;
    font-size:28px;
  }
  .nav{
    display:none;
    position:absolute;
    top:76px;left:0;right:0;
    background:rgba(0,0,0,.97);
    padding:20px 5vw;
    flex-direction:column;
    align-items:flex-start;
    gap:16px;
  }
  .nav.open{display:flex}
  .hero{min-height:760px}
  .hero-inner{min-height:760px;padding-top:110px;padding-bottom:46px;grid-template-columns:1fr}
  .hero-bg{object-position:70% 50%}
  .hero-copy{max-width:520px}
  .hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.49) 62%,rgba(0,0,0,.24))}
  .hero-note{display:none}
  .why-grid{grid-template-columns:1fr}
  .value-grid{grid-template-columns:1fr 1fr}
  .value:nth-child(3){border-left:none}
  .portfolio-row{grid-template-columns:1fr}
  .portfolio-row figure{height:330px}
  .section-head{display:block}
  .section-head a{display:inline-block;margin-top:15px}
  .bottom-cta{min-height:520px}
  .bottom-cta>img{object-position:60% 52%}
  .cta-grid{min-height:520px;padding:50px 0}
}
@media (max-width:520px){
  .wrap{width:90vw}
  h1{font-size:49px}
  h2{font-size:38px}
  .hero{min-height:720px}
  .hero-inner{min-height:720px}
  .hero-copy p{font-size:16px}
  .hero-buttons{flex-direction:column;align-items:flex-start}
  .value-grid{grid-template-columns:1fr}
  .value{border-left:0;border-top:1px solid var(--line)}
  .value:first-child{border-top:0}
  .portfolio-row figure{height:250px}
  .cta-copy h2{font-size:38px}
  .contact-block{min-width:0}
  .bottom-cta{min-height:500px}
  .bottom-cta>img{object-position:64% 52%}
  .cta-grid{min-height:500px;padding:44px 0}
}


/* CONTACT PAGE */
.contact-page-body{
  background:#0a0a0a;
}
.contact-topbar{
  position:absolute;
}
.contact-page{
  min-height:100vh;
  background:#f5f3ef;
  color:#141414;
}
.contact-page-hero{
  background:#0a0a0a;
  color:#fff;
  padding:160px 0 66px;
}
.contact-page-heading{
  max-width:1380px;
}
.contact-page-heading h1{
  max-width:820px;
  font-size:clamp(58px,7vw,104px);
  line-height:.92;
}
.contact-page-heading p{
  margin-top:24px;
  color:#d7d3cc;
  font-size:18px;
  line-height:1.55;
  max-width:610px;
}
.contact-page-content{
  padding:58px 0 80px;
}
.contact-page-grid{
  display:grid;
  grid-template-columns:1.4fr .72fr;
  gap:34px;
  align-items:start;
}
.contact-form-panel{
  background:#fbfaf7;
  border:1px solid #ddd8cf;
  padding:38px;
}
.contact-form-head{
  margin-bottom:30px;
}
.contact-form-head h2{
  font-size:44px;
}
.contact-form{
  display:flex;
  flex-direction:column;
  gap:20px;
}
.form-two{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.contact-form label{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.contact-form label>span{
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#5b5751;
}
.contact-form input,
.contact-form select,
.contact-form textarea{
  width:100%;
  border:1px solid #cbc6bd;
  background:#fff;
  color:#111;
  padding:15px 14px;
  font:inherit;
  outline:none;
  border-radius:0;
}
.contact-form textarea{
  resize:vertical;
  min-height:170px;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
  border-color:#121212;
}
.form-submit{
  align-self:flex-start;
  border:1px solid #111;
  background:#111;
  color:#fff;
  padding:16px 26px;
  text-transform:uppercase;
  font-size:12px;
  font-weight:700;
  letter-spacing:.05em;
  cursor:pointer;
}
.form-submit:hover{
  background:#292929;
}
.hp-field{
  position:absolute !important;
  left:-10000px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}
.form-error{
  background:#f3dfdc;
  border:1px solid #d6aaa4;
  padding:14px 16px;
  margin-bottom:22px;
  color:#6d2119;
  font-size:14px;
}
.form-success{
  padding:12px 0 8px;
}
.form-success h2{
  font-size:56px;
}
.form-success p{
  margin:18px 0 28px;
  color:#4c4944;
}
.contact-back{
  width:auto;
  display:inline-block;
  padding-left:22px;
  padding-right:22px;
}
.contact-options{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.contact-option{
  background:#ece9e3;
  border:1px solid #d9d4cb;
  padding:28px;
}
.contact-option h3{
  font-size:30px;
}
.contact-option p{
  margin:12px 0 22px;
  color:#514e48;
  font-size:15px;
  line-height:1.55;
}
.contact-option-button{
  display:inline-block;
  background:#111;
  color:#fff;
  padding:14px 18px;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:12px;
  font-weight:700;
}
.contact-option-button.whatsapp{
  background:#111;
}
.contact-details-box{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.contact-details-box>a{
  font-size:17px;
  padding-bottom:10px;
  border-bottom:1px solid #c6c0b7;
}
@media (max-width:900px){
  .contact-page-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:640px){
  .contact-page-hero{
    padding:130px 0 50px;
  }
  .contact-page-heading h1{
    font-size:52px;
  }
  .contact-form-panel{
    padding:24px;
  }
  .form-two{
    grid-template-columns:1fr;
  }
}


/* CONTACT PAGE V2 — CLEAN FULL-WIDTH FORM */
.simple-contact-page{
  min-height:100vh;
  background:#f6f5f2;
  color:#111;
}
.simple-contact-hero{
  background:#0a0a0a;
  color:#fff;
  padding:150px 0 56px;
}
.simple-contact-hero h1{
  font-size:clamp(54px,6.6vw,94px);
  line-height:.95;
}
.simple-contact-hero p{
  margin-top:20px;
  max-width:620px;
  color:#d7d3cc;
  font-size:17px;
  line-height:1.55;
}
.simple-contact-section{
  padding:64px 0 84px;
}
.simple-contact-form{
  display:flex;
  flex-direction:column;
  gap:28px;
}
.simple-contact-form input,
.simple-contact-form textarea{
  width:100%;
  border:1px solid #d5d2cc;
  background:#fff;
  color:#111;
  padding:22px 20px;
  font:inherit;
  font-size:16px;
  border-radius:0;
  outline:none;
}
.simple-contact-form input{
  min-height:62px;
}
.simple-contact-form textarea{
  min-height:200px;
  resize:vertical;
}
.simple-contact-form input:focus,
.simple-contact-form textarea:focus{
  border-color:#111;
}
.simple-submit{
  width:100%;
  border:1px solid #111;
  background:transparent;
  color:#111;
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  font-size:14px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  cursor:pointer;
}
.simple-submit:hover{
  background:#111;
  color:#fff;
}
.quick-contact{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:#d6d1c9;
  margin-top:48px;
  border:1px solid #d6d1c9;
}
.quick-contact a{
  background:#efede8;
  padding:24px 22px;
  display:flex;
  flex-direction:column;
  gap:7px;
  min-height:100px;
}
.quick-contact a:hover{
  background:#e7e3dc;
}
.quick-label{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
  color:#777169;
}
.quick-contact a span:last-child{
  font-size:15px;
}
.simple-success{
  padding:34px 0;
}
.simple-success h2{
  font-size:56px;
}
.simple-success p{
  margin:18px 0 28px;
  color:#4d4943;
}
.simple-success .simple-submit{
  max-width:280px;
}
@media (max-width:800px){
  .simple-contact-hero{
    padding:130px 0 48px;
  }
  .quick-contact{
    grid-template-columns:1fr;
  }
}


/* CONTACT PAGE V13 — APPROVED DARK VERSION */
.contact-v13-body{
  background:#070808;
  color:#fff;
}
.contact-v13-topbar{
  position:absolute;
  background:transparent;
}
.contact-v13-navwrap{
  grid-template-columns:270px 1fr 270px;
}
.contact-v13-nav-spacer{
  width:100%;
}
.contact-v13-main{
  min-height:100vh;
  background:
    radial-gradient(circle at 68% 38%,rgba(255,255,255,.025),transparent 32%),
    #070808;
}
.contact-v13-content{
  padding:150px 0 72px;
}
.contact-v13-grid{
  display:grid;
  grid-template-columns:.93fr 1.07fr;
  gap:56px;
  align-items:center;
  min-height:650px;
}
.contact-v13-copy{
  position:relative;
  z-index:3;
}
.contact-v13-kicker{
  font-size:12px;
  letter-spacing:.18em;
  margin-bottom:20px;
  color:#d7d7d7;
}
.contact-v13-copy h1{
  font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(48px,4.5vw,72px);
  line-height:1.03;
  letter-spacing:-.035em;
  font-weight:400;
}
.contact-v13-intro{
  margin-top:26px;
  max-width:575px;
  font-size:16px;
  line-height:1.55;
  color:#d0d0d0;
}
.contact-v13-form{
  margin-top:34px;
  max-width:650px;
  display:flex;
  flex-direction:column;
  gap:15px;
}
.contact-v13-two{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px;
}
.contact-v13-form input,
.contact-v13-form textarea{
  width:100%;
  background:rgba(255,255,255,.015);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  font:inherit;
  font-size:14px;
  padding:16px 17px;
  border-radius:0;
  outline:none;
}
.contact-v13-form input{
  min-height:54px;
}
.contact-v13-form textarea{
  min-height:132px;
  resize:vertical;
}
.contact-v13-form input::placeholder,
.contact-v13-form textarea::placeholder{
  color:#b7b7b7;
}
.contact-v13-form input:focus,
.contact-v13-form textarea:focus{
  border-color:rgba(255,255,255,.65);
}
.contact-v13-submit{
  width:300px;
  min-height:54px;
  margin-top:9px;
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,.78);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 22px;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  cursor:pointer;
}
.contact-v13-submit:hover{
  background:#fff;
  color:#111;
}
.contact-v13-visual{
  position:relative;
  min-height:590px;
  overflow:hidden;
}
.contact-v13-visual img{
  position:absolute;
  inset:4% 0 4% 0;
  width:100%;
  height:92%;
  object-fit:cover;
  object-position:center;
}
/* Rectangular/square edge fade: no circular vignette */
.contact-v13-fade{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,#070808 0%,rgba(7,8,8,.94) 5%,rgba(7,8,8,.38) 13%,rgba(7,8,8,0) 25%),
    linear-gradient(270deg,#070808 0%,rgba(7,8,8,.78) 4%,rgba(7,8,8,.24) 11%,rgba(7,8,8,0) 23%),
    linear-gradient(180deg,#070808 0%,rgba(7,8,8,.82) 5%,rgba(7,8,8,.25) 13%,rgba(7,8,8,0) 23%),
    linear-gradient(0deg,#070808 0%,rgba(7,8,8,.88) 5%,rgba(7,8,8,.26) 14%,rgba(7,8,8,0) 25%);
}
.contact-v13-links{
  border-top:1px solid rgba(255,255,255,.12);
  padding:28px 0 40px;
}
.contact-v13-links-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
}
.contact-v13-link{
  min-height:105px;
  padding:0 42px;
  border-left:1px solid rgba(255,255,255,.15);
  display:flex;
  align-items:center;
  gap:22px;
}
.contact-v13-link:first-child{
  border-left:0;
}
.contact-v13-icon{
  width:44px;
  height:44px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  font-size:21px;
}
.contact-v13-link>span:last-child{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-self:center;
  gap:5px;
}
.contact-v13-link small{
  font-size:10px;
  line-height:1;
  letter-spacing:.17em;
  color:#c4c4c4;
}
.contact-v13-link strong{
  font-size:15px;
  font-weight:400;
  line-height:1.25;
}
.contact-v13-error{
  margin-top:22px;
  max-width:650px;
  border:1px solid rgba(255,120,120,.45);
  background:rgba(130,20,20,.14);
  padding:14px 16px;
  color:#f0c4c4;
}
.contact-v13-success{
  margin-top:34px;
  max-width:600px;
}
.contact-v13-success h2{
  font-family:Arial,Helvetica,sans-serif;
  font-size:44px;
}
.contact-v13-success p{
  margin:16px 0 22px;
  color:#d0d0d0;
}
@media (max-width:1050px){
  .contact-v13-navwrap{grid-template-columns:220px 1fr}
  .contact-v13-nav-spacer{display:none}
  .contact-v13-grid{
    grid-template-columns:1fr;
    min-height:auto;
  }
  .contact-v13-visual{
    min-height:480px;
  }
}
@media (max-width:780px){
  .contact-v13-content{padding-top:118px}
  .contact-v13-grid{gap:34px}
  .contact-v13-copy h1{font-size:48px}
  .contact-v13-two{grid-template-columns:1fr}
  .contact-v13-submit{width:100%}
  .contact-v13-visual{min-height:390px}
  .contact-v13-links-grid{grid-template-columns:1fr}
  .contact-v13-link{
    border-left:0;
    border-top:1px solid rgba(255,255,255,.12);
    padding:20px 4px;
  }
  .contact-v13-link:first-child{border-top:0}
}


/* CONTACT PAGE V14 — larger image, no headline */
.contact-v13-grid{
  grid-template-columns:.78fr 1.22fr;
  gap:46px;
  align-items:center;
  min-height:650px;
}
.contact-v13-copy{
  align-self:center;
}
.contact-v13-kicker{
  margin-bottom:18px;
}
.contact-v13-intro{
  margin-top:0;
  max-width:560px;
  font-size:17px;
  line-height:1.6;
}
.contact-v13-form{
  margin-top:32px;
}
.contact-v13-visual{
  min-height:650px;
}
.contact-v13-visual img{
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
@media (max-width:1050px){
  .contact-v13-grid{
    grid-template-columns:1fr;
  }
  .contact-v13-visual{
    min-height:500px;
  }
}
@media (max-width:780px){
  .contact-v13-visual{
    min-height:390px;
  }
}


/* CONTACT V16 — real WhatsApp / Instagram icons */
.contact-brand-icon{
  width:23px;
  height:23px;
  display:block;
}
.contact-v13-link:first-child .contact-brand-icon{
  fill:#fff;
}
.instagram-icon{
  fill:none;
  stroke:#fff;
  stroke-width:1.8;
}
.instagram-icon circle:last-child{
  fill:#fff;
  stroke:none;
}


/* CONTACT PAGE V17 — wider, larger, better screen balance */
.contact-v13-content{
  padding:135px 0 48px;
}
.contact-v13-grid{
  width:min(94vw,1600px);
  max-width:1600px;
  grid-template-columns:.88fr 1.12fr;
  gap:56px;
  min-height:600px;
}
.contact-v13-copy{
  max-width:680px;
}
.contact-v13-kicker{
  font-size:13px;
  margin-bottom:16px;
}
.contact-v13-intro{
  max-width:620px;
  font-size:18px;
  line-height:1.62;
}
.contact-v13-form{
  max-width:680px;
  margin-top:30px;
  gap:16px;
}
.contact-v13-form input{
  min-height:58px;
  font-size:15px;
}
.contact-v13-form textarea{
  min-height:150px;
  font-size:15px;
}
.contact-v13-submit{
  width:325px;
  min-height:58px;
}
.contact-v13-visual{
  min-height:620px;
}
.contact-v13-links{
  padding:24px 0 28px;
}
.contact-v13-links-grid{
  width:min(92vw,1500px);
  max-width:1500px;
}
.contact-v13-link{
  min-height:96px;
  padding:0 54px;
  gap:24px;
}
.contact-v13-link small{
  font-size:11px;
}
.contact-v13-link strong{
  font-size:16px;
}

@media (min-width:1500px){
  .contact-v13-grid{
    width:min(92vw,1680px);
    max-width:1680px;
    grid-template-columns:.9fr 1.1fr;
  }
  .contact-v13-visual{
    min-height:660px;
  }
  .contact-v13-links-grid{
    width:min(90vw,1580px);
    max-width:1580px;
  }
}

@media (max-width:1050px){
  .contact-v13-grid{
    width:min(92vw,900px);
    grid-template-columns:1fr;
  }
  .contact-v13-copy{
    max-width:none;
  }
  .contact-v13-form{
    max-width:none;
  }
  .contact-v13-visual{
    min-height:500px;
  }
}

@media (max-width:780px){
  .contact-v13-content{
    padding-top:112px;
    padding-bottom:34px;
  }
  .contact-v13-grid{
    width:min(92vw,680px);
    gap:30px;
  }
  .contact-v13-intro{
    font-size:16px;
  }
  .contact-v13-visual{
    min-height:390px;
  }
  .contact-v13-links{
    padding:16px 0 24px;
  }
}


/* CONTACT PAGE V18 — automatic vertical fit across screen sizes */
.contact-v13-body{
  min-height:100svh;
}

.contact-v13-main{
  min-height:100svh;
  display:flex;
  flex-direction:column;
}

.contact-v13-content{
  flex:1 0 auto;
  display:flex;
  align-items:center;
  padding-top:clamp(110px, 12vh, 160px);
  padding-bottom:clamp(28px, 5vh, 64px);
}

.contact-v13-grid{
  width:min(94vw,1600px);
  max-width:1600px;
  min-height:0;
  align-items:center;
}

.contact-v13-visual{
  min-height:0;
  height:clamp(420px, 58vh, 680px);
}

.contact-v13-links{
  flex:0 0 auto;
  margin-top:auto;
  padding-top:clamp(18px, 2.5vh, 30px);
  padding-bottom:clamp(22px, 3vh, 36px);
}

@media (min-height:900px){
  .contact-v13-content{
    padding-top:clamp(120px, 14vh, 180px);
    padding-bottom:clamp(34px, 5vh, 70px);
  }

  .contact-v13-visual{
    height:clamp(500px, 60vh, 740px);
  }
}

@media (max-height:760px) and (min-width:1051px){
  .contact-v13-content{
    padding-top:105px;
    padding-bottom:24px;
  }

  .contact-v13-grid{
    gap:42px;
  }

  .contact-v13-intro{
    font-size:16px;
    line-height:1.5;
  }

  .contact-v13-form{
    margin-top:24px;
    gap:12px;
  }

  .contact-v13-form input{
    min-height:50px;
  }

  .contact-v13-form textarea{
    min-height:112px;
  }

  .contact-v13-submit{
    min-height:52px;
  }

  .contact-v13-visual{
    height:clamp(360px, 54vh, 520px);
  }

  .contact-v13-links{
    padding-top:16px;
    padding-bottom:20px;
  }

  .contact-v13-link{
    min-height:82px;
  }
}

@media (max-width:1050px){
  .contact-v13-main{
    display:block;
    min-height:auto;
  }

  .contact-v13-content{
    display:block;
    padding-top:118px;
    padding-bottom:34px;
  }

  .contact-v13-grid{
    width:min(92vw,900px);
  }

  .contact-v13-visual{
    height:clamp(380px, 58vw, 560px);
  }

  .contact-v13-links{
    margin-top:0;
  }
}

@media (max-width:780px){
  .contact-v13-content{
    padding-top:108px;
    padding-bottom:26px;
  }

  .contact-v13-visual{
    height:clamp(300px, 78vw, 430px);
  }
}


/* HOMEPAGE V19 — full dark premium theme */
.home-dark{
  background:#080909;
  color:#f5f5f2;
}

.home-dark main,
.home-dark section{
  background:#080909;
  color:#f5f5f2;
}

.home-dark section:nth-of-type(even){
  background:#0b0c0c;
}

.home-dark h1,
.home-dark h2,
.home-dark h3,
.home-dark h4,
.home-dark .section-title,
.home-dark .eyebrow,
.home-dark .kicker{
  color:#f7f7f4;
}

.home-dark p,
.home-dark .lead,
.home-dark .section-copy,
.home-dark .muted,
.home-dark .card p,
.home-dark .service p,
.home-dark .workflow p{
  color:#b8b9b6;
}

.home-dark a{
  color:inherit;
}

.home-dark .site-header,
.home-dark header{
  background:rgba(6,7,7,.88);
  border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.home-dark nav a{
  color:#f2f2ef;
}

.home-dark nav a:hover{
  color:#fff;
}

.home-dark .btn,
.home-dark .button,
.home-dark .cta-button,
.home-dark .primary-button{
  border-color:rgba(255,255,255,.72);
  color:#fff;
}

.home-dark .btn:hover,
.home-dark .button:hover,
.home-dark .cta-button:hover,
.home-dark .primary-button:hover{
  background:#fff;
  color:#080909;
}

.home-dark .card,
.home-dark .service,
.home-dark .workflow-step,
.home-dark .feature,
.home-dark .stat{
  background:#0d0e0e;
  border-color:rgba(255,255,255,.08);
}

.home-dark hr,
.home-dark .divider,
.home-dark .section-divider{
  border-color:rgba(255,255,255,.08);
  background:rgba(255,255,255,.08);
}

.home-dark footer{
  background:#060707;
  color:#f4f4f1;
  border-top:1px solid rgba(255,255,255,.08);
}

.home-dark footer p,
.home-dark footer a{
  color:#aaa;
}

/* Preserve the photography-first feel: images stay untouched, surrounding UI turns dark. */
.home-dark img{
  filter:none;
}

/* Section separation handled by spacing, not divider lines */
.home-dark .why-section,
.home-dark .services-section,
.home-dark .workflow-section,
.home-dark .portfolio-section,
.home-dark .cta-section{
  border-top:0;
}


/* HOMEPAGE V20 — dark theme contrast fixes */
.home-dark .why-copy p{
  color:#c4c5c2;
}

.home-dark .value{
  border-left-color:rgba(255,255,255,.22);
}

.home-dark .value svg{
  stroke:#f4f4f1;
}

.home-dark .value span{
  color:#f4f4f1;
}


/* V24 — top CTA alignment fix */
.topbar-inner{
  grid-template-columns:270px 1fr 285px;
}

.top-cta{
  width:100%;
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space:nowrap;
  line-height:1;
  padding:0 18px;
}


/* =========================================================
   V25 — FULL RESPONSIVE SYSTEM
   Keeps layout, spacing and image framing stable across
   desktop, laptop, tablet and mobile screens.
   ========================================================= */

html,body{max-width:100%;overflow-x:hidden}
.wrap{width:min(92vw,1380px)}

/* Header scales instead of jumping between fixed sizes */
.topbar{
  height:clamp(76px,8.5vh,92px);
}
.topbar-inner{
  width:min(94vw,1420px);
  grid-template-columns:minmax(205px,270px) minmax(0,1fr) minmax(230px,285px);
  gap:clamp(14px,1.4vw,22px);
}
.logo img{height:clamp(42px,4.7vh,50px)}
.nav{gap:clamp(18px,2vw,34px)}
.nav a{font-size:clamp(12px,.85vw,14px)}
.top-cta{
  min-width:0;
  min-height:clamp(48px,5.5vh,54px);
  padding-inline:clamp(14px,1.4vw,20px);
  font-size:clamp(10px,.72vw,12px);
}

/* HOME — viewport-aware hero */
.home-dark .hero{
  height:auto;
  min-height:clamp(720px,82svh,900px);
}
.home-dark .hero-inner{
  width:min(92vw,1380px);
  min-height:clamp(720px,82svh,900px);
  padding-top:clamp(108px,12vh,142px);
  padding-bottom:clamp(58px,8vh,84px);
}
.home-dark .hero-copy{
  max-width:clamp(520px,42vw,650px);
}
.home-dark .hero-copy h1{
  font-size:clamp(50px,5.3vw,90px);
  line-height:.96;
}
.home-dark .hero-copy p{
  margin-top:clamp(16px,2.5vh,24px);
  max-width:590px;
  font-size:clamp(15px,1.18vw,19px);
}
.home-dark .hero-buttons{
  margin-top:clamp(18px,2.7vh,28px);
  gap:14px;
  flex-wrap:wrap;
}
.home-dark .button{
  min-height:50px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.15;
  white-space:nowrap;
}
.home-dark .hero-bg{
  object-position:58% 52%;
}

/* Home sections use fluid vertical rhythm */
.home-dark .why{padding:clamp(34px,5vh,52px) 0}
.home-dark .portfolio{padding:clamp(28px,4.5vh,46px) 0}
.home-dark .services{padding:clamp(34px,5vh,58px) 0}
.home-dark .workflow{padding:clamp(28px,4vh,44px) 0}

/* Image cards keep the same visual ratio on every width */
.home-dark .portfolio-row{
  gap:clamp(10px,1vw,16px);
}
.home-dark .portfolio-row figure{
  height:auto;
  aspect-ratio:4/3;
}
.home-dark .portfolio-row img{
  object-fit:cover;
  object-position:center center;
}
.home-dark .portfolio-row figure:nth-child(1) img{object-position:50% 55%}
.home-dark .portfolio-row figure:nth-child(2) img{object-position:50% 50%}
.home-dark .portfolio-row figure:nth-child(3) img{object-position:50% 52%}
.home-dark .portfolio-row figure:nth-child(4) img{object-position:50% 50%}

/* Services and workflow scale without squeezing content */
.home-dark .services-grid{
  grid-template-columns:minmax(300px,1.15fr) repeat(2,minmax(250px,.72fr));
  gap:clamp(18px,1.8vw,28px);
}
.home-dark .service-card{min-width:0}
.home-dark .workflow-grid{
  grid-template-columns:minmax(220px,1.15fr) repeat(4,minmax(145px,1fr));
}
.home-dark .step{padding-inline:clamp(14px,1.5vw,23px)}

/* Bottom CTA keeps focal point stable */
.home-dark .bottom-cta{
  min-height:clamp(430px,55vw,620px);
}
.home-dark .bottom-cta>img{
  object-position:center 50%;
}
.home-dark .cta-grid{
  min-height:clamp(430px,55vw,620px);
  padding-block:clamp(54px,7vw,80px);
}

@media (min-width:1600px){
  .home-dark .hero{
    min-height:820px;
  }
  .home-dark .hero-inner{
    min-height:820px;
    padding-top:124px;
    padding-bottom:74px;
  }
  .home-dark .hero-bg{object-position:56% 51%}
  .home-dark .bottom-cta{
    min-height:560px;
  }
  .home-dark .bottom-cta>img{object-position:center 49%}
  .home-dark .cta-grid{
    min-height:560px;
    padding-block:64px;
  }
}

/* Short / wide laptop screens: reduce type + spacing so CTA buttons stay visible */
@media (min-width:901px) and (max-height:820px){
  .home-dark .hero{
    height:auto;
    min-height:680px;
  }
  .home-dark .hero-inner{
    min-height:680px;
    padding-top:98px;
    padding-bottom:42px;
  }
  .home-dark .hero-copy{
    max-width:600px;
  }
  .home-dark .hero-copy h1{
    font-size:clamp(48px,4.7vw,72px);
    line-height:.94;
  }
  .home-dark .hero-copy p{
    margin-top:14px;
    font-size:15.5px;
    line-height:1.4;
  }
  .home-dark .hero-buttons{margin-top:18px}
  .home-dark .hero-note{margin-bottom:24px}
  .home-dark .bottom-cta{min-height:470px}
  .home-dark .cta-grid{min-height:470px;padding-block:44px}
}

@media (min-width:901px) and (max-height:680px){
  .home-dark .hero{
    height:auto;
    min-height:640px;
  }
  .home-dark .hero-inner{min-height:640px;padding-top:88px;padding-bottom:36px}
  .home-dark .hero-copy h1{font-size:clamp(44px,4.1vw,62px)}
  .home-dark .hero-copy p{font-size:14.5px;max-width:540px}
  .home-dark .button{min-height:46px;padding:13px 20px}
  .home-dark .bottom-cta{min-height:440px}
  .home-dark .cta-grid{min-height:440px;padding-block:38px}
}

/* Medium desktop / tablet landscape */
@media (max-width:1180px){
  .topbar-inner{
    grid-template-columns:210px minmax(0,1fr) 235px;
  }
  .nav{gap:20px}
  .top-cta{font-size:10px}
  .home-dark .services-grid{
    grid-template-columns:1fr 1fr;
  }
  .home-dark .service-intro{
    grid-column:1/-1;
    padding-right:0;
  }
  .home-dark .workflow-grid{
    grid-template-columns:1fr 1fr 1fr;
  }
  .home-dark .workflow-title{grid-column:1/-1;margin-bottom:12px}
  .home-dark .step{border-top:1px solid rgba(255,255,255,.18);border-left:0;padding:18px 12px}
}

@media (max-width:1050px){
  .topbar-inner{grid-template-columns:210px 1fr}
  .top-cta{display:none}
  .home-dark .hero{
    height:auto;
    min-height:760px;
  }
  .home-dark .hero-inner{min-height:760px;padding-bottom:54px}
  .home-dark .hero-copy{max-width:610px}
  .home-dark .hero-copy h1{font-size:clamp(52px,7vw,76px)}
  .home-dark .hero-bg{object-position:65% 51%}
  .home-dark .why-grid{grid-template-columns:1fr}
  .home-dark .value-grid{margin-top:10px}
  .home-dark .portfolio-row{grid-template-columns:repeat(2,1fr)}
  .home-dark .services-grid{grid-template-columns:1fr 1fr}
  .home-dark .cta-grid{grid-template-columns:1fr;gap:28px;padding-block:46px}
  .home-dark .bottom-cta{min-height:520px}
  .home-dark .bottom-cta>img{object-position:center 48%}
  .home-dark .cta-grid{min-height:520px}
  .home-dark .cta-footer{flex-direction:column;align-items:flex-start}.home-dark .closing-note{padding-left:0;border-left:0}
}

@media (max-width:780px){
  .topbar{height:76px}
  .topbar-inner{display:flex;width:92vw}
  .home-dark .hero{
    height:auto;
    min-height:700px;
  }
  .home-dark .hero-inner{
    min-height:700px;
    padding-top:108px;
    padding-bottom:40px;
    display:flex;
    align-items:flex-start;
  }
  .home-dark .hero-copy{max-width:min(92vw,540px)}
  .home-dark .hero-copy h1{font-size:clamp(46px,12vw,64px)}
  .home-dark .hero-copy p{font-size:16px}
  .home-dark .hero-bg{object-position:70% 50%}
  .home-dark .value-grid{grid-template-columns:1fr 1fr}
  .home-dark .services-grid{grid-template-columns:1fr}
  .home-dark .workflow-grid{grid-template-columns:1fr 1fr}
  .home-dark .workflow-title{grid-column:1/-1}
  .home-dark .portfolio-row figure{aspect-ratio:4/3}
  .home-dark .bottom-cta{min-height:500px}
  .home-dark .bottom-cta>img{object-position:56% 54%}
  .home-dark .cta-grid{min-height:500px;padding-block:40px}
}

@media (max-width:560px){
  .home-dark .hero{min-height:660px}
  .home-dark .hero-inner{min-height:660px;padding-top:100px;padding-bottom:34px}
  .home-dark .hero-copy h1{font-size:clamp(43px,13vw,56px)}
  .home-dark .hero-buttons{flex-direction:column;align-items:stretch}
  .home-dark .hero-buttons .button{width:100%}
  .home-dark .value-grid{grid-template-columns:1fr}
  .home-dark .portfolio-row{grid-template-columns:1fr}
  .home-dark .workflow-grid{grid-template-columns:1fr}
  .home-dark .section-head{display:block}
  .home-dark .section-head a{margin-top:14px;display:inline-block}
  .home-dark .bottom-cta{min-height:470px}
  .home-dark .bottom-cta>img{object-position:58% 55%}
  .home-dark .cta-grid{min-height:470px;padding-block:34px}
}

/* PORTFOLIO PAGE — stable ratios and fluid grid */
.portfolio-page-body .topbar-inner,
body:not(.home-dark):not(.contact-v13-body) .topbar-inner{
  width:min(94vw,1420px);
}
.portfolio-page{
  padding-top:clamp(94px,11vh,120px) !important;
}
.portfolio-page .page-head{
  padding:clamp(28px,4vh,42px) 0 !important;
}
.portfolio-page-grid{
  gap:clamp(10px,1vw,16px) !important;
}
.portfolio-page-grid figure,
.portfolio-page-grid figure.wide,
.portfolio-page-grid figure.tall{
  min-height:0;
}
.portfolio-page-grid img{
  object-position:center center;
}
.portfolio-page-grid figure:nth-child(1) img{object-position:64% 55%}
.portfolio-page-grid figure:nth-child(2) img{object-position:50% 56%}
.portfolio-page-grid figure:nth-child(3) img{object-position:50% 50%}
.portfolio-page-grid figure:nth-child(4) img{object-position:50% 52%}
.portfolio-page-grid figure:nth-child(5) img{object-position:50% 50%}
.portfolio-page-grid figure:nth-child(6) img{object-position:50% 56%}

@media (max-width:900px){
  .portfolio-page-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .portfolio-page-grid figure,
  .portfolio-page-grid figure.wide,
  .portfolio-page-grid figure.tall{
    aspect-ratio:4/3 !important;
  }
  .portfolio-page-grid figure.wide{grid-column:span 2 !important}
  .portfolio-page-cta .inner{grid-template-columns:1fr !important}
}
@media (max-width:620px){
  .portfolio-page-grid{grid-template-columns:1fr !important}
  .portfolio-page-grid figure,
  .portfolio-page-grid figure.wide,
  .portfolio-page-grid figure.tall{
    grid-column:auto !important;
    aspect-ratio:4/3 !important;
  }
  .portfolio-page .page-head h1{font-size:clamp(44px,13vw,62px) !important}
}

/* CONTACT PAGE — fluid column widths, image height and contact strip */
.contact-v13-grid{
  grid-template-columns:minmax(420px,.88fr) minmax(520px,1.12fr);
  gap:clamp(34px,4vw,64px);
}
.contact-v13-copy{min-width:0}
.contact-v13-form{max-width:none}
.contact-v13-visual{
  height:clamp(430px,56svh,700px);
}
.contact-v13-visual img{
  inset:0;
  width:100%;
  height:100%;
  object-position:52% 50%;
}
.contact-v13-links-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.contact-v13-link{padding-inline:clamp(22px,3vw,54px)}
.contact-v13-link strong{overflow-wrap:anywhere}

@media (max-width:1200px){
  .contact-v13-grid{
    grid-template-columns:minmax(360px,.9fr) minmax(420px,1.1fr);
  }
  .contact-v13-intro{font-size:16px}
}
@media (max-width:1050px){
  .contact-v13-grid{
    grid-template-columns:1fr;
    width:min(92vw,900px);
  }
  .contact-v13-visual{
    height:clamp(390px,58vw,560px);
  }
  .contact-v13-links-grid{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:760px){
  .contact-v13-content{padding-top:104px;padding-bottom:28px}
  .contact-v13-two{grid-template-columns:1fr}
  .contact-v13-visual{height:clamp(320px,78vw,440px)}
  .contact-v13-links-grid{grid-template-columns:1fr}
  .contact-v13-link{
    border-left:0;
    border-top:1px solid rgba(255,255,255,.12);
    min-height:88px;
    padding:18px 4vw;
  }
  .contact-v13-link:first-child{border-top:0}
}


/* =========================================================
   V28 — PREMIUM SERVICES / exact source images
   Images are displayed at their native 3:2 ratio without crop,
   distortion, filters, overlays or re-encoding.
   ========================================================= */
.home-dark .premium-services{
  background:#070808;
  color:#fff;
  padding:clamp(56px,7vw,96px) 0 clamp(48px,6vw,82px);
  border-top:1px solid rgba(255,255,255,.07);
}
.premium-services-wrap{
  width:min(92vw,1450px);
}
.premium-services-head{
  text-align:center;
  max-width:1000px;
  margin:0 auto clamp(34px,4vw,54px);
}
.premium-services-head .kicker{
  color:#d7d1c6;
  margin-bottom:16px;
}
.premium-services-head h2{
  color:#fff;
  font-size:clamp(40px,4vw,62px);
  line-height:1.02;
}
.premium-services-head p{
  margin:16px auto 0;
  max-width:860px;
  color:#c8c8c4;
  font-size:clamp(15px,1.2vw,18px);
  line-height:1.55;
}
.premium-package-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(18px,2vw,28px);
}
.premium-package-card{
  min-width:0;
  overflow:hidden;
  background:#080909;
  border:1px solid rgba(255,255,255,.28);
  display:flex;
  flex-direction:column;
}
.premium-package-image{
  width:100%;
  background:#050505;
  border-bottom:1px solid rgba(255,255,255,.13);
}
.premium-package-image img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:auto;
  object-fit:contain;
  object-position:center center;
  filter:none !important;
  opacity:1 !important;
  transform:none !important;
}
.premium-package-content{
  padding:clamp(24px,2.4vw,38px);
  display:flex;
  flex-direction:column;
  flex:1;
}
.premium-package-label{
  color:#d4b77e;
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  margin-bottom:18px;
}
.premium-package-title-row{
  display:flex;
  align-items:center;
  gap:15px;
}
.premium-car-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  fill:none;
  stroke:#d8b773;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.premium-package-title-row h3{
  color:#fff;
  font-size:clamp(31px,2.7vw,44px);
  line-height:1;
}
.premium-package-intro{
  margin-top:15px;
  max-width:620px;
  color:#c9c9c5 !important;
  font-size:15px !important;
  line-height:1.55 !important;
}
.premium-package-list{
  list-style:none;
  padding:20px 0 0 !important;
  margin:22px 0 28px !important;
  border-top:1px solid rgba(255,255,255,.18);
  color:#e1e1dd !important;
  font-size:14px !important;
  line-height:1.5 !important;
}
.premium-package-list li{
  position:relative;
  margin:10px 0 !important;
  padding-left:36px;
}
.premium-package-list li::before{
  content:'✓';
  position:absolute;
  left:0;
  top:-1px;
  width:23px;
  height:23px;
  border:1px solid #d4b77e;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#e1c17f;
  font-size:13px;
  line-height:1;
}
.premium-package-button{
  margin-top:auto;
  min-height:54px;
  border:1px solid #d6bb85;
  background:#d6bb85;
  color:#080909 !important;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding:15px 20px;
  text-transform:uppercase;
  letter-spacing:.11em;
  font-size:11px;
  font-weight:700;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.premium-package-button:hover{
  background:transparent;
  color:#fff !important;
  border-color:#fff;
}
.premium-package-button span{font-size:19px;line-height:1}
.premium-services-benefits{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:clamp(32px,4vw,50px);
}
.premium-benefit{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  min-width:0;
}
.premium-benefit svg{
  width:34px;
  height:34px;
  flex:0 0 34px;
  fill:none;
  stroke:#d8b773;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.premium-benefit div{
  display:flex;
  flex-direction:column;
  gap:5px;
}
.premium-benefit strong{
  font-size:10px;
  letter-spacing:.20em;
  color:#e8e5dd;
}
.premium-benefit span{
  color:#aaa9a4;
  font-size:13px;
}
@media (max-width:900px){
  .premium-package-grid{grid-template-columns:1fr}
  .premium-services-benefits{grid-template-columns:1fr;gap:22px}
  .premium-benefit{justify-content:flex-start;max-width:460px;margin-inline:auto;width:100%}
}
@media (max-width:560px){
  .home-dark .premium-services{padding:48px 0 44px}
  .premium-services-head{text-align:left;margin-bottom:28px}
  .premium-services-head h2{font-size:38px}
  .premium-package-content{padding:22px}
  .premium-package-title-row{align-items:flex-start}
  .premium-package-title-row h3{font-size:34px}
  .premium-package-button{width:100%;font-size:10px;letter-spacing:.08em}
}


/* V29 — dedicated services page */
.diensten-page-body{
  background:#070808;
  min-height:100vh;
}
.diensten-topbar{
  position:absolute;
  background:rgba(7,8,8,.92);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.diensten-page-main{
  min-height:100vh;
}
.diensten-page-body .premium-services{
  padding-top:clamp(132px,11vw,170px);
  border-top:0;
  min-height:100vh;
}
.diensten-page-body .premium-services-head{
  margin-bottom:clamp(34px,4vw,54px);
}
@media (max-width:780px){
  .diensten-page-body .premium-services{
    padding-top:110px;
  }
}


/* V43 — compact services teaser between portfolio and workflow */
.home-dark .services-preview{
  background:#080909;
  border-top:0;
  border-bottom:0;
  padding:clamp(34px,4.2vw,58px) 0;
}
.home-dark .services-preview-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(32px,5vw,90px);
}
.home-dark .services-preview-copy{
  max-width:800px;
}
.home-dark .services-preview .kicker{
  color:#f2f0eb;
  margin-bottom:11px;
}
.home-dark .services-preview h2{
  color:#f7f7f4;
  font-size:clamp(31px,3vw,46px);
  line-height:1.03;
}
.home-dark .services-preview p{
  margin-top:14px;
  max-width:720px;
  color:#bfc0bd;
  font-size:clamp(14px,1.05vw,16px);
  line-height:1.58;
}
.home-dark .services-preview-button{
  min-width:210px;
  min-height:54px;
  padding:0 24px;
  border:1px solid rgba(255,255,255,.72);
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  color:#fff;
  background:transparent;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.home-dark .services-preview-button:hover{
  background:#fff;
  color:#080909;
  border-color:#fff;
}
.home-dark .services-preview-button span{
  font-size:17px;
  line-height:1;
}
@media (max-width:780px){
  .home-dark .services-preview-inner{
    grid-template-columns:1fr;
    gap:24px;
  }
  .home-dark .services-preview-button{
    width:100%;
  }
}

/* V49 — align value icons and captions to the same vertical baseline */
.home-dark .value-grid .value{
  justify-content:flex-start;
  padding-top:18px;
  padding-bottom:18px;
}
.home-dark .value-grid .value svg{
  flex:0 0 42px;
  width:42px;
  height:42px;
  margin-bottom:15px;
}
.home-dark .value-grid .value span{
  min-height:60px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  text-align:center;
}

/* V52 — remove divider between services preview and workflow */
.home-dark .workflow{
  border-top:0 !important;
}

/* V53 — remove horizontal divider lines inside workflow */
.home-dark .workflow .step{
  border-top:0 !important;
}


/* V71 — responsive & mobile optimization */
html,body{overflow-x:hidden}
img{max-width:100%}
body.nav-open{overflow:hidden}
:focus-visible{outline:2px solid #d8b773;outline-offset:3px}
.button,.top-cta,.card-button,.dv-cta,.services-preview-button,.contact-v13-submit,.menu-toggle{min-height:44px}
.hero,.bottom-cta,.contact-v13-content,.portfolio-page,.dv-services{content-visibility:auto;contain-intrinsic-size:1px 900px}

.topbar-inner{gap:clamp(14px,2vw,26px)}
.nav{gap:clamp(18px,2.2vw,34px)}
.nav a{line-height:1.25}
.hero-copy{max-width:min(620px,100%)}
.hero-copy p{font-size:clamp(16px,1.35vw,19px)}
.why,.portfolio,.services,.workflow{padding-inline:0}
.value-grid{gap:0}
.value{padding:18px 20px}
.services-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr) minmax(0,.85fr)}
.workflow-grid{grid-template-columns:minmax(0,1.15fr) repeat(4,minmax(0,1fr))}
.cta-footer{width:100%}
.cta-contact-row{max-width:100%}
.cta-contact-item{min-width:0}
.cta-contact-text strong{word-break:break-word}

.home-dark .services-preview-inner{align-items:center}
.home-dark .services-preview-button{white-space:nowrap}

@media (max-width:1100px){
  .hero{min-height:clamp(660px,84svh,760px)}
  .hero-inner{min-height:inherit;grid-template-columns:1fr;align-items:end}
  .hero-note{display:none}
  .why-grid,.services-grid,.workflow-grid,.cta-grid{grid-template-columns:1fr}
  .service-intro{padding-right:0}
  .workflow-title{padding-right:0;margin-bottom:16px}
  .step{padding:18px 0;border-left:0;border-top:1px solid #ddd8d0}
  .step:first-of-type{border-top:0}
  .cta-grid{gap:30px}
  .portfolio-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:780px){
  .topbar{height:76px}
  .topbar.menu-open{background:rgba(7,8,8,.98)}
  .topbar-inner{display:flex;align-items:center;width:min(94vw,1200px)}
  .logo img{height:40px}
  .menu-toggle{
    display:inline-flex;align-items:center;justify-content:center;
    margin-left:auto;padding:0 10px;min-width:44px;background:none;border:0;color:#fff;font-size:28px;
  }
  .nav{
    display:none;position:absolute;top:76px;left:0;right:0;z-index:60;
    background:rgba(7,8,8,.98);backdrop-filter:blur(10px);
    padding:14px 5vw 22px;flex-direction:column;align-items:stretch;gap:6px;
    border-top:1px solid rgba(255,255,255,.08);box-shadow:0 16px 40px rgba(0,0,0,.35);
    max-height:calc(100svh - 76px);overflow-y:auto;
  }
  .nav.open{display:flex}
  .nav a{padding:12px 4px;border-bottom:1px solid rgba(255,255,255,.08)}
  .nav a:last-child{border-bottom:0}
  .hero{min-height:clamp(620px,86svh,740px)}
  .hero-inner{padding-top:108px;padding-bottom:42px}
  h1{font-size:clamp(42px,12vw,58px);line-height:.98}
  h2{font-size:clamp(30px,9vw,42px)}
  .hero-copy p{margin-top:18px}
  .hero-buttons{flex-direction:column;align-items:stretch}
  .button,.top-cta,.services-preview-button,.contact-v13-submit{width:100%}
  .section-head{display:block}
  .section-head a{display:inline-block;margin-top:14px}
  .value-grid{grid-template-columns:1fr 1fr}
  .value:nth-child(3){border-left:none}
  .portfolio-row figure{height:260px}
  .cta-copy h2{font-size:clamp(32px,9vw,40px)}
  .cta-contact-row{gap:14px;width:100%}
  .cta-contact-item{width:100%}
  .closing-note{white-space:normal}

  .home-dark .services-preview-inner{grid-template-columns:1fr;gap:20px}
  .home-dark .services-preview-button{width:100%;justify-content:space-between}

  .diensten-v30 .dv-wrap{width:min(92vw,720px)}
  .diensten-v30 .dv-grid{gap:18px}
  .diensten-v30 .dv-card-body{padding:18px 20px 20px}
  .diensten-v30 .dv-photo{height:260px}
  .diensten-v30 .dv-cta{width:100%;justify-content:space-between}

  .contact-v13-content{padding-top:108px;padding-bottom:24px}
  .contact-v13-grid{width:min(92vw,700px);gap:26px}
  .contact-v13-intro{font-size:16px;line-height:1.55}
  .contact-v13-form{gap:14px}
  .contact-v13-two{grid-template-columns:1fr}
  .contact-v13-form input,.contact-v13-form textarea{padding:15px 16px}
  .contact-v13-links-grid{grid-template-columns:1fr}
  .contact-v13-link{padding:18px 0;border-left:0;border-top:1px solid rgba(255,255,255,.12)}
  .contact-v13-link:first-child{border-top:0}
}

@media (max-width:520px){
  .wrap{width:90vw}
  .topbar-inner{width:90vw}
  .hero-copy p,.why-copy p,.service-intro p,.cta-copy p,.contact-v13-intro{font-size:15px}
  .why{padding:38px 0 34px}
  .portfolio{padding:24px 0 20px}
  .services{padding:28px 0 22px}
  .workflow{padding:24px 0 28px}
  .value-grid{grid-template-columns:1fr}
  .value{border-left:0;border-top:1px solid var(--line)}
  .value:first-child{border-top:0}
  .portfolio-row{grid-template-columns:1fr}
  .portfolio-row figure{height:220px}
  .cta-contact-icon{width:40px;height:40px;flex-basis:40px}
  .diensten-v30 .dv-heading h1{font-size:34px}
  .diensten-v30 .dv-photo{height:220px}
}


/* V73 — clean legal footer */
.site-legal-footer{
  background:#050606;
  color:#d7d7d4;
  border-top:1px solid rgba(255,255,255,.09);
  padding:0;
}
.site-legal-footer-inner{
  padding-top:26px;
  padding-bottom:22px;
}
.site-legal-footer-main,
.site-legal-footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.site-legal-footer-main{
  padding-bottom:18px;
}
.site-legal-footer-bottom{
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.08);
}
.site-legal-brand{
  color:#fff;
  font-size:13px;
  font-weight:600;
  letter-spacing:.01em;
}
.site-legal-contact{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
  color:#aaa9a4;
  font-size:12px;
}
.site-legal-contact a,
.site-legal-links a{
  transition:color .2s ease;
}
.site-legal-contact a:hover,
.site-legal-links a:hover{color:#fff}
.site-legal-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px 22px;
  font-size:10.5px;
  letter-spacing:.075em;
  text-transform:uppercase;
  color:#aaa9a4;
}
.site-legal-copy{
  flex:0 0 auto;
  color:#777771;
  font-size:11px;
}

.contact-v13-privacy-note{
  margin:0;
  color:#aaa;
  font-size:12px;
  line-height:1.5;
}
.contact-v13-privacy-note a{text-decoration:underline;text-underline-offset:3px;color:#e6e2dc}

.legal-page-body{background:#070808;color:#f3f1ed}
.legal-topbar{position:absolute;background:#070808}
.legal-page{min-height:100vh;padding:145px 0 74px;background:#070808}
.legal-wrap{width:min(920px,90vw)}
.legal-page-head{padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.13)}
.legal-page-head h1{font-size:clamp(46px,6vw,78px)}
.legal-updated{margin-top:16px;color:#9d9b96;font-size:13px}
.legal-content{padding-top:12px}
.legal-content section{padding:26px 0;border-bottom:1px solid rgba(255,255,255,.10)}
.legal-content section:last-child{border-bottom:0}
.legal-content h2{font-size:clamp(25px,3vw,34px);margin-bottom:14px}
.legal-content p,.legal-content li{
  color:#c9c7c1;
  font-size:15px;
  line-height:1.72;
}
.legal-content p+p{margin-top:8px}
.legal-content ul{margin:10px 0 0;padding-left:20px}
.legal-content li+li{margin-top:8px}
.legal-content a{text-decoration:underline;text-underline-offset:3px;color:#f0ede7}

@media(max-width:780px){
  .site-legal-footer-inner{padding-top:22px;padding-bottom:20px}
  .site-legal-footer-main,.site-legal-footer-bottom{align-items:flex-start;flex-direction:column;gap:12px}
  .site-legal-footer-main{padding-bottom:16px}
  .site-legal-footer-bottom{padding-top:14px}
  .site-legal-contact{justify-content:flex-start;gap:6px}
  .site-legal-links{gap:10px 16px;line-height:1.5}
  .site-legal-copy{margin-top:2px}
  .legal-page{padding-top:108px;padding-bottom:50px}
  .legal-page-head{padding-bottom:26px}
  .legal-content section{padding:22px 0}
  .legal-content p,.legal-content li{font-size:14.5px;line-height:1.67}
}


/* V74 — minimal legal footer */
.site-legal-footer-inner{padding-top:20px;padding-bottom:20px}
.site-legal-footer-bottom{padding-top:0;border-top:0}
@media(max-width:780px){
  .site-legal-footer-inner{padding-top:18px;padding-bottom:18px}
  .site-legal-footer-bottom{flex-direction:column;align-items:flex-start;gap:10px;padding-top:0}
}

/* V78 — mobile logo readability + workflow anchor positioning */
#werkwijze{
  scroll-margin-top:92px;
}

@media (max-width:780px){
  .logo img{
    height:44px;
  }
  #werkwijze{
    scroll-margin-top:88px;
  }
}

@media (max-width:420px){
  .logo img{
    height:43px;
  }
}

/* V79 — larger, clearer wordmark on desktop and mobile */
.logo img{
  height:54px;
}
@media (max-width:780px){
  .logo img{
    height:48px;
  }
}
@media (max-width:420px){
  .logo img{
    height:47px;
  }
}
