:root {
  --black: #0a291e;
  --charcoal: #10372a;
  --panel: #174b38;
  --gold: #83e7a7;
  --gold-light: #caf7d9;
  --green: #258d61;
  --ivory: #f5f5ef;
  --paper: #f7f8f4;
  --ink: #0b1711;
  --muted: #68736c;
  --line: #dce2dc;
  --dark-line: #caf7d91f;
  --shadow: 0 24px 70px rgba(3, 18, 10, .13);
}

body { background: var(--paper); }
.page-progress { background: linear-gradient(90deg, var(--green), #a6ffb9); }
.button-gold { background: var(--green); color: #fff; box-shadow: 0 0 0 1px #ffffff17 inset; }
.button-gold:hover { background: #216f50; box-shadow: 0 14px 38px #0e5b3940; }
.dark-eyebrow, .service-card > span, .service-symbol, .principle-grid span { color: var(--green); }
.section h2 em, .markets h2 em, .opportunities h2 em, .contact h2 em { color: var(--green); }
.hero h1 em { color: var(--gold); }
.hero h1 { max-width: 760px; font-size: clamp(3rem, 4.8vw, 5rem); line-height: .96; }
.site-header { height: 84px; }
.brand { width: 142px; height: 58px; }
.brand img { width: 144px; }
.desktop-nav { gap: 29px; }

.hero { background: #123d2e; }
.hero-media {
  overflow: hidden;
  filter: none;
  background:
    radial-gradient(circle at 76% 44%, #42c98a38 0 12%, transparent 34%),
    radial-gradient(circle at 84% 54%, #a6ffb91d, transparent 27%),
    linear-gradient(115deg, #0b3124 0%, #124833 52%, #1d6d4d 100%);
}
.hero-media:before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .28;
  background-image: linear-gradient(#bdf8d118 1px, transparent 1px), linear-gradient(90deg, #bdf8d118 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: radial-gradient(circle at 75% 48%, #000, transparent 62%);
}
.digital-stage {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: clamp(10px, 3vw, 60px);
  width: min(49vw, 690px);
  aspect-ratio: 1;
  transform: translateY(-50%);
  transform-style: preserve-3d;
  perspective: 1100px;
  animation: stageDrift 9s ease-in-out infinite;
}
.digital-core {
  position: absolute;
  left: 50%;
  top: 50%;
  width: clamp(130px, 13vw, 190px);
  aspect-ratio: 1;
  border: 1px solid #caffdc50;
  border-radius: 50%;
  display: grid;
  place-content: center;
  text-align: center;
  color: #fff;
  transform: translate(-50%, -50%) translateZ(95px);
  background: radial-gradient(circle at 35% 28%, #b5ffcc, #38b77c 28%, #146345 64%, #092d20 100%);
  box-shadow: 0 0 45px #84f4ac42, 0 0 120px #35c98236, inset -18px -22px 40px #05251c72;
  animation: corePulse 4.8s ease-in-out infinite;
}
.digital-core:before, .digital-core:after {
  content: '';
  position: absolute;
  border-radius: 50%;
  border: 1px solid #c7ffda4d;
  inset: -13px;
}
.digital-core:after { inset: -27px; border-style: dashed; animation: coreSpin 18s linear infinite; }
.digital-core span { font: 800 clamp(1.25rem, 2.2vw, 2rem)/1 var(--display); letter-spacing: -.06em; }
.digital-core i { margin-top: 6px; color: #d9ffe5; font: 700 .48rem var(--body); letter-spacing: .24em; }
.digital-orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  border: 1px solid #b8ffcf52;
  border-radius: 50%;
  transform-style: preserve-3d;
  box-shadow: 0 0 28px #79e9a51b;
}
.orbit-one { width: 88%; height: 36%; animation: orbitOne 15s linear infinite; }
.orbit-two { width: 72%; height: 72%; border-color: #72dca145; animation: orbitTwo 19s linear infinite reverse; }
.orbit-three { width: 52%; height: 92%; border-style: dashed; border-color: #ccffdc35; animation: orbitThree 23s linear infinite; }
.digital-card {
  position: absolute;
  min-width: 128px;
  padding: 13px 15px;
  border: 1px solid #d7ffe344;
  color: #fff;
  background: linear-gradient(135deg, #ffffff20, #d2ffe510);
  box-shadow: 0 18px 55px #041b1352, inset 0 1px #ffffff31;
  backdrop-filter: blur(15px);
  transform: perspective(700px) rotateY(var(--rotate, -8deg)) translateZ(var(--depth, 45px));
  animation: cardFloat 5.5s ease-in-out infinite;
}
.digital-card i, .digital-card b { display: block; }
.digital-card i { color: #a6ffb9; font: 700 .5rem var(--body); letter-spacing: .13em; }
.digital-card b { margin-top: 4px; font: 700 .7rem var(--display); letter-spacing: .12em; }
.card-strategy { left: 3%; top: 18%; --rotate: 9deg; --depth: 55px; }
.card-content { right: 1%; top: 12%; --rotate: -11deg; --depth: 85px; animation-delay: -1.4s; }
.card-growth { left: 0; bottom: 15%; --rotate: 12deg; --depth: 75px; animation-delay: -2.8s; }
.card-ai { right: 5%; bottom: 10%; --rotate: -8deg; --depth: 105px; animation-delay: -4.1s; }
.digital-node { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #a6ffb9; box-shadow: 0 0 18px #a6ffb9; animation: nodeBlink 2.7s ease-in-out infinite; }
.node-one { left: 22%; top: 48%; }.node-two { right: 21%; top: 38%; animation-delay: -.9s; }.node-three { right: 31%; bottom: 23%; animation-delay: -1.8s; }
.hero-shade {
  background: linear-gradient(90deg, rgba(10, 45, 32, .98) 0%, rgba(13, 56, 40, .9) 44%, rgba(12, 55, 39, .12) 70%, rgba(8, 38, 27, .2) 100%);
}
.hero-shade:before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .15;
  background-image: linear-gradient(#a6ffb91b 1px, transparent 1px), linear-gradient(90deg, #a6ffb91b 1px, transparent 1px);
  background-size: 74px 74px;
  mask-image: linear-gradient(90deg, #000 0%, #0008 58%, transparent 88%);
}
.hero-shade:after { background: radial-gradient(circle at 72% 55%, #79eaa538, transparent 36%), linear-gradient(180deg, transparent 74%, #0a291e); }
.hero-panel { background: rgba(13, 57, 40, .78); border-color: #b5f3cb38; }
.hero-values, .hero-values span, .market-lines, .market-lines span { border-color: #c8f7d72b; }
.hero-panel h2 { max-width: 390px; font-size: clamp(1.45rem, 2vw, 1.8rem); line-height: 1.2; }
.market-lines span { grid-template-columns: 100px minmax(0, 1fr); gap: 14px; align-items: start; }
.market-lines b { font-size: .62rem; line-height: 1.5; letter-spacing: .035em; }
.hero-site-shortcut {
  position: relative;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  max-width: 650px;
  margin-top: 18px;
  padding: 11px 13px;
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(100deg, #ffffff12, #ffffff08);
  border: 1px solid #caffdc35;
  box-shadow: 0 18px 45px #041c1428, inset 0 1px #ffffff17;
  backdrop-filter: blur(14px);
  transition: transform .28s ease, border-color .28s ease, background .28s ease;
}
.hero-site-shortcut:after {
  content: '';
  position: absolute;
  right: -35px;
  width: 95px;
  height: 95px;
  border-radius: 50%;
  background: #83e7a71c;
  box-shadow: 0 0 50px #83e7a72b;
}
.hero-site-shortcut:hover { transform: translateY(-3px); border-color: #a6ffb980; background: #ffffff17; }
.shortcut-mark {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  color: #0a291e;
  background: #a6ffb9;
  font: 800 .68rem var(--display);
  box-shadow: 0 10px 25px #031b133d;
}
.hero-site-shortcut span:nth-child(2) { min-width: 0; }
.hero-site-shortcut small, .hero-site-shortcut strong { display: block; }
.hero-site-shortcut small { margin-bottom: 2px; color: #9eeeb9; font-size: .5rem; font-weight: 700; letter-spacing: .16em; }
.hero-site-shortcut strong { font: 700 .77rem/1.25 var(--display); }
.hero-site-shortcut i { position: relative; z-index: 1; color: #d7e9dd; font-size: .61rem; font-style: normal; white-space: nowrap; }
.hero-site-shortcut i b { margin-left: 8px; color: #a6ffb9; }

.expertise-strip { background: linear-gradient(90deg, #1d7651, #2a9366 52%, #1d7651); color: #fff; }
.strip-track b { color: #a6ffb9; }
.service-card { position: relative; isolation: isolate; overflow: hidden; box-shadow: 0 1px 0 #fff inset; }
.service-card:before { content: ''; position: absolute; z-index: -1; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, var(--green), #83e7a7); transform: scaleX(.18); transform-origin: left; transition: transform .4s ease; }
.service-card:after { content: ''; position: absolute; z-index: -1; right: -90px; bottom: -110px; width: 210px; height: 210px; border: 1px solid #258d6118; border-radius: 50%; transition: transform .45s ease, background .45s ease; }
.service-card:hover:before { transform: scaleX(1); }
.service-card:hover:after { transform: scale(1.13); background: #83e7a70b; }
.service-card.featured { background: linear-gradient(145deg, #103629, #19503b); border-color: #29644b; }
.service-card.website-service { background: #edf3ed; }
.featured .service-symbol { background: var(--gold); color: var(--black); border-color: var(--gold); }
.featured p { color: #adc0b1; }

.markets, .contact { background: linear-gradient(145deg, #103629, #19503b); }
.market-tabs button.active { background: var(--green); color: #fff; border-color: var(--green); }
.market-stamp { box-shadow: 0 18px 50px #0007; }
.offer-card { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(135deg, #247c57, #39a874); color: #fff; border: 1px solid #ffffff2b; box-shadow: 0 32px 90px #08271b27; }
.offer-card:after { content: ''; position: absolute; z-index: -1; width: 430px; height: 430px; left: -190px; bottom: -300px; border: 1px solid #caffdc32; border-radius: 50%; box-shadow: 0 0 0 55px #caffdc08, 0 0 0 110px #caffdc06; }
.offer-copy, .included { min-width: 0; }
.offer-copy .eyebrow { color: var(--gold-light); }
.offer-copy > p:not(.eyebrow), .limited { color: #d7e7dc; }
.offer-copy h2 em { color: var(--gold-light); text-shadow: none; }
.price-line del { color: #b7cdbf; }
.offer-price-duo { display:flex; align-items:flex-end; gap:18px; margin:30px 0 10px; }
.offer-price-duo > span { display:flex; flex-direction:column; gap:4px; }
.offer-price-duo strong { display:inline-flex; align-items:flex-start; white-space:nowrap; font:800 3.25rem/.9 var(--display); letter-spacing:-.07em; }
.offer-price-duo small { color:#d5e8dc; font-size:.67rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.offer-price-duo strong .home-price-prefix,.offer-price-duo strong .home-price-suffix { color:inherit; font:800 .4em/1 var(--display); letter-spacing:-.025em; text-transform:none; }
.offer-price-duo strong .home-price-prefix { margin:.08em .08em 0 0; }
.offer-price-duo strong .home-price-suffix { margin:.08em 0 0 .07em; }
.offer-price-duo strong .home-price-decimals { font-size:.44em; letter-spacing:-.04em; }
.offer-price-duo i { padding-bottom:13px; color:#b9d2c3; font-size:.68rem; font-style:normal; text-transform:uppercase; }
.button-dark { background: #f7f4eb; color: #102118; }
.included { background: linear-gradient(150deg, #103629, #174b38); }
.extras { background: #efefe9; }
.extras > span, .extras i:before { color: var(--green); }
.extras i { color: #53635a; }
.domain-guide-link { display: grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:22px; margin-top:12px; padding:18px 22px; color:#d7e9dd; background:#123b2d; border:1px solid #245843; text-decoration:none; transition:transform .25s ease,border-color .25s ease; }
.domain-guide-link:hover { transform:translateY(-3px); border-color:#83e7a780; }
.domain-guide-link span { color:#83e7a7; font-size:.54rem; font-weight:800; letter-spacing:.14em; }
.domain-guide-link strong { font:700 .78rem var(--display); }
.domain-guide-link b { color:#a6ffb9; font-size:.66rem; white-space:nowrap; }
.website-offer { padding-bottom: 0; }
.order-process { padding-top: 88px; padding-bottom: 105px; }
.process-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 54px; }
.process-heading h2 { margin: 0; max-width: 780px; font-size: clamp(3rem, 5.3vw, 5.5rem); }
.process-speed { position: relative; flex: 0 0 225px; padding: 24px 26px 22px; color: #fff; background: linear-gradient(145deg, #0c3023, #1c6749); border-top: 3px solid #83e7a7; box-shadow: 0 20px 55px #06211724; }
.process-speed:after { content: '→'; position: absolute; top: 20px; right: 22px; color: #a6ffb9; font-size: 1.1rem; }
.process-speed span, .process-speed small { display: block; }
.process-speed span { color: #b8f7cd; font-size: .58rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.process-speed strong { display: block; margin: 12px 0 7px; font: 800 3.7rem/.84 var(--display); letter-spacing: -.07em; }
.process-speed small { color: #c5d9cd; font-size: .62rem; }
.process-intro { max-width: 690px; margin: 34px 0 54px; color: var(--muted); font-size: .92rem; line-height: 1.7; }
.process-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.process-grid article { position: relative; min-width: 0; min-height: 255px; padding: 29px 25px 27px; overflow: hidden; background: #fff; border: 1px solid var(--line); border-top: 3px solid #258d61; transition: transform .3s ease, box-shadow .3s ease; }
.process-grid article:hover { transform: translateY(-7px); box-shadow: var(--shadow); }
.process-grid article:after { content: ''; position: absolute; width: 115px; height: 115px; right: -54px; bottom: -57px; border: 1px solid #83e7a750; border-radius: 50%; }
.process-grid span { display: block; color: var(--green); font: 700 .67rem var(--display); letter-spacing: .12em; }
.process-grid h3 { margin: 48px 0 13px; font: 700 1.25rem/1.15 var(--display); letter-spacing: -.035em; }
.process-grid p { margin: 0; color: var(--muted); font-size: .76rem; line-height: 1.62; }
.process-note { max-width: 880px; margin: 21px 0 0; color: #7d8981; font-size: .61rem; line-height: 1.55; }
.connected-portfolio { padding-top: 0; }
.offer-portfolio-link {
  position: relative;
  display: grid;
  grid-template-columns: .75fr 1.15fr 1.35fr;
  gap: 30px;
  align-items: center;
  margin: 0 0 74px;
  padding: 30px 34px;
  color: #fff;
  background: linear-gradient(120deg, #0c3023, #16533b);
  border-top: 3px solid #83e7a7;
  box-shadow: 0 22px 55px #0621171a;
}
.offer-portfolio-link:before {
  content: '';
  position: absolute;
  left: 34px;
  top: -19px;
  width: 1px;
  height: 16px;
  background: #83e7a7;
}
.offer-portfolio-link span { color: #a6ffb9; font-size: .58rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.offer-portfolio-link strong { font: 700 1.25rem/1.25 var(--display); letter-spacing: -.03em; }
.offer-portfolio-link p { margin: 0; color: #b9ccc0; font-size: .76rem; line-height: 1.55; }

.project { background: #07150d; }
.opportunities { background: #123b2d; }
.digital-growth-visual {
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 50%, #86efaa2d 0 16%, transparent 42%),
    linear-gradient(#b9f9cf16 1px, transparent 1px),
    linear-gradient(90deg, #b9f9cf16 1px, transparent 1px),
    linear-gradient(145deg, #0b2f23, #1b704e);
  background-size: auto, 54px 54px, 54px 54px, auto;
}
.digital-growth-visual:before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(46%, 280px);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: conic-gradient(from 30deg, #a6ffb9, #2da573, #0d4632, #72dda0, #a6ffb9);
  box-shadow: 0 0 0 28px #a6ffb90c, 0 0 0 58px #a6ffb908, 0 40px 100px #031b134f;
  animation: visualSpin 13s linear infinite;
}
.digital-growth-visual:after {
  content: 'DIGITAL\A GROWTH';
  position: absolute;
  inset: auto;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  white-space: pre;
  text-align: center;
  color: #fff;
  background: #0b3023d6;
  border: 1px solid #caffdc55;
  border-radius: 50%;
  width: min(29%, 175px);
  aspect-ratio: 1;
  display: grid;
  place-content: center;
  font: 800 clamp(.75rem, 1.3vw, 1.15rem)/1.25 var(--display);
  letter-spacing: .14em;
  box-shadow: 0 18px 55px #031b135c;
}
.contact-form input, .contact-form select, .contact-form textarea { background: #f6faf5; }
.contact-form { box-shadow: 0 28px 75px #06211732; border-top: 3px solid #83e7a7; }
.whatsapp { background: #ffffff08; transition: transform .25s ease, border-color .25s ease, background .25s ease; }
.whatsapp:hover { transform: translateY(-3px); border-color: #83e7a760; background: #ffffff0d; }
.whatsapp > span { background: linear-gradient(145deg, #3bcf79, #249b5b); box-shadow: 0 8px 22px #051f164f; }
footer { background: #0a291e; }
.footer-logo { width: 172px; height: 72px; }
.footer-logo img { width: 174px; }
.language-switcher span, .mobile-languages span {
  color: #829087;
  font-size: .58rem;
  font-weight: 700;
  padding: 7px 8px;
  cursor: default;
}
.mobile-languages span { border: 1px solid #ffffff20; font-size: .65rem; }
.footer-bottom .is-pending { color: #59635d; padding: 2px 5px; }

@keyframes stageDrift { 0%,100% { transform: translateY(-50%) rotateX(0deg) rotateY(0deg); } 50% { transform: translateY(calc(-50% - 10px)) rotateX(2deg) rotateY(-2deg); } }
@keyframes corePulse { 0%,100% { scale: 1; filter: brightness(1); } 50% { scale: 1.045; filter: brightness(1.12); } }
@keyframes coreSpin { to { transform: rotate(360deg); } }
@keyframes orbitOne { from { transform: translate(-50%,-50%) rotateX(67deg) rotateZ(0); } to { transform: translate(-50%,-50%) rotateX(67deg) rotateZ(360deg); } }
@keyframes orbitTwo { from { transform: translate(-50%,-50%) rotateY(66deg) rotateZ(0); } to { transform: translate(-50%,-50%) rotateY(66deg) rotateZ(360deg); } }
@keyframes orbitThree { from { transform: translate(-50%,-50%) rotateX(28deg) rotateY(60deg) rotateZ(0); } to { transform: translate(-50%,-50%) rotateX(28deg) rotateY(60deg) rotateZ(360deg); } }
@keyframes cardFloat { 0%,100% { translate: 0 0; } 50% { translate: 0 -13px; } }
@keyframes nodeBlink { 0%,100% { opacity: .35; scale: .8; } 50% { opacity: 1; scale: 1.3; } }
@keyframes visualSpin { to { transform: translate(-50%, -50%) rotate(360deg); } }

@media (max-width: 680px) {
  body { padding-bottom: 24px; }
  .hero-copy, .hero-panel, .intro-copy, .section-heading, .service-card,
  .markets-copy, .market-content, .offer-copy, .included, .extras,
  .project, .opportunity-copy, .principle-grid article, .contact-copy,
  .contact-form, .footer-main > * { min-width: 0; max-width: 100%; }
  .hero-copy p, .hero-panel h2, .hero-panel a, .market-lines span,
  .service-card h3, .service-card p, .service-card a, .market-content h3,
  .market-content li, .offer-copy p, .included li, .extras i,
  .section-heading p, .opportunity-copy p, .opportunity-points span,
  .principle-grid p, .contact-copy p, .contact-form label,
  .footer-main p, .footer-main a { overflow-wrap: anywhere; word-break: normal; }
  .button { max-width: 100%; white-space: normal; text-align: center; line-height: 1.3; }
  .site-header { height: 74px; }
  .brand { width: 106px; height: 46px; }
  .brand img { width: 108px; }
  .header-tools { gap: 7px; }
  .language-switcher { display: flex; }
  .language-switcher a { padding: 6px 6px; font-size: .52rem; }
  .menu-toggle { width: 38px; }
  .menu-toggle span { width: 21px; }
  .hero h1 { max-width: 100%; font-size: clamp(2.35rem, 10.5vw, 3.15rem); line-height: .98; letter-spacing: -.058em; }
  .hero-shade { background: linear-gradient(180deg, rgba(11, 50, 36, .78), rgba(10, 43, 31, .94) 68%, #0a291e); }
  .hero-shade:before { background-size: 52px 52px; mask-image: linear-gradient(#000, transparent 72%); }
  .digital-stage { width: 520px; right: -285px; top: 29%; opacity: .58; }
  .digital-core { width: 125px; }
  .digital-card { min-width: 105px; padding: 10px 12px; }
  .digital-card b { font-size: .57rem; }
  .card-content, .card-growth { display: none; }
  .hero-panel h2 { font-size: 1.42rem; line-height: 1.2; }
  .hero-site-shortcut { grid-template-columns: 42px minmax(0, 1fr) 18px; gap: 11px; width: 100%; margin-top: 14px; padding: 10px; }
  .shortcut-mark { width: 42px; height: 42px; }
  .hero-site-shortcut strong { font-size: .69rem; overflow-wrap: anywhere; }
  .hero-site-shortcut small { font-size: .45rem; }
  .hero-site-shortcut i { font-size: 0; }
  .hero-site-shortcut i b { margin: 0; font-size: .9rem; }
  .market-lines span { grid-template-columns: 1fr; gap: 4px; padding: 14px 0; }
  .market-lines b { font-size: .58rem; letter-spacing: .09em; }
  .market-tabs { flex-wrap: wrap; }
  .market-tabs button { flex: 1 1 135px; min-width: 0; }
  .website-offer { width: calc(100% - 24px); }
  .offer-card { width: 100%; min-width: 0; overflow: hidden; }
  .offer-copy, .included { width: 100%; min-width: 0; padding: 34px 22px; }
  .offer-copy h2 { font-size: clamp(2.55rem, 13vw, 3rem); line-height: .96; letter-spacing: -.065em; }
  .offer-copy > p, .limited, .included li { overflow-wrap: anywhere; }
  .price-line { display: block; margin: 28px 0 8px; }
  .price-line del { display: block; font-size: 1.15rem; line-height: 1; }
  .price-line strong { display: block; margin: 12px 0 8px; font-size: 3.55rem; line-height: .82; letter-spacing: -.065em; }
  .price-line span { display: block; padding: 0; font-size: .75rem; line-height: 1.35; }
  .offer-price-duo { display:grid; grid-template-columns:1fr auto 1fr; align-items:end; gap:10px; margin:25px 0 12px; }
  .offer-price-duo strong { font-size:2.35rem; }
  .offer-price-duo small { font-size:.55rem; }
  .offer-price-duo i { padding-bottom:10px; }
  .offer-copy .button { width: 100%; min-width: 0; height: auto; min-height: 52px; padding: 13px 14px; white-space: normal; text-align: center; line-height: 1.3; }
  .offer-copy .button span { flex: none; }
  .domain-guide-link { grid-template-columns:1fr; gap:6px; padding:18px; }
  .domain-guide-link b { margin-top:5px; }
  .included li { grid-template-columns: 34px minmax(0, 1fr); gap: 10px; }
  .included .text-link { max-width: 100%; }
  .order-process { width: calc(100% - 32px); padding-top: 68px; padding-bottom: 76px; }
  .process-heading { display: block; }
  .process-heading h2 { font-size: clamp(2.55rem, 12vw, 3.45rem); line-height: .96; }
  .process-speed { width: 100%; margin-top: 30px; padding: 22px; }
  .process-speed strong { font-size: 3.35rem; }
  .process-intro { margin: 28px 0 36px; font-size: .82rem; }
  .process-grid { grid-template-columns: 1fr; gap: 11px; }
  .process-grid article { min-height: 0; padding: 24px 22px 25px; }
  .process-grid h3 { margin: 29px 0 10px; }
  .process-note { font-size: .58rem; overflow-wrap: anywhere; }
  .offer-portfolio-link { grid-template-columns: 1fr; gap: 12px; margin-bottom: 52px; padding: 26px 22px; }
  .offer-portfolio-link strong { font-size: 1.15rem; }
  .offer-portfolio-link p { font-size: .72rem; }
  .portfolio-grid { grid-template-columns: 1fr; grid-template-rows: none; gap: 12px; }
  .project, .project-large, .project-wide { grid-column: auto; grid-row: auto; width: 100%; min-height: 0; aspect-ratio: 1265 / 791; }
  .project img { object-fit: contain; object-position: center; background: #eef2ed; }
  .project:after { inset: 42% 0 0; }
  .project > span { left: 16px; right: 16px; bottom: 13px; }
  .project b { font-size: 1.05rem; }
  .project small { font-size: .5rem; }
  .digital-growth-visual { min-height: 390px; }
  .mobile-whatsapp {
    display: flex;
    position: fixed;
    z-index: 70;
    right: 14px;
    left: auto;
    bottom: max(14px, env(safe-area-inset-bottom));
    width: auto;
    min-width: 190px;
    height: 60px;
    padding: 7px 12px 7px 7px;
    justify-content: flex-start;
    gap: 10px;
    color: #fff;
    background: linear-gradient(135deg, #0a291ef5, #154a37f5);
    border: 1px solid #a6ffb947;
    border-radius: 18px;
    box-shadow: 0 18px 46px #03160f70, inset 0 1px #ffffff1f;
    backdrop-filter: blur(15px);
    font-size: .72rem;
  }
  .mobile-whatsapp .wa-icon { flex: none; width: 46px; height: 46px; display: grid; place-items: center; color: #09281d; background: linear-gradient(145deg, #a6ffb9, #57ce83); border-radius: 14px; box-shadow: 0 8px 22px #020e0a55; }
  .mobile-whatsapp .wa-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
  .mobile-whatsapp .wa-label { display: block; min-width: 0; line-height: 1.05; }
  .mobile-whatsapp .wa-label small, .mobile-whatsapp .wa-label strong { display: block; }
  .mobile-whatsapp .wa-label small { margin-bottom: 4px; color: #99b9a7; font-size: .48rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
  .mobile-whatsapp .wa-label strong { color: #fff; font: 700 .78rem var(--display); }
  .mobile-whatsapp > b { margin: 0 0 0 auto; color: #83e7a7; font-size: .82rem; }
}

@media (max-width: 380px) {
  .hero-values { grid-template-columns: 1fr; gap: 9px; }
  .hero-values span { width: 100%; }
  .contact-languages { align-items: flex-start; }
  .footer-main { grid-template-columns: 1fr; }
}

/* 2026 visual direction: luminous digital studio */
:root {
  --night: #041714;
  --night-blue: #071d29;
  --electric: #48c8df;
  --mint: #83f2b2;
  --lime: #d8ff68;
}

body {
  background:
    radial-gradient(circle at 8% 18%, #4bcf9210, transparent 28rem),
    radial-gradient(circle at 94% 48%, #48c8df0c, transparent 32rem),
    var(--paper);
}

.hero {
  min-height: min(920px, 100svh);
  isolation: isolate;
  background: var(--night);
}
.hero:before,
.hero:after {
  content: '';
  position: absolute;
  z-index: 1;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(2px);
}
.hero:before {
  width: clamp(360px, 48vw, 760px);
  aspect-ratio: 1;
  right: -10%;
  top: -20%;
  background: radial-gradient(circle, #47cee13b 0, #278e8a24 32%, transparent 69%);
  animation: auraBreathe 8s ease-in-out infinite;
}
.hero:after {
  width: clamp(300px, 38vw, 620px);
  aspect-ratio: 1;
  left: 38%;
  bottom: -38%;
  background: radial-gradient(circle, #d8ff6821 0, #55d89417 34%, transparent 70%);
  animation: auraBreathe 10s -4s ease-in-out infinite reverse;
}
.hero-media {
  background:
    linear-gradient(90deg, #031713f7 0%, #041b1edb 40%, #06202a4f 70%, #04151d36 100%),
    url('../images/hero/ecom-digital-ecosystem-v1.jpg') center / cover no-repeat;
  transform: scale(1.018);
  animation: heroImageDrift 16s ease-in-out infinite alternate;
}
.hero-media:before {
  opacity: .42;
  background-image:
    linear-gradient(#8decc917 1px, transparent 1px),
    linear-gradient(90deg, #8decc917 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(90deg, #000 0 33%, #0008 70%, transparent 100%);
}
.hero-media:after {
  content: '';
  position: absolute;
  inset: -30%;
  opacity: .42;
  background: conic-gradient(from 210deg at 74% 48%, transparent 0 25%, #53d4e111 28%, transparent 31% 62%, #d8ff680d 65%, transparent 68%);
  animation: spectrumTurn 22s linear infinite;
}
.hero-shade {
  background: linear-gradient(90deg, #041b17fc 0%, #06231edb 40%, #071d2970 67%, #061e24ba 100%);
}
.hero-shade:after {
  background:
    linear-gradient(115deg, transparent 0 60%, #6fe7ff0c 60.2% 60.5%, transparent 60.8%),
    radial-gradient(circle at 70% 49%, #7df6bd24, transparent 34%),
    linear-gradient(180deg, transparent 70%, #041714);
}
.hero-grid { z-index: 4; grid-template-columns: minmax(0,1.04fr) minmax(360px,.62fr); gap: clamp(44px,6vw,92px); }
.hero-copy { position: relative; }
.hero h1 > span, .hero h1 em, .hero h1 em span { display: block; }
.hero-copy:before {
  content: '';
  position: absolute;
  left: -22px;
  top: 4px;
  width: 2px;
  height: 78px;
  background: linear-gradient(var(--lime), var(--electric), transparent);
  box-shadow: 0 0 24px #55dce28f;
}
.hero h1 { max-width: 710px; font-size: clamp(3rem, 4.45vw, 4.72rem); }
.hero h1 em {
  color: transparent;
  background: linear-gradient(100deg, #7aefae 0%, #a3f8c5 48%, #72d8ef 100%);
  background-size: 180% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  animation: textGlow 7s ease-in-out infinite;
}
.hero-lead { color: #c1d4cf; line-height: 1.72; }
.button-gold {
  background: linear-gradient(110deg, #248f65, #32b879);
  border-color: #6ce8aa4f;
  box-shadow: 0 13px 34px #041a1350, inset 0 1px #caffdc52;
}
.button-gold:hover { background: linear-gradient(110deg, #2ea371, #45ca88); box-shadow: 0 18px 44px #0c714e42, inset 0 1px #e1ffe958; }
.button-ghost { background: #ffffff08; border-color: #b6e9dc38; backdrop-filter: blur(12px); }
.hero-site-shortcut {
  background: linear-gradient(110deg, #ffffff13, #48c8df0b 70%, #d8ff680c);
  border-color: #7ee5c248;
}
.shortcut-mark { background: linear-gradient(145deg, var(--lime), #77edaf); }
.hero-values { border-image: linear-gradient(90deg, #8df2c34d, transparent) 1; }
.hero-values i { color: var(--mint); }

.digital-stage {
  right: clamp(40px, 7vw, 130px);
  width: min(47vw, 720px);
  translate: var(--stage-x, 0px) var(--stage-y, 0px);
  filter: drop-shadow(0 45px 80px #020f145c);
}
.digital-stage { display: none; }
.digital-core {
  background: radial-gradient(circle at 32% 24%, #e0ff9b, #6ee3ab 23%, #2ca987 48%, #0b5361 72%, #061e29 100%);
  box-shadow: 0 0 50px #89f5bf66, 0 0 140px #48c8df42, inset -22px -28px 44px #041a287a;
}
.digital-core:after { border-color: #d8ff6866; }
.digital-orbit { border-color: #67d8ee5c; box-shadow: 0 0 38px #49cce122; }
.orbit-two { border-color: #8ff3b969; }
.orbit-three { border-color: #d8ff6850; }
.digital-card {
  border-color: #9ef5dc5e;
  background: linear-gradient(135deg, #d9fff626, #55cce617 55%, #0b405243);
  box-shadow: 0 22px 70px #020d174f, inset 0 1px #ffffff55;
}
.digital-card:after {
  content: '';
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 7px;
  height: 1px;
  background: linear-gradient(90deg, var(--lime), var(--electric), transparent);
  opacity: .65;
}
.digital-card i { color: var(--lime); }
.digital-node { background: var(--lime); box-shadow: 0 0 23px var(--lime); }

.hero-panel {
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, #0b2f2ecf, #092735d9);
  border: 1px solid transparent;
  background-clip: padding-box;
  box-shadow: 0 34px 90px #020f1766, inset 0 1px #d5fff242;
  backdrop-filter: blur(24px) saturate(130%);
  transform: perspective(1000px) rotateX(var(--panel-x, 0deg)) rotateY(var(--panel-y, 0deg));
  transition: transform .25s ease-out;
}
.hero-panel:before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  background: linear-gradient(90deg, var(--lime), var(--mint) 44%, var(--electric), transparent);
  box-shadow: 0 0 25px #67dfdb;
}
.hero-panel:after {
  content: '';
  position: absolute;
  width: 180px;
  aspect-ratio: 1;
  right: -90px;
  top: -95px;
  border-radius: 50%;
  background: #48c8df1f;
  box-shadow: 0 0 80px #48c8df2e;
  pointer-events: none;
}
.hero-panel > *, .hero-panel a { position: relative; z-index: 1; }
.hero-panel > p { color: #84ebbd; }
.market-lines span { border-color: #b9f7df25; }
.market-lines span:hover { background: linear-gradient(90deg, #82f2b40d, transparent); }
.hero-panel > a b { color: var(--lime); }

.expertise-strip { position: relative; background: linear-gradient(90deg, #147052, #238d69 36%, #137b88 72%, #147052); }
.expertise-strip:before { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 25%, #ffffff14 47%, transparent 69%); animation: stripShine 7s linear infinite; pointer-events: none; }
.strip-track b { color: var(--lime); text-shadow: 0 0 18px #d8ff6880; }

.intro, .services, .order-process, .portfolio, .principles { position: relative; }
.intro:before, .services:before, .order-process:before, .portfolio:before, .principles:before {
  content: '';
  position: absolute;
  z-index: -1;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  filter: blur(2px);
  pointer-events: none;
  background: radial-gradient(circle, #42ca8d15, transparent 68%);
}
.intro:before { right: -180px; top: 10%; }
.services:before { left: -230px; top: 24%; background: radial-gradient(circle, #48c8df12, transparent 68%); }
.service-grid { gap: 14px; }
.service-card {
  background: linear-gradient(145deg, #ffffff 0%, #f4faf7 75%, #edf8f5 100%);
  border-color: #d6e8e1;
  box-shadow: 0 18px 55px #08271b0a, inset 0 1px #fff;
  transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease, border-color .4s ease;
}
.service-card:nth-child(3n+2):before { background: linear-gradient(90deg, var(--electric), var(--mint)); }
.service-card:nth-child(3n):before { background: linear-gradient(90deg, var(--lime), var(--green)); }
.service-card:hover { transform: translateY(-9px) rotateX(1deg); border-color: #64cba444; box-shadow: 0 28px 80px #08271b18; }
.service-card.featured { background: linear-gradient(145deg, #06201d, #0b3940); }
.service-card.website-service { background: linear-gradient(145deg, #effff7, #e7f7f5); }
.service-symbol { background: linear-gradient(145deg, #effaf3, #e2f5ed); }
.featured .service-symbol { background: linear-gradient(145deg, var(--lime), #74e8b0); }

.website-offer { position: relative; }
.offer-card {
  background:
    radial-gradient(circle at 10% 105%, #d8ff6828, transparent 37%),
    radial-gradient(circle at 94% 10%, #48c8df32, transparent 38%),
    linear-gradient(130deg, #126244, #258d61 48%, #137c82);
  box-shadow: 0 38px 110px #082f2438;
}
.offer-card:before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image: linear-gradient(#d9fff00b 1px, transparent 1px), linear-gradient(90deg, #d9fff00b 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(90deg, #000, transparent 68%);
}
.included { background: linear-gradient(150deg, #061e1b, #0a3035); }
.process-grid { position: relative; }
.process-grid:before { content: ''; position: absolute; left: 4%; right: 4%; top: 40px; height: 1px; background: linear-gradient(90deg, var(--green), var(--electric), var(--lime)); opacity: .38; }
.process-grid article { background: linear-gradient(145deg, #fff, #f3faf7); }
.process-grid article:nth-child(even) { border-top-color: var(--electric); }
.process-grid article:before { content: ''; position: absolute; top: 31px; left: 25px; width: 8px; height: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 18px #9cf39a; }

.offer-portfolio-link { background: linear-gradient(118deg, #061f1c, #0b3940 62%, #104b49); border-top-color: var(--electric); }
.portfolio-grid { gap: 18px; }
.project { border: 1px solid #d8ece3; box-shadow: 0 20px 55px #041a1114; }
.project:before { content: ''; position: absolute; z-index: 2; inset: 0; opacity: 0; background: linear-gradient(130deg, #78edb41e, transparent 45%, #4bd0e41b); transition: opacity .45s ease; }
.project:hover:before { opacity: 1; }
.project:hover img { transform: scale(1.025); filter: saturate(1.08) contrast(1.02); }

.markets, .contact {
  background:
    radial-gradient(circle at 8% 0, #49cc9222, transparent 28%),
    radial-gradient(circle at 92% 95%, #47c9df1d, transparent 35%),
    linear-gradient(145deg, #041a17, #082b2a 52%, #082632);
}
.opportunities { background: linear-gradient(120deg, #041a17, #082b32); }
.digital-growth-visual {
  background:
    radial-gradient(circle at 50% 50%, #86efaa35 0 15%, transparent 42%),
    radial-gradient(circle at 80% 18%, #48c8df25, transparent 27%),
    linear-gradient(#b9f9cf13 1px, transparent 1px),
    linear-gradient(90deg, #b9f9cf13 1px, transparent 1px),
    linear-gradient(145deg, #061b1f, #0d4050);
  background-size: auto, auto, 54px 54px, 54px 54px, auto;
}
.digital-growth-visual:before { background: conic-gradient(from 30deg, var(--lime), #43d19b, var(--electric), #0d5366, #72dda0, var(--lime)); }
.contact-form { border-top-color: var(--electric); background: linear-gradient(145deg, #fff, #f1faf7); }
.contact { position: relative; overflow: hidden; }
.contact:after { content: ''; position: absolute; width: 480px; height: 480px; right: -220px; top: -230px; border-radius: 50%; border: 1px solid #65d7e43b; box-shadow: 0 0 0 60px #51d7cb09, 0 0 0 120px #d8ff6806; animation: corePulse 6s ease-in-out infinite; pointer-events: none; }

@keyframes auraBreathe { 0%,100% { transform: scale(.92) translate3d(0,0,0); opacity: .62; } 50% { transform: scale(1.12) translate3d(-3%,4%,0); opacity: 1; } }
@keyframes spectrumTurn { to { transform: rotate(360deg); } }
@keyframes textGlow { 0%,100% { background-position: 0 50%; } 50% { background-position: 100% 50%; } }
@keyframes stripShine { from { transform: translateX(-55%); } to { transform: translateX(55%); } }
@keyframes heroImageDrift { from { transform: scale(1.018) translate3d(0,0,0); } to { transform: scale(1.055) translate3d(-.7%,.4%,0); } }

@media (max-width: 1080px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-panel { max-width: 580px; }
  .digital-stage { right: -7%; opacity: .72; }
}

@media (max-width: 680px) {
  .hero { min-height: 900px; }
  .hero:before { width: 430px; right: -55%; top: -7%; }
  .hero:after { left: -35%; bottom: -27%; }
  .hero-grid { padding-top: 112px; gap: 34px; }
  .hero-copy:before { left: -8px; top: -12px; height: 55px; }
  .hero h1 { font-size: clamp(2.45rem, 11.2vw, 3.25rem); line-height: .96; }
  .hero h1 { font-size: clamp(1.82rem, 8.45vw, 2.35rem); line-height: 1.01; letter-spacing: -.052em; }
  html[lang="en"] .hero h1 { font-size: clamp(1.66rem, 7.75vw, 2.18rem); letter-spacing: -.058em; }
  html[lang="nl"] .hero h1 { font-size: clamp(1.62rem, 7.55vw, 2.1rem); letter-spacing: -.06em; }
  .hero h1 > span, .hero h1 em span { white-space: nowrap; }
  .hero h1 em { color: #83f2b2; background: none; -webkit-text-fill-color: currentColor; animation: none; }
  html[lang="fr"] .hero h1 { letter-spacing: -.035em; }
  .hero-lead { color: #cadbd6; font-size: .84rem; line-height: 1.62; }
  .hero-media:before { background-size: 44px 44px; mask-image: linear-gradient(#000, transparent 78%); }
  .hero-shade { background: linear-gradient(180deg, #041a17d4 0%, #061f20ed 58%, #041714 100%); }
  .hero-media { background-position: 64% center; transform: scale(1.025); }
  .hero-panel { padding: 24px 20px; transform: none !important; }
  .hero-panel h2 { font-size: 1.35rem; }
  .hero-values { margin-top: 34px; }
  .process-grid:before { display: none; }
  .process-grid article:before { top: 25px; left: auto; right: 23px; }
  .service-card:hover { transform: none; }
  .portfolio-grid { gap: 14px; }
  .project { box-shadow: 0 14px 38px #041a1117; }
  .markets, .contact { background: radial-gradient(circle at 90% 7%, #48c8df1d, transparent 30%), linear-gradient(160deg, #041a17, #082d2c 60%, #082632); }
}

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