:root {
  --ink: #082b50;
  --muted: #52677b;
  --paper: #ffffff;
  --soft: #f2f6fa;
  --line: #dbe5ee;
  --brand: #ff4002;
  --brand-button: #ff4002;
  --brand-dark: #d92f00;
  --green: #14b8a6;
  --font: 'Poppins', Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; letter-spacing: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 120px; }
body { margin: 0; color: var(--ink); background: #fff; font: 400 16px/1.7 var(--font); }
h1,h2,h3,p,figure { margin: 0; }
h1,h2,h3 { font-weight: 700; line-height: 1.18; overflow-wrap: break-word; }
h1,h2,h3 { color: var(--ink); }
h2 { font-size: 38px; }
h2 em { color: var(--brand); font-style: normal; }
a { color: inherit; }
img { max-width: 100%; display: block; }
button,input,select,textarea { font: inherit; }
button,summary { cursor: pointer; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--brand); outline-offset: 5px; }
.wrap { width: min(1220px, calc(100% - 64px)); margin-inline: auto; position: relative; z-index: 1; }
.skip-link { position: fixed; left: 20px; top: -100px; z-index: 100; background: #fff; padding: 12px 20px; }
.skip-link:focus { top: 10px; }
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px) saturate(150%); box-shadow: 0 5px 20px #082b500a; }
.site-header::before { content:''; position:absolute; inset:0 0 auto; height:3px; background:linear-gradient(90deg,var(--brand),#ff4002,#14619c,#39b7d5,var(--brand)); background-size:200% 100%; animation:border-flow 8s linear infinite; }
.contact-topbar { background:linear-gradient(90deg,#05182c 0%,#092646 50%,#05182c 100%); color:#ffffff; border-bottom:1px solid rgba(255,255,255,.14); box-shadow:0 1px 6px rgba(0,0,0,.25); position:relative; z-index:10; }
.contact-topbar-inner { min-height:36px; display:flex; justify-content:space-between; align-items:center; gap:20px; font-size:12px; font-weight:700; letter-spacing:.02em; }
.topbar-badge { display:inline-flex; align-items:center; gap:8px; color:#ffffff; font-weight:700; text-shadow:0 1px 2px rgba(0,0,0,.75),0 2px 4px rgba(0,0,0,.45); }
.topbar-dot { width:7px; height:7px; border-radius:50%; background:#10b981; box-shadow:0 0 7px #10b981; display:inline-block; flex-shrink:0; animation:pulse-dot 2.5s infinite ease-in-out; }
@keyframes pulse-dot { 0%,100% { opacity:1; transform:scale(1); box-shadow:0 0 7px #10b981; } 50% { opacity:.65; transform:scale(.85); box-shadow:0 0 3px #10b981; } }
.contact-topbar-links { display:flex; align-items:center; gap:22px; }
.contact-topbar-links a { display:inline-flex; align-items:center; gap:7px; color:#ffffff; font-weight:700; text-decoration:none; white-space:nowrap; letter-spacing:.02em; text-shadow:0 1px 2px rgba(0,0,0,.75),0 2px 4px rgba(0,0,0,.45); transition:color .2s ease, text-shadow .2s ease, transform .15s ease; }
.contact-topbar-links a:hover { color:#ffffff; text-shadow:0 0 10px rgba(255,255,255,.6),0 1px 2px rgba(0,0,0,.8); transform:translateY(-.5px); }
.contact-topbar-links a:hover .icon-wa { filter:drop-shadow(0 0 6px rgba(37,211,102,.8)); }
.contact-topbar-links a:hover .icon-mail { filter:drop-shadow(0 0 6px rgba(56,189,248,.8)); }
.contact-topbar-links svg { width:13.5px; height:13.5px; flex:none; filter:drop-shadow(0 1px 2px rgba(0,0,0,.5)); }
.contact-topbar-links .icon-wa { color:#25d366; }
.contact-topbar-links .icon-mail { color:#38bdf8; }
.contact-topbar-links .icon-client { color:#f3c765; }
.nav-client-link { display:inline-flex; align-items:center; gap:6px; padding:8px 9px; color:var(--ink); font-size:12px; font-weight:700; text-decoration:none; white-space:nowrap; }
.nav-client-link svg { width:15px; height:15px; color:var(--brand); }
.nav-client-link:hover { color:var(--brand); }
.language-switch { display:inline-flex; align-items:center; gap:5px; padding:4px 6px; border:1px solid #d7dee6; border-radius:999px; background:#fff; }
.language-switch a { display:grid; place-items:center; width:25px; height:25px; border-radius:50%; font-size:16px; line-height:1; text-decoration:none; transition:background .2s, transform .2s; }
.language-switch a:hover { background:#fff1e9; transform:translateY(-1px); }
html[lang="en-US"] .hero-grid,html[lang="en-US"] .hero-content,html[lang="en-US"] .hero-portfolio { min-width:0; }
html[lang="en-US"] .hero-content { max-width:100%; overflow:hidden; }
html[lang="en-US"] .hero h1 { max-width:100%; overflow-wrap:anywhere; word-break:break-word; }
html[lang="en-US"] .hero h1 em { display:block; }
html[lang="en-US"] .hero-description { max-width:100%; overflow-wrap:anywhere; }
html[lang="en-US"] body { overflow-x:hidden; }
html[lang="en-US"] .hero-portfolio-stage { width:100%; max-width:100%; overflow:hidden; }
html[lang="en-US"] .hero-slide { max-width:100%; }
.nav { min-height: 76px; display: flex; justify-content: space-between; align-items: center; gap: 22px; }
.site-brand { flex-shrink: 0; }
.site-brand img { width: 158px; height: 48px; object-fit: contain; }
.header-right { display:flex; align-items:center; }
.main-nav { display: flex; align-items: center; gap: 12px; }
.main-nav > a { font-size: 13px; font-weight: 600; text-decoration: none; padding:8px 10px; border-radius:7px; position:relative; }
.main-nav > a:not(.button):not(.nav-reviews)::after { content:''; position:absolute; bottom:2px; left:10px; right:10px; height:2px; background:var(--brand); transform:scaleX(0); transition:transform .25s; }
.main-nav > a:not(.button):not(.nav-reviews):hover { background:#082b5007; }
.main-nav > a:not(.button):not(.nav-reviews):hover::after { transform:scaleX(1); }
.main-nav > .nav-reviews { display:flex; align-items:center; gap:7px; padding:7px 12px; background:#fff9ed; border:1px solid #e1b758; border-radius:999px; color:#805515; box-shadow:0 3px 12px #ac79151a; }
.nav-reviews svg { width:15px; height:15px; fill:#e4aa28; color:#e4aa28; }
.nav-reviews strong { padding:1px 6px; font-size:10px; border-radius:999px; color:#5d3b04; background:#f3c765; }
.main-nav > .nav-reviews:hover { color:#684310; background:#fff1d2; transform:translateY(-1px); }
.main-nav > a:hover:not(.button) { color: var(--brand); }
.button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 10px; padding: 13px 22px; font-size: 13px; line-height: 1.45; font-weight: 700; border: 1px solid transparent; border-radius: 6px; text-transform: none; text-align: center; text-decoration: none; transition: background .2s, box-shadow .2s, color .2s, transform .2s; position: relative; overflow: hidden; }
.button:hover { transform:translateY(-2px); }
.button > svg { width: 20px; height: 20px; flex-shrink: 0; stroke-width: 3; transition: transform .25s; }
.button:hover > svg { transform: translateX(4px); }
.button::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.22) 48%, transparent 65%); transform: translateX(-110%); pointer-events: none; }
.button:hover::after { animation: button-sweep .65s ease; }
.button-dark { background:linear-gradient(135deg,#103f6b,#082b50); color:#fff; border-color:#082b50; box-shadow:0 6px 18px #082b5028; }
.button-dark:hover { background:#123f68; box-shadow:0 9px 25px #082b5038; }
.button-brand { background:linear-gradient(135deg,#ff4002,#cf2c00); color:#fff; border-color:#ff4002; box-shadow:0 9px 23px #ff400230,inset 0 1px 0 #ffffff26; }
.button-brand:hover { background: var(--brand-dark); box-shadow: 0 8px 26px #ff400240; }
.button-light { background: #fff; color: var(--ink); border-color: #fff; }
.button-outline { border-color: var(--brand); background: transparent; color: var(--ink); }
.button-outline:hover { background: var(--brand); color: #fff; }
.button:disabled { opacity: .65; cursor: wait; }
.main-nav > .nav-contact { padding:10px 18px; border-radius:999px; background:linear-gradient(135deg,#ff4002,#cf2c00); color:#fff; border-color:#ff4002; box-shadow:0 4px 15px #ff400230,inset 0 1px 0 #ffffff25; }
.icon-button { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; background: transparent; color: inherit; border: 1px solid #b9cbdc; border-radius: 3px; transition: background .2s, color .2s, border-color .2s; }
.icon-button svg { width: 19px; height: 19px; }
.contract-read-button { margin-top: 12px; font-size: 13px; }
.icon-button:hover { background: var(--brand); color: #fff; border-color: var(--brand); }
.menu-toggle { display: none; }
.eyebrow { font-size: 12px; font-weight: 700; color: var(--ink); text-transform: uppercase; line-height: 1.6; }
.pattern-dark .eyebrow { color:#ffffff; }
.pattern-light { background-image: linear-gradient(#082b5005 1px,transparent 1px), linear-gradient(90deg,#082b5005 1px,transparent 1px); background-size: 44px 44px; }
.pattern-dark { background-image: linear-gradient(#c2ddff07 1px,transparent 1px), linear-gradient(90deg,#c2ddff07 1px,transparent 1px); background-size: 52px 52px; }
.hero { padding: 44px 0 34px; position: relative; background-color: #fbfcff; overflow: hidden; }
.home-landing .hero::before { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(#ffffff18 1px,transparent 1px),linear-gradient(90deg,#ffffff18 1px,transparent 1px),#082b50; background-size:48px 48px,48px 48px,auto; -webkit-mask-image:linear-gradient(90deg,transparent 37%,#000 70%); mask-image:linear-gradient(90deg,transparent 37%,#000 70%); }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 35px; align-items: center; }
.hero h1 { font-size: 51px; font-weight: 800; line-height: 1.1; margin-top: 18px; }
.hero h1 em { color: var(--brand); font-style: normal; }
.hero-description { max-width: 550px; font-size: 16px; color: #3e5870; margin-top: 22px; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 12px 22px; font-size: 11px; color: var(--muted); margin-top: 25px; }
.hero-proof strong { font-weight: 700; color: var(--ink); }
.hero-proof a { text-decoration: none; }
.hero-portfolio { min-width: 0; position: relative; }
.hero-portfolio-head { text-align: center; }
.hero-portfolio-head h2 { font-size: 28px; color:#fff; font-weight:800; line-height:1.12; }
.hero-portfolio-stage { position: relative; height: 330px; perspective: 1200px; overflow: hidden; }
.hero-slide { display: block; position: absolute; width: min(78%, 420px); top: 50%; left: 50%; text-decoration: none; opacity: 0; z-index: 0; pointer-events: none; transform: translate(-50%,-50%) scale(.65); transition: transform .8s cubic-bezier(.22,.61,.36,1), opacity .8s ease; }
.hero-slide.is-active { opacity: 1; z-index: 4; pointer-events: auto; transform: translate(-50%,-50%) translateZ(40px); }
.hero-slide.is-left { opacity: .45; z-index: 2; pointer-events: auto; transform: translate(-112%,-50%) rotateY(25deg) scale(.81); }
.hero-slide.is-right { opacity: .45; z-index: 2; pointer-events: auto; transform: translate(12%,-50%) rotateY(-25deg) scale(.81); }
.laptop-screen { position: relative; padding: 10px 9px 12px; border: 2px solid #1a2636; background: #0c1727; border-radius: 8px 8px 0 0; box-shadow: 0 14px 25px #082b5022; }
.laptop-screen::before { content:''; position:absolute; top:3px; left:50%; width:3px; height:3px; background:#6c7e90; border-radius:50%; }
.laptop-screen img { width: 100%; height: auto; aspect-ratio: 1.65; object-fit: cover; }
.laptop-base { width: 108%; margin-left: -4%; height: 13px; border-radius: 0 0 55% 55%; background: linear-gradient(#ebeff3,#bdc8d1 55%,#8da0b0); box-shadow: 0 14px 15px -12px #082b5080; position:relative; }
.laptop-base::after { content:''; position:absolute; width:17%; height:4px; top:0; left:41.5%; background:#98a5b1; border-radius:0 0 4px 4px; }
.hero-slide-name { display: block; padding-top: 17px; text-align: center; font-size: 12px; font-weight: 600; color: #fff; }
.hero-portfolio-controls { display:flex; align-items:center; justify-content:center; gap:12px; }
.hero-counter { min-width:66px; text-align:center; font:600 12px/1.5 var(--font); color:#fff; }
.hero-counter > span { color:#fff; }
.glow-divider { height:3px; background:linear-gradient(90deg,#062b4d,#2ba4cd,var(--brand),#ffbd91,#0d5480); background-size:300% 100%; animation:border-flow 7s linear infinite; }
.section { padding: 86px 0; position:relative; overflow:hidden; }
.section-soft { background-color: #f4f7fb; }
.section-head { display:grid; grid-template-columns:1.2fr 1fr; gap:70px; align-items:end; margin-bottom:40px; }
.section-head h2 { margin-top:13px; }
.section-head > p { color:var(--muted); font-size:15px; max-width:470px; }
.section-head > .eyebrow { color:var(--ink); font-size:12px; }
.centered { display:flex; flex-direction:column; gap:0; text-align:center; align-items:center; max-width:850px; margin-inline:auto; }
.centered > p:last-child { margin-top:19px; max-width:640px; }
.video-section { background-color: #fff; }
.video-showcase { position:relative; width:min(880px,100%); margin:0 auto; aspect-ratio:16/8.6; border:1px solid #ff400266; border-radius:8px; overflow:hidden; box-shadow:0 20px 55px #082b5029; background:#071b30; }
.video-showcase > img { position:absolute; width:100%; height:100%; object-fit:cover; }
.video-shade { position:absolute; inset:0; background:linear-gradient(100deg,#051c33e6,#051c3340); }
.video-soon { position:absolute; left:7%; right:7%; top:50%; transform:translateY(-50%); color:#fff; }
.video-soon > img { width:30px; height:46px; object-fit:contain; filter:drop-shadow(0 0 12px #ff400255); animation:flame-breathe 4s ease-in-out infinite; margin-bottom:12px; }
.video-soon > span { font-size:12px; color:#ffad89; font-weight:600; text-transform:uppercase; }
.video-soon h3 { color:#fff; font-size:32px; margin:11px 0 13px; }
.video-soon p { font-size:13px; color:#dae9f5; }
.video-corner { position:absolute; bottom:20px; right:24px; display:flex; gap:8px; align-items:center; font-size:11px; color:#fff; }
.video-corner svg { width:17px; height:17px; }
.agency-numbers { background-color:#062746; color:#fff; }
.agency-numbers h2,.agency-numbers h3 { color:#fff; }
.agency-numbers .section-head > p { color:#bfd0e0; }
.brand-flame { position:absolute; pointer-events:none; object-fit:contain; opacity:.07; }
.flame-numbers { width:310px; height:470px; right:8%; top:60px; transform:rotate(12deg); animation:flame-drift 12s ease-in-out infinite; }
.numbers-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:45px; margin-top:48px; }
.number-item { border-top:1px solid #a3c9e62b; padding-top:26px; }
.number-item > strong { display:flex; align-items:baseline; gap:7px; font-size:65px; font-weight:800; line-height:1.25; color:#fff; }
.number-item > strong em { color:var(--brand); font-style:normal; font-size:33px; }
.number-item h3 { font-size:19px; margin-top:10px; }
.number-item p { color:#adc7db; font-size:13px; margin-top:7px; }
.pricing-section { background-color:#f5f8fc; }
.pricing-section .section-head { margin-bottom:32px; }
.work-ribbon { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) .7fr; height:210px; margin-bottom:34px; overflow:hidden; gap:7px; }
.work-ribbon > div { position:relative; overflow:hidden; background:#073153; }
.work-ribbon > div > img { width:100%; height:100%; object-fit:cover; object-position:top; transition:transform 1s ease; }
.work-ribbon > div:hover > img { transform:scale(1.04); }
.work-ribbon > div::after { content:''; position:absolute; inset:0; background:linear-gradient(transparent 50%,#031930dd); pointer-events:none; }
.work-ribbon > div > span { position:absolute; left:16px; bottom:15px; color:#fff; z-index:1; font-size:12px; font-weight:600; }
.work-ribbon > .ribbon-brand { display:flex; align-items:center; justify-content:center; flex-direction:column; gap:12px; padding:20px; background:#082b50; }
.work-ribbon > .ribbon-brand::after { display:none; }
.work-ribbon > .ribbon-brand img { width:40px; height:60px; object-fit:contain; animation:flame-breathe 5s ease-in-out infinite; }
.ribbon-brand strong { font-size:12px; text-align:center; color:#fff; line-height:1.6; }
.plans-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; align-items:stretch; }
.plans-grid-four { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.plans-grid-four .plan { padding:27px 20px 23px; }
.plans-grid-four .plan h3 { font-size:22px; }
.plans-grid-four .plan-description { min-height:110px; }
.plans-grid-four .plan-price strong { font-size:27px; }
.plans-grid-four .plan ul { gap:11px; font-size:12px; }
.plans-grid-four .plan .button { min-height:47px; padding-inline:9px; font-size:11px; }
.plan-custom { --card-accent:#ffb27d; background:linear-gradient(150deg,#463d5d,#173953 48%,#071b33); }
.plan { --card-accent:#6ec3ed; display:flex; flex-direction:column; min-width:0; position:relative; padding:32px 28px 26px; background:linear-gradient(150deg,#1c5480,#0b294b 50%,#071b33); color:#fff; border:1px solid #8fcaee60; border-radius:7px; box-shadow:0 15px 40px #082b5020; overflow:hidden; cursor:pointer; transition:transform .3s,box-shadow .3s,border-color .3s; }
.plan:nth-child(3) { --card-accent:#6bdce6; background:linear-gradient(150deg,#176174,#103b57 50%,#081c32); }
.plan-featured { --card-accent:#ff9b69; border-color:var(--brand); background:linear-gradient(155deg,#7b351b 0%,#143555 38%,#071b33 100%); }
.plan::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,transparent,var(--card-accent),transparent); background-size:180% 100%; animation:border-flow 5s linear infinite; }
.plan::after { content:''; position:absolute; right:0; top:105px; width:110px; height:180px; background:url('../images/logo/llama.png') center / contain no-repeat; opacity:.075; pointer-events:none; }
.plan:hover { transform:translateY(-6px); box-shadow:0 22px 44px #082b503d; border-color:var(--card-accent); }
.plan-heading { display:flex; align-items:center; gap:11px; position:relative; z-index:1; }
.plan-index { font-size:12px; color:var(--card-accent); }
.plan h3 { font-size:26px; font-weight:800; color:#fff; }
.plan-description { font-size:13px; color:#d7e6f3; line-height:1.65; min-height:89px; margin-top:17px; position:relative; z-index:1; }
.plan-price { border-top:1px solid #cde4ff26; padding:20px 0; margin-top:17px; z-index:1; position:relative; }
.plan-price > span { font-size:11px; color:#c3d5e5; display:block; }
.plan-price strong { font-size:32px; font-weight:800; display:flex; flex-wrap:wrap; align-items:baseline; gap:7px; margin-top:5px; line-height:1.4; }
.plan-price small { font-size:13px; color:var(--card-accent); font-weight:600; }
.plan .button { width:100%; margin:18px 0 0; position:relative; z-index:1; padding-inline:10px; font-size:11px; min-height:44px; }
.plan .button-outline { color:#fff; border-color:var(--card-accent); background:#ffffff0a; }
.plan .button-outline:hover { color:#082b50; background:var(--card-accent); }
.plan-featured .button { background:linear-gradient(135deg,#e13b0b,#cf2c00); }
.plan ul { list-style:none; padding:0; margin:26px 0 22px; display:grid; gap:13px; font-size:13px; z-index:1; position:relative; }
.plan li { padding-left:24px; position:relative; min-height:20px; }
.plan li::before { content:''; position:absolute; top:7px; left:3px; width:10px; height:6px; border-left:2px solid var(--card-accent); border-bottom:2px solid var(--card-accent); transform:rotate(-45deg); }
.plan-info { position:absolute; inset:0; display:block; width:100%; height:100%; padding:0; border:0; border-radius:0; color:inherit; background:transparent; cursor:help; }
.plan-info > svg { display:none; }
.plan li:hover > span,.plan li:focus-within > span { text-decoration:underline; text-decoration-color:var(--card-accent); text-underline-offset:3px; }
.plan-info:focus-visible { outline:2px solid var(--card-accent); outline-offset:3px; }
.plan li.has-open-info::after { content:attr(data-tooltip); display:block; position:relative; z-index:2; margin:10px 0 2px; padding:11px 12px; border:1px solid #abcbe172; border-radius:5px; color:#eff8ff; background:#051a2e; font:400 12px/1.55 var(--font); pointer-events:none; }
.plan-maintenance { font-size:11px; line-height:1.7; color:#c0d2e3; margin-top:auto; padding-top:17px; border-top:1px solid #cde4ff26; position:relative; z-index:1; }
.plan-maintenance strong { display:inline-block; color:#fff; font-weight:600; margin-top:3px; }
.scope-note { font-size:11px; line-height:1.8; color:var(--muted); max-width:1060px; margin-top:24px; }
.pricing-commerce { background-color:#061c34; background-image:linear-gradient(#c2ddff12 1px,transparent 1px),linear-gradient(90deg,#c2ddff12 1px,transparent 1px); background-size:52px 52px; color:#fff; }
.pricing-commerce h2 { color:#fff; }
.pricing-commerce .section-head > p { color:#bed0e4; }
.pricing-commerce .scope-note { color:#adc1d9; }
.pricing-commerce .plan { box-shadow:0 14px 50px #0003; }
.specialty-link { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:30px 0 0; margin-top:39px; border-top:1px solid #a3c4e42e; }
.specialty-link h3 { color:#fff; font-size:21px; }
.specialty-link p { color:#adc1d9; font-size:13px; margin-top:8px; }
.specialty-link .button { flex-shrink:0; color:#fff; border-color:var(--brand); }
.specialty-link .button-outline { color:#fff; background:#082b50; border-color:#ff4002; }
.specialty-link .button-outline:hover { color:#fff; background:#ff4002; }
.specialty-link__actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; min-width:min(470px,100%); }
.specialty-link__actions .button { width:100%; justify-content:center; }
.specialty-link__actions .button-dark { color:#fff; background:#082b50; border-color:#ff4002; }
.specialty-link__actions .button-dark:hover { background:#ff4002; }
.specialty-link--split { display:block; padding-top:32px; text-align:center; }
.specialty-link__heading { max-width:760px; }
.specialty-link__heading { margin-inline:auto; }
.specialty-link__heading .eyebrow { color:#ff8b68; font-size:11px; font-weight:800; text-transform:uppercase; }
.specialty-link__heading h3 { margin-top:8px; font-size:28px; line-height:1.2; }
.specialty-link__heading > p:last-child { max-width:700px; margin:10px auto 0; }
.specialty-link__cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:24px; }
.specialty-choice { display:grid; grid-template-columns:145px minmax(0,1fr); min-height:180px; overflow:hidden; border:1px solid #326486; border-radius:7px; background:#0b3558; color:#fff; text-decoration:none; transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease; }
.specialty-choice:hover,.specialty-choice:focus-visible { border-color:#ff4002; box-shadow:0 18px 38px #0005; }
.specialty-choice:focus-visible { outline:3px solid #ffb29a; outline-offset:3px; }
.specialty-choice__visual { position:relative; display:flex; align-items:flex-end; justify-content:center; overflow:hidden; background:#061d35; }
.specialty-choice__visual img { width:130px; height:165px; object-fit:contain; object-position:center bottom; transition:transform .45s cubic-bezier(.2,.75,.25,1); }
.specialty-choice--ai .specialty-choice__visual img { width:150px; }
.specialty-choice:hover .specialty-choice__visual img,.specialty-choice:focus-visible .specialty-choice__visual img { transform:translateY(-7px) scale(1.05); }
.specialty-choice__copy { display:flex; flex-direction:column; padding:23px 20px; text-align:left; }
.specialty-choice__copy strong { color:#fff; font-size:19px; }
.specialty-choice__copy small { margin-top:8px; color:#dbeaf5; font-size:12px; line-height:1.55; }
.specialty-choice__copy b { display:inline-flex; align-items:center; gap:6px; margin-top:auto; color:#ff9a79; font-size:12px; }
.specialty-choice__copy svg { width:15px; height:15px; }
.specialty-wholesale { margin-top:28px; }
.specialty-wholesale + .specialty-link { margin-top:24px; }
.development-band { background:#061a30 url('../images/reunion-cafe-cuaderno.png') center 48% / cover no-repeat; color:#fff; border-bottom:0; isolation:isolate; }
.development-band::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#03172ed0 0%,#072a4ab8 55%,#082b5062 100%); }
.development-band::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(#082b5017 1px,transparent 1px),linear-gradient(90deg,#082b5017 1px,transparent 1px); background-size:44px 44px; }
.development-grid { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:70px; }
.development-grid h2 { margin-top:15px; color:#fff; }
.development-grid > div:last-child > p { color:#d7e6f4; font-size:15px; margin-bottom:25px; }
.development-grid .button-light { border-color:#fff; color:var(--ink); }
.portfolio-section { background-color:#f7faff; }
.portfolio-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:35px 25px; }
.portfolio-item { text-decoration:none; min-width:0; }
.portfolio-device { position:relative; min-height:225px; padding:12px 27px 34px 12px; display:flex; align-items:center; justify-content:center; }
.portfolio-laptop { position:relative; width:min(100%,350px); aspect-ratio:16 / 10; padding:10px 10px 26px; border:2px solid #13283b; border-radius:9px 9px 3px 3px; background:linear-gradient(145deg,#1b3042,#07192a 38%); box-shadow:0 14px 27px #082b5022; transition:transform .4s,box-shadow .4s; }
.portfolio-laptop::before { content:''; position:absolute; left:50%; bottom:7px; width:34px; height:3px; border-radius:999px; background:#6c8190; transform:translateX(-50%); opacity:.75; }
.portfolio-laptop::after { content:''; position:absolute; left:-8%; right:-8%; bottom:-18px; height:22px; border-radius:2px 2px 48% 48%; background:linear-gradient(#eef2f5 0%,#bdc8d0 42%,#8d9eaa 100%); box-shadow:0 7px 10px #082b5028; clip-path:polygon(4% 0,96% 0,100% 35%,94% 100%,6% 100%,0 35%); }
.portfolio-laptop img { display:block; width:100%; height:100%; aspect-ratio:16 / 10; object-fit:cover; object-position:top; border-radius:2px; }
.portfolio-phone-mini { position:absolute; right:7px; bottom:7px; width:49px; height:94px; padding:3px; border:2px solid #142b3e; border-radius:9px; background:#07192a; box-shadow:0 8px 16px #082b5035; z-index:2; transition:transform .4s; }
.portfolio-phone-mini img { width:100%; height:100%; object-fit:cover; object-position:top; border-radius:4px; }
.portfolio-item:hover .portfolio-laptop { transform:translateY(-4px); box-shadow:0 18px 35px #082b5030; }
.portfolio-item:hover .portfolio-phone-mini { transform:translateY(-6px) rotate(2deg); }
.portfolio-item > div { margin-top:16px; }
.portfolio-item h3 { font-size:17px; }
.portfolio-item span { display:flex; align-items:center; justify-content:space-between; font-size:12px; color:var(--muted); margin-top:5px; gap:8px; }
.portfolio-item svg { width:18px; height:18px; flex-shrink:0; color:var(--brand); }
.more-projects { margin-top:35px; }
.more-projects > summary { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:17px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:13px; font-weight:600; list-style:none; }
summary::-webkit-details-marker { display:none; }
.more-projects svg { width:19px; height:19px; }
.more-projects[open] > summary svg { transform:rotate(45deg); }
.more-projects .portfolio-grid { margin-top:30px; }
.reviews-section { background-color:#0a2e53; background-image:linear-gradient(145deg,#0a2e53 0%,#0c355d 56%,#08294b 100%),linear-gradient(#c2ddff0b 1px,transparent 1px),linear-gradient(90deg,#c2ddff0b 1px,transparent 1px); background-size:auto,48px 48px,48px 48px; color:#fff; }
.reviews-section h2 { color:#fff; }
.review-rating { justify-self:end; }
.google-score-card { display:grid; grid-template-columns:42px minmax(0,1fr); gap:12px 13px; align-items:center; min-width:300px; padding:16px 18px; border:1px solid #8eb9d43d; border-radius:8px; background:linear-gradient(145deg,#ffffff0d,#ffffff03); box-shadow:0 15px 36px #0002; }
.google-mark { display:grid; place-items:center; width:42px; height:42px; border:1px solid #dbe5ee; border-radius:8px; background:#fff; box-shadow:0 4px 12px #0002; }
.google-mark svg { width:28px; height:28px; }
.google-score-content { min-width:0; }
.google-score-content > strong { font-size:40px; font-weight:800; line-height:1; color:#fff; }
.google-score-content > span { display:block; color:#ff4002; font-size:18px; line-height:1.2; margin-top:4px; }
.google-score-content > small { display:block; color:#a8c4da; font-size:10px; margin-top:6px; }
.review-rating > strong { font-size:55px; font-weight:800; line-height:1; }
.review-rating > span { color:#ff4002; font-size:22px; margin-left:15px; white-space:nowrap; }
.review-rating > a { grid-column:1 / -1; display:flex; align-items:center; gap:8px; font-size:12px; text-decoration:none; margin-top:4px; }
.review-rating svg { width:17px; height:17px; }
.reviews-grid { display:flex; align-items:flex-start; gap:18px; overflow:hidden; scroll-behavior:smooth; }
.review { position:relative; display:flex; flex:0 0 calc((100% - 36px) / 3); flex-direction:column; align-self:flex-start; height:270px; min-width:0; padding:18px 20px 16px; overflow:hidden; border:1px solid #7fb5dd48; border-top:3px solid #ff4002; border-radius:7px; background:linear-gradient(150deg,#ffffff10 0%,#ffffff05 58%,#031b33a8 100%); box-shadow:0 12px 28px #03172e35; transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease,height .25s ease; }
.review:nth-child(3n + 2) { border-top-color:#38b7d5; }
.review:nth-child(3n) { border-top-color:#79d6c1; }
.review:hover { transform:translateY(-4px); border-color:#9fd3f0a1; box-shadow:0 18px 34px #03172e55; }
.review-stars { display:flex; align-items:center; gap:3px; margin-bottom:11px; color:#ff4002; }
.review-stars svg { width:13px; height:13px; fill:currentColor; stroke-width:1.5; }
.reviews-controls .icon-button { color:#dceaff; border-color:#83aed078; }
.review blockquote { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; max-height:calc(1.7em * 4); margin:0; color:#eff6fc; font-size:13px; line-height:1.7; }
.review.is-expanded { height:auto; min-height:270px; }
.review.is-expanded blockquote { display:block; max-height:none; overflow:visible; }
.review-expander-row { display:flex; justify-content:flex-end; min-height:32px; margin-top:5px; }
.review-expand { width:30px; height:30px; border-radius:50%; }
.review-expand svg { width:16px; height:16px; }
.review figcaption { display:flex; align-items:center; gap:11px; min-height:52px; margin-top:auto; padding-top:13px; border-top:1px solid #aacbe044; }
.review-avatar { position:relative; display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; margin:0; padding:0; overflow:hidden; border:2px solid #ff4002; border-radius:50%; color:#fff; background:linear-gradient(145deg,#19557d,#082b50); font-size:14px; font-weight:700; line-height:1; text-align:center; }
.review:nth-child(3n + 2) .review-avatar { border-color:#38b7d5; }
.review:nth-child(3n) .review-avatar { border-color:#79d6c1; }
.review-avatar img { display:block; width:100%; height:100%; margin:0; object-fit:cover; object-position:center 35%; }
.review-person { min-width:0; }
.review-person strong { display:block; overflow:hidden; color:#fff; font-size:12px; line-height:1.35; text-overflow:ellipsis; }
.review-person > span { display:block; margin-top:4px; color:#c5d8e8; font-size:10px; line-height:1.35; }
.reviews-controls { display:flex; align-items:center; justify-content:center; gap:10px; min-height:40px; margin:17px auto 0; color:#d5e4ef; font-size:11px; }
.reviews-controls [data-reviews-page] { min-width:60px; color:#d5e4ef; text-align:center; font-size:11px; font-weight:700; font-variant-numeric:tabular-nums; }
.reviews-controls .icon-button { width:36px; height:36px; color:#e8f2fa; border-color:#83aed078; background:linear-gradient(180deg,#103f6b,#082b50); }
.reviews-controls .icon-button:disabled { opacity:.4; cursor:default; }
.methodology-section { background:#04172c url('../images/disenador-editando-web.jpg') center / cover no-repeat; color:#fff; isolation:isolate; }
.methodology-section::before { content:''; position:absolute; inset:0; z-index:-1; background:#03182eea; }
.methodology-section h2 { color:#fff; }
.methodology-section .section-head > p { color:#a9c1d9; }
.flame-method { width:320px; height:500px; right:5%; top:180px; opacity:.05; animation:flame-drift 13s ease-in-out infinite; }
.pipeline-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:center; }
.pipeline-steps { display:grid; gap:10px; min-width:0; }
.pipeline-step { display:flex; align-items:center; gap:14px; width:100%; padding:15px; border:1px solid #aacdee1c; background:#ffffff04; border-radius:5px; color:#fff; text-align:left; transition:background .4s,border-color .4s,transform .4s; min-width:0; }
.pipeline-step.is-active { background:linear-gradient(100deg,#ff40022b,#ff400205); border-color:#ff40029e; transform:translateX(5px); }
.pipeline-step.is-done { border-color:#15b9be55; background:#15b9be0a; }
.step-icon { color:#89bada; display:flex; flex-shrink:0; }
.step-icon svg { width:25px; height:25px; }
.is-active .step-icon { color:#ff4002; }
.step-number { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:29px; height:29px; border:1px solid #a3c7e140; border-radius:50%; font-size:12px; font-weight:700; }
.step-number > svg { display:none; width:15px; height:15px; }
.is-active .step-number { background:var(--brand); border-color:var(--brand); color:#fff; box-shadow:0 0 14px #ff400230; }
.is-done .step-number { background:#138b90; border-color:#138b90; }
.is-done .step-number > span { display:none; }
.is-done .step-number > svg { display:block; }
.step-copy { min-width:0; flex:1; }
.step-copy strong { display:block; font-size:13px; line-height:1.45; }
.step-copy > span { color:#a7c0d8; font-size:10px; display:block; margin-top:4px; line-height:1.6; }
.step-arrow { width:16px; height:16px; flex-shrink:0; color:#6985a0; }
.pipeline-panel { position:relative; min-height:450px; padding:30px; background:linear-gradient(150deg,#143958dc,#091e34f0); border:1px solid #6591b580; border-radius:8px; box-shadow:0 20px 50px #0003; }
.pipeline-panel::before { content:''; position:absolute; top:0; left:5%; right:5%; height:2px; background:linear-gradient(90deg,transparent,var(--brand),#64d8ec,transparent); }
.pipeline-top { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.pipeline-top > span { color:#ffffff; font-weight:700; font-size:12px; }
.pipeline-top .icon-button { border-color:#6891b36e; width:33px; height:33px; }
.pipeline-illustration { display:flex; align-items:center; gap:20px; margin:20px 0 25px; height:70px; }
.pipeline-illustration > img { height:64px; width:42px; object-fit:contain; filter:drop-shadow(0 0 12px #ff400240); animation:flame-breathe 4s ease-in-out infinite; }
.pipeline-illustration > span { display:flex; width:62px; height:62px; align-items:center; justify-content:center; border:1px solid #7ea8cd4f; border-radius:8px; background:#ffffff08; }
.pipeline-illustration svg { width:32px; height:32px; color:#94c9ed; }
.pipeline-panel h3 { color:#fff; font-size:23px; min-height:55px; }
.pipeline-panel > p { color:#bbcee0; font-size:13px; min-height:110px; margin:17px 0 25px; line-height:1.8; }
.pipeline-progress { height:5px; background:#c5e5ff1a; border-radius:3px; overflow:hidden; }
.pipeline-progress > span { display:block; height:100%; width:17%; background:linear-gradient(90deg,var(--brand),#ffb15c); transition:width .6s ease; }
.pipeline-meta { display:flex; justify-content:space-between; gap:15px; margin-top:12px; font-size:10px; color:#9ab3cc; }
.pipeline-meta strong { color:#ffffff; }
.faq-grid { display:grid; grid-template-columns:1fr 1.5fr; gap:70px; }
.faq-grid h2 { margin-top:15px; }
.faq-list details { border-bottom:1px solid #ccdce9; }
.faq-list details:first-child { border-top:1px solid #ccdce9; }
.faq-list summary { list-style:none; position:relative; padding:19px 28px 19px 0; font-size:14px; font-weight:600; }
.faq-list summary::after { content:'+'; position:absolute; right:0; top:18px; font-size:19px; color:var(--brand); }
.faq-list details[open] summary::after { content:'-'; }
.faq-list p { color:var(--muted); font-size:13px; line-height:1.8; margin-bottom:22px; }
.contact-section { color:#fff; background:linear-gradient(135deg,#a92505 0%,#d93408 52%,#ff693a 100%); }
.contact-section::before { content:''; position:absolute; inset:0; background:linear-gradient(#ffffff0a 1px,transparent 1px),linear-gradient(90deg,#ffffff0a 1px,transparent 1px); background-size:42px 42px; }
.contact-section .contact-copy h2 { color:#fff; }
.contact-section .contact-copy .eyebrow { color:#ffffff; }
.contact-section .contact-copy > p:not(.eyebrow) { color:#fff3ef; }
.contact-section .contact-channel { color:#fff; }
.contact-section .contact-channel svg { color:#fff; }
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:75px; }
.contact-copy h2 { font-size:42px; margin-top:14px; }
.contact-copy > p:not(.eyebrow) { color:var(--muted); font-size:15px; margin:22px 0 30px; max-width:370px; }
.contact-channel { display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:600; font-size:14px; margin-top:16px; overflow-wrap:anywhere; }
.contact-channel svg,.contact-fallback svg { width:18px; height:18px; flex-shrink:0; color:var(--brand); }
.contact-form { min-width:0; padding:28px; border:1px solid var(--line); background:#f8fbff; border-radius:7px; box-shadow:0 12px 35px #082b500b; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.field { display:flex; flex-direction:column; gap:7px; font-size:11px; font-weight:600; color:#3e5973; }
.field-full { grid-column:1 / -1; }
.field input,.field select,.field textarea { min-height:46px; width:100%; border:1px solid #c3d4e1; border-radius:3px; padding:11px 12px; font-weight:400; font-size:13px; color:var(--ink); background:#fff; }
.field textarea { min-height:114px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus { outline:2px solid #ffe0d6; outline-offset:1px; border-color:var(--brand); }
.selected-plan { display:flex; align-items:center; justify-content:space-between; gap:15px; background:linear-gradient(135deg,#fff4ed,#fff9f5); border:1px solid #f5b99d; border-left:4px solid var(--brand); border-radius:6px; padding:14px 16px; margin-bottom:22px; font-size:12px; box-shadow:0 8px 20px #ff400214; }
.selected-plan-main { display:flex; flex-direction:column; gap:3px; min-width:0; }
.selected-plan-kicker { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink); }
.selected-plan-main > strong { font-size:15px; font-weight:800; color:var(--ink); }
.selected-plan-price-row { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px; margin-top:2px; font-size:12px; color:var(--muted); }
.selected-plan-price { font-size:18px; font-weight:800; color:#b83209; }
.selected-plan-delivery { font-size:11px; color:var(--muted); }
.selected-plan-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.selected-plan-contract { min-height:36px; padding:0 12px; font-size:11px; }
.quote-plan-picker { margin-top:14px; padding:13px 14px; border:1px solid #d4e2ee; border-radius:6px; background:#f8fbff; }
.quote-plan-picker-label { display:block; font-size:11px; font-weight:700; color:var(--ink); margin-bottom:9px; }
.quote-plan-pills { display:flex; flex-wrap:wrap; gap:8px; }
.quote-plan-pill { display:inline-flex; align-items:center; gap:6px; padding:8px 13px; border:1px solid #c3d5e5; border-radius:999px; background:#fff; color:var(--ink); font:600 11px/1.2 var(--font); cursor:pointer; transition:border-color .2s,background .2s,color .2s,transform .2s; }
.quote-plan-pill:hover { border-color:var(--brand); transform:translateY(-1px); }
.quote-plan-pill.is-selected { border-color:var(--brand); background:var(--brand); color:#000000; box-shadow:0 6px 14px #ff400230; }
.contact-form > .button { width:100%; margin-top:23px; }
.form-note { color:var(--muted); font-size:10px; margin-top:12px; }
.form-status { font-size:12px; margin-top:12px; }
.form-status.ok { color:#16735b; }
.form-status.error { color:#c4310a; }
.contact-fallback { display:inline-flex; align-items:center; gap:8px; margin-top:12px; font-size:13px; }
.honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.site-footer { background:#051c34; color:#fff; padding:45px 0 24px; border-top:3px solid var(--brand); }
.footer-top { display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:54px; align-items:start; }
.footer-intro,.footer-contact,.footer-client { min-width:0; }
.footer-brand img { width:165px; height:55px; object-fit:contain; }
.footer-top p { font-size:13px; line-height:1.75; color:#b8cee0; }
.site-footer .footer-top h2 { margin:5px 0 15px; font-size:13px; font-weight:800; letter-spacing:.04em; color:#fff !important; }
.footer-contact { display:grid; gap:10px; }
.footer-contact a,.footer-hours { display:flex; align-items:center; gap:9px; color:#d7e4ef; font-size:12px; line-height:1.45; text-decoration:none; min-height:20px; }
.footer-contact a:hover { color:#ff956b; }
.footer-contact svg,.footer-hours svg { width:15px; height:15px; flex:none; color:#ff4002; stroke-width:2.2; }
.footer-client { display:flex; flex-direction:column; align-items:flex-start; }
.footer-client-cta { display:inline-flex; align-items:center; gap:8px; padding:10px 13px; border:1px solid #7ca3c2; border-radius:6px; background:#0d3457; color:#fff; font-size:12px; font-weight:700; text-decoration:none; }
.footer-client-cta:hover { border-color:#ff4002; background:#123f68; }
.footer-client-cta svg { width:15px; height:15px; color:#ff4002; }
.footer-client p { margin:12px 0 15px; font-size:11px; line-height:1.6; }
.footer-top nav { display:grid; gap:7px; font-size:12px; }
.footer-top nav a { text-decoration:none; }
.footer-top nav a:hover { color:#ff956b; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:35px; padding-top:23px; border-top:1px solid #87acce30; font-size:11px; color:#9ab6cf; }
.footer-bottom a { color:#b8cee0; text-decoration:none; }
.footer-bottom a:hover { color:#ff956b; }
.device-showcase { position:relative; margin:0 0 34px; }
.showcase-wall { height:166px; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:7px; overflow:hidden; opacity:.48; mask-image:linear-gradient(#000 45%,transparent); }
.showcase-wall > img { width:100%; height:166px; object-fit:cover; object-position:top; border-radius:3px; }
.device-stage { position:relative; width:min(420px,100%); height:240px; margin:-112px auto 0; isolation:isolate; }
.showcase-notebook { position:absolute; left:16px; top:10px; width:310px; text-decoration:none; z-index:1; transition:transform .4s; }
.showcase-notebook:hover { transform:translateY(-4px); }
.showcase-notebook .laptop-screen { padding:8px 7px 10px; }
.showcase-notebook .laptop-screen img { aspect-ratio:1.65; }
.showcase-phone { position:absolute; right:15px; bottom:0; width:87px; height:174px; padding:5px; border:2px solid #192a3a; border-radius:14px; background:#071928; box-shadow:0 10px 25px #082b5030; overflow:hidden; z-index:2; transition:transform .4s; }
.showcase-phone:hover { transform:translateY(-4px) rotate(2deg); }
.showcase-phone > img { width:100%; height:100%; object-fit:cover; object-position:top; border-radius:8px; }
.phone-camera { position:absolute; top:5px; left:calc(50% - 14px); width:28px; height:6px; background:#071928; border-radius:0 0 5px 5px; z-index:1; }
.phone-home { position:absolute; bottom:7px; left:calc(50% - 15px); width:30px; height:2px; border-radius:2px; background:#ddd; }
.showcase-controls { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:12px; }
.showcase-picker { display:grid; grid-template-columns:repeat(3,minmax(150px,1fr)); width:min(620px,100%); gap:8px; }
.showcase-choice { display:grid; grid-template-columns:27px 34px minmax(0,1fr); align-items:center; gap:7px; min-height:53px; padding:7px 10px; border:1px solid #b8cfe0; border-radius:7px; color:var(--ink); background:linear-gradient(145deg,#ffffff,#edf4f9); box-shadow:0 5px 12px #082b5010; transition:border-color .2s,background .2s,transform .2s,box-shadow .2s; font-size:10px; font-weight:700; line-height:1.35; text-align:left; }
.showcase-choice::before { content:counter(showcase); counter-increment:showcase; display:grid; place-items:center; width:27px; height:27px; border-radius:50%; color:#fff; background:linear-gradient(135deg,var(--brand),#c62d06); font-size:10px; }
.showcase-picker { counter-reset:showcase; }
.showcase-choice > img { width:34px; height:28px; object-fit:cover; border-radius:3px; grid-column:2; grid-row:1; opacity:.88; }
.showcase-choice > span { grid-column:3; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.showcase-choice.is-selected { color:#fff; border-color:var(--brand); background:linear-gradient(135deg,#ff4002,#c92f08 48%,#9f280d); box-shadow:0 8px 20px #ff400235; transform:translateY(-2px); }
.showcase-choice:hover { transform:translateY(-2px); border-color:var(--brand); box-shadow:0 8px 18px #082b5020; }
.pricing-commerce .showcase-wall { opacity:.29; }
.pricing-commerce .showcase-choice { background:#143650; color:#cfdfef; border-color:#6086a74d; }
.pricing-commerce .showcase-choice.is-selected { background:#482b24; color:#ffc19e; border-color:#ff8148; }
.pricing-commerce .showcase-controls > .icon-button { color:#dceaff; border-color:#83aed078; }
.product-highlights-band { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:0 0 32px; }
.product-highlight-card { display:flex; align-items:flex-start; gap:14px; padding:18px 20px; border:1px solid #c9daea; border-radius:8px; background:linear-gradient(145deg,#ffffff,#f1f6fb); box-shadow:0 8px 24px #082b500d; }
.product-highlight-icon { display:grid; place-items:center; width:42px; height:42px; flex-shrink:0; border-radius:8px; background:linear-gradient(135deg,#ff40021c,#082b5012); color:var(--brand); border:1px solid #ff400233; }
.product-highlight-icon svg { width:21px; height:21px; }
.product-highlight-card strong { display:block; font-size:14px; font-weight:700; color:var(--ink); line-height:1.35; }
.product-highlight-card p { margin-top:5px; font-size:12px; line-height:1.6; color:var(--muted); }
.product-highlights-dark .product-highlight-card { background:linear-gradient(145deg,#102e4a,#081d33); border-color:#6895bb3d; box-shadow:0 12px 30px #0000002e; }
.product-highlights-dark .product-highlight-icon { background:linear-gradient(135deg,#ff40022e,#38bdf81f); color:#ff4002; border-color:#ff400245; }
.product-highlights-dark .product-highlight-card strong { color:#fff; }
.product-highlights-dark .product-highlight-card p { color:#b9cfe3; }
@media (max-width:900px) {
  .product-highlights-band { grid-template-columns:1fr; gap:12px; margin-bottom:24px; }
}
.quotation-form { padding:30px; background:#fff; border:1px solid #dbe5ee; box-shadow:0 18px 45px #082b5012; }
.contact-section { overflow:visible; }
.contact-copy { position:sticky; top:112px; align-self:start; }
.quote-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:18px; }
.quote-header h3 { font-size:23px; margin-top:6px; }
.quote-header > svg { width:30px; height:30px; color:var(--brand); }
.quote-progress { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-bottom:24px; }
.quote-progress > span { border-top:3px solid #d9e5ee; padding-top:7px; color:#7b8ea0; font-size:10px; font-weight:600; transition:border-color .3s,color .3s; }
.quote-progress > span.is-complete { color:#a73b13; border-color:var(--brand); }
.quote-section { padding:0 0 23px; border:0; border-bottom:1px solid #e2e9f0; margin:0 0 23px; min-width:0; }
.quote-section:last-of-type { border-bottom:0; padding-bottom:0; margin-bottom:0; }
.quote-section legend { display:flex; align-items:center; gap:10px; padding:0; margin-bottom:15px; font-size:13px; font-weight:700; color:var(--ink); max-width:100%; }
.quote-number { display:inline-flex; align-items:center; justify-content:center; width:25px; height:25px; border-radius:50%; color:#000000; background:var(--brand-button); font-size:11px; font-weight:700; flex-shrink:0; }
.quote-types { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.quote-type { display:grid; grid-template-columns:16px 20px minmax(0,1fr); gap:7px; align-items:start; min-height:86px; padding:12px 10px; border:1px solid #cbd9e5; border-radius:5px; background:#f7faff; cursor:pointer; transition:border-color .2s,background .2s,box-shadow .2s,transform .2s; }
.quote-type:hover { transform:translateY(-1px); border-color:var(--brand); background:#fff; }
.quote-type.is-selected { border-color:var(--brand); background:#fff5ef; box-shadow:0 0 0 1px #ff400235; }
.quote-type input { width:15px; height:15px; accent-color:var(--brand-button); margin:3px 0 0; }
.quote-type > svg { width:19px; height:19px; color:#547b9d; margin-top:2px; }
.quote-type.is-selected > svg { color:#c53d10; }
.quote-type strong { display:block; font-size:11px; font-weight:700; line-height:1.5; }
.quote-type small { display:block; margin-top:4px; color:var(--muted); font-size:10px; line-height:1.5; }
.quote-features { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.quote-feature { display:flex; align-items:center; gap:9px; padding:10px; min-height:42px; border:1px solid #cbd9e5; background:#f7faff; border-radius:5px; cursor:pointer; font-size:11px; transition:background .2s,border-color .2s; }
.quote-feature input { width:15px; height:15px; accent-color:var(--brand-button); margin:0; flex-shrink:0; }
.quote-feature.is-checked { background:#fff5ef; border-color:#ed956f; color:#92300e; }
.quote-feature:hover { border-color:var(--brand); }
.quote-timing { display:flex; flex-wrap:wrap; gap:8px; }
.quote-timing > label { display:flex; align-items:center; gap:7px; padding:8px 10px; border:1px solid #ccdae7; border-radius:999px; font-size:10px; background:#f7faff; cursor:pointer; transition:background .2s,border-color .2s; }
.quote-timing input { accent-color:var(--brand-button); margin:0; width:13px; height:13px; }
.quote-timing > label.is-selected { border-color:var(--brand); background:#fff2e9; color:#a13911; }
.budget-field { margin-top:18px; }
.quotation-form .field { font-size:11px; }
.quotation-form .field input,.quotation-form .field select,.quotation-form .field textarea { background:#f8faff; }
.quotation-form .field:focus-within { color:var(--brand-button); }
.quotation-form .field input:focus,.quotation-form .field select:focus,.quotation-form .field textarea:focus { background:#fff; }
.quotation-form > .button { font-size:12px; min-height:51px; }
.form-wa-alt { font-size:11px; text-align:center; color:var(--muted); margin-top:14px; }
.form-wa-alt a { color:#17724f; font-weight:600; text-decoration:underline; }
.quotation-form .form-status:not(:empty) { padding:12px 14px; border-radius:4px; border:1px solid #ccdae7; }
.quotation-form .form-status.ok { background:#eff9f3; border-color:#afddc3; }
.quotation-form .form-status.error { background:#fff3ed; border-color:#e7b29b; }
.contract-dialog { width:min(780px,calc(100% - 28px)); max-height:calc(100vh - 28px); padding:0; border:1px solid #c6d8e7; border-radius:10px; color:var(--ink); background:#fff; box-shadow:0 30px 90px #03182e80; overflow:auto; }
.contract-dialog::backdrop { background:#03182eb8; backdrop-filter:blur(5px); }
.contract-dialog[open] { animation:dialog-in .3s cubic-bezier(.2,.75,.3,1); }
.contract-shell { padding:28px; }
.contract-header { display:flex; align-items:start; justify-content:space-between; gap:20px; }
.contract-header h2 { font-size:27px; margin-top:5px; }
.contract-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin:22px 0; }
.contract-steps > span { border-top:3px solid #d6e2eb; padding-top:8px; color:#71879a; font-size:10px; font-weight:600; }
.contract-steps > span.is-current { border-color:var(--brand); color:#a83511; }
.contract-steps > span.is-complete { border-color:#168b78; color:#126456; }
.contract-summary { display:grid; grid-template-columns:1.25fr 1fr; gap:14px; margin-bottom:23px; padding:16px 18px; border:1px solid #f4bda3; border-left:4px solid var(--brand); border-radius:7px; background:linear-gradient(135deg,#fff5ee,#f8fbff); box-shadow:0 8px 24px #ff400214; }
.contract-summary > div { display:flex; flex-direction:column; gap:3px; }
.contract-summary span { color:var(--muted); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.contract-summary strong { font-size:16px; color:var(--ink); }
.contract-summary-price strong { font-size:24px; font-weight:800; color:#b83209; line-height:1.2; }
.contract-summary small { font-size:10px; color:var(--muted); line-height:1.45; margin-top:2px; }
.contract-pane { animation:pane-in .3s ease-out; }
.contract-options,.payment-options,.transfer-options { margin:20px 0 0; padding:0; border:0; min-width:0; }
.contract-options legend,.payment-options legend,.transfer-options legend { margin-bottom:12px; font-size:12px; font-weight:700; }
.payment-options { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.payment-options > legend { grid-column:1 / -1; }
.payment-card { display:grid; grid-template-columns:16px 26px minmax(0,1fr); align-items:start; gap:9px; padding:16px 13px; min-height:116px; border:1px solid #c7d8e5; border-radius:6px; background:#f7faff; cursor:pointer; transition:border-color .2s,background .2s; }
.payment-card.is-selected { border-color:var(--brand); background:#fff4ed; box-shadow:0 0 0 1px #ff40022f; }
.payment-card input { margin:4px 0 0; accent-color:var(--brand-button); }
.payment-card > svg { width:24px; height:24px; color:#5c86a8; }
.payment-card strong,.payment-card small { display:block; }
.payment-card strong { font-size:13px; }
.payment-card small { margin-top:5px; color:var(--muted); font-size:10px; line-height:1.55; }
.transfer-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.transfer-grid label { display:flex; gap:8px; align-items:start; padding:12px; border:1px solid #c9d9e5; border-radius:5px; background:#f7faff; cursor:pointer; }
.transfer-grid label.is-selected { border-color:var(--brand); background:#fff3ec; }
.transfer-grid input { margin:4px 0 0; accent-color:var(--brand-button); }
.transfer-grid strong,.transfer-grid small { display:block; }
.transfer-grid strong { font-size:12px; }
.transfer-grid small { color:var(--muted); font-size:9px; }
.bank-preview { display:grid; grid-template-columns:1fr 1fr; gap:5px 20px; padding:14px 16px; margin-top:12px; border-left:3px solid var(--brand); background:#f8fafc; font-size:11px; }
.bank-preview strong { grid-column:1 / -1; }
.material-reminder { display:flex; gap:14px; padding:16px; border:1px solid #c9dcea; background:#f4f9fc; border-radius:6px; }
.material-reminder > svg { width:28px; height:28px; flex-shrink:0; color:#2475a9; }
.material-reminder strong { font-size:13px; }
.material-reminder p { margin-top:5px; color:var(--muted); font-size:11px; line-height:1.65; }
.contract-notice { padding:15px 16px; margin-top:13px; border:1px solid #f0ba9e; border-left:3px solid var(--brand); background:#fff4ed; }
.contract-notice strong { font-size:12px; }
.contract-notice p { margin-top:5px; color:#6f4a3b; font-size:10px; line-height:1.65; }
.contract-check { display:flex; align-items:start; gap:10px; margin-top:15px; cursor:pointer; font-size:11px; line-height:1.6; }
.contract-check input { width:17px; height:17px; margin-top:1px; flex-shrink:0; accent-color:var(--brand-button); }
.contract-check a { color:#a93510; font-weight:700; }
.consumer-notice { padding:12px 14px; margin-top:15px; border:1px solid #bdd6e9; background:#eff7fd; color:#38566f; font-size:10px; line-height:1.65; }
.contract-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:23px; padding-top:18px; border-top:1px solid #e0e8ee; }
.contract-result { text-align:center; padding:10px 0 5px; }
.result-icon { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 16px; border-radius:50%; color:#fff; background:#168b78; }
.result-icon svg { width:31px; height:31px; }
.contract-result h3 { font-size:24px; }
.contract-result > p { max-width:570px; margin:10px auto 0; color:var(--muted); font-size:12px; }
.contract-result-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:20px; }
#contract-transfer-result { max-width:570px; margin:18px auto 0; padding:16px; border:1px solid #d1dfeb; border-radius:5px; background:#f7faff; text-align:left; font-size:11px; }
#contract-transfer-result table { width:100%; border-collapse:collapse; margin-top:10px; }
#contract-transfer-result td { padding:6px 0; border-top:1px solid #dce6ee; }
#contract-transfer-result td:last-child { text-align:right; font-weight:700; }
#receipt-form { max-width:570px; margin:18px auto 0; padding:16px; border:1px dashed #a8c4d8; text-align:left; }
#receipt-form .button { width:100%; margin-top:12px; }
.materials-next { padding-top:18px; }
body.has-dialog { overflow:hidden; }
@keyframes dialog-in { from { opacity:0; transform:translateY(15px) scale(.98); } }
@keyframes pane-in { from { opacity:.35; transform:translateX(9px); } }
.floating-wa { position:fixed; z-index:45; bottom:24px; right:24px; display:flex; align-items:center; gap:12px; padding:7px 7px 7px 18px; border-radius:999px; background:#082b50f2; border:1px solid #8fd6b169; box-shadow:0 9px 25px #082b5035; text-decoration:none; color:#fff; transition:transform .25s,opacity .25s,box-shadow .25s; animation:widget-float 5s ease-in-out infinite; }
.floating-wa:hover { box-shadow:0 14px 32px #082b5045; }
.floating-wa-copy { display:flex; flex-direction:column; gap:1px; }
.floating-wa-copy > span { color:#82e9b1; font-size:9px; font-weight:600; }
.floating-wa-copy > strong { color:#fff; font-size:12px; font-weight:600; }
.floating-wa-icon { display:grid; place-items:center; width:43px; height:43px; border-radius:50%; background:linear-gradient(135deg,#29cc6a,#128c55); }
.floating-wa-icon svg { width:23px; height:23px; }
.floating-wa.is-form-visible { opacity:0; pointer-events:none; transform:translateY(15px); }
@keyframes widget-float { 0%,100% { translate:0 0; } 50% { translate:0 -4px; } }
@media (max-width:1100px) {
  .main-nav { gap:5px; }
  .main-nav > a { padding-inline:7px; font-size:12px; }
  .main-nav > .nav-reviews { padding-inline:10px; }
  .quote-type { grid-template-columns:15px minmax(0,1fr); }
  .quote-type > svg { display:none; }
}
@media (max-width:760px) {
  .specialty-link__cards { grid-template-columns:1fr; }
  .specialty-choice { grid-template-columns:120px minmax(0,1fr); min-height:160px; }
  .specialty-choice__visual img { width:108px; height:145px; }
  .specialty-choice--ai .specialty-choice__visual img { width:122px; }
  .specialty-link__heading h3 { font-size:23px; }
}
@media (max-width:900px) {
  .main-nav { gap:0; }
  .topbar-badge,.header-contact { display:none; }
  .contact-topbar-inner,.contact-topbar-links { justify-content:center; }
  .contact-copy { position:static; }
  .main-nav > .nav-reviews { justify-content:center; margin:8px 0; padding:11px; }
  .main-nav > .nav-contact { margin-top:9px; }
  .quote-type { grid-template-columns:16px 20px minmax(0,1fr); }
  .quote-type > svg { display:block; }
  .showcase-wall { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .showcase-wall > img:nth-child(n+5) { display:none; }
}
@media (max-width:650px) {
  .hero-actions .button { font-size:11px; padding-inline:13px; }
  .device-stage { width:330px; max-width:100%; height:205px; margin-top:-100px; }
  .showcase-wall { height:128px; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; }
  .showcase-wall > img { height:128px; }
  .showcase-wall > img:nth-child(n+4) { display:none; }
  .showcase-notebook { left:10px; top:8px; width:250px; max-width:78%; }
  .showcase-phone { right:3px; bottom:0; width:65px; height:132px; border-radius:12px; padding:4px; }
  .showcase-phone > img { border-radius:6px; }
  .showcase-controls { gap:7px; margin-top:14px; }
  .showcase-picker { gap:5px; flex:1; min-width:0; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .showcase-choice { grid-template-columns:21px 24px minmax(0,1fr); gap:4px; min-height:51px; padding:6px 4px; font-size:8px; }
  .showcase-choice::before { width:21px; height:21px; font-size:8px; }
  .showcase-choice > img { width:24px; height:21px; }
  .showcase-controls > .icon-button { width:30px; height:36px; }
  .showcase-controls > .icon-button svg { width:14px; height:14px; }
  .quotation-form { padding:22px; }
  .contact-copy { position:static; }
  .quote-header h3 { font-size:21px; }
  .quote-section legend { font-size:12px; gap:8px; }
  .quote-type { grid-template-columns:15px minmax(0,1fr); padding:10px 9px; min-height:92px; }
  .quote-type > svg { display:none; }
  .quote-type strong { font-size:10px; }
  .quote-type small { font-size:9px; }
  .quote-feature { font-size:10px; padding:9px 8px; gap:7px; }
  .quotation-form > .button { font-size:11px; padding-inline:12px; }
  .floating-wa { bottom:max(17px,env(safe-area-inset-bottom)); right:16px; padding:6px; }
  .floating-wa-copy { display:none; }
  .floating-wa-icon { width:43px; height:43px; }
  .site-footer { padding-bottom:85px; }
  .contract-dialog { width:calc(100% - 16px); max-height:calc(100vh - 16px); }
  .contract-shell { padding:21px 17px; }
  .contract-header h2 { font-size:21px; }
  .contract-summary { grid-template-columns:1fr; }
  .payment-options { grid-template-columns:1fr; }
  .payment-card { min-height:0; }
  .transfer-grid { grid-template-columns:1fr; }
  .bank-preview { grid-template-columns:1fr; }
  .contract-actions { position:sticky; bottom:-21px; margin-inline:-17px; padding:14px 17px max(14px,env(safe-area-inset-bottom)); background:#fff; z-index:3; }
  .contract-actions .button { flex:1; padding-inline:9px; font-size:10px; }
}
@media (max-width:370px) {
  .hero-actions .button { font-size:10px; gap:6px; padding-inline:11px; }
  .quotation-form { padding:18px; }
  .quote-features { grid-template-columns:1fr; }
  .quote-types { grid-template-columns:1fr; }
  .quote-type { min-height:0; grid-template-columns:15px 20px minmax(0,1fr); }
  .quote-type > svg { display:block; }
  .quote-header h3 { font-size:19px; }
}
@keyframes border-flow { to { background-position:300% 0; } }
@keyframes flame-breathe { 0%,100% { transform:scale(1); } 50% { transform:scale(1.06); } }
@keyframes flame-drift { 0%,100% { transform:translateY(0) rotate(12deg); } 50% { transform:translateY(-18px) rotate(9deg); } }
@keyframes button-sweep { to { transform:translateX(110%); } }

/* CTA naranja: borde de luz CSS inspirado en BorderBeam / BgAnimateButton. */
.button-brand,
.main-nav > .nav-contact {
  --btn-color: #f7760d;
  --btn-color-light: #ffb067;
  --btn-color-dark: #b34e07;
  isolation: isolate;
  border: 2px solid transparent;
  background: linear-gradient(180deg,#ff8a2b 0%,var(--btn-color) 55%,var(--btn-color-dark) 100%) padding-box;
  box-shadow: 0 10px 30px -8px rgba(247,118,13,.55), inset 0 1px 1.5px rgba(255,255,255,.55), inset 0 -2px 4px rgba(120,45,0,.35);
  text-shadow: 0 1px 1px rgba(120,45,0,.35);
}
.button-brand::after,
.main-nav > .nav-contact::after {
  content: '';
  position: absolute;
  inset: 2px;
  z-index: 0;
  border-radius: inherit;
  background: linear-gradient(105deg,transparent 35%,rgba(255,255,255,.42) 50%,transparent 65%);
  transform: translateX(-120%);
  transition: transform .9s cubic-bezier(.22,1,.36,1);
  pointer-events: none;
}
.button-brand:hover,
.main-nav > .nav-contact:hover {
  background: linear-gradient(180deg,#ff983e 0%,var(--btn-color) 55%,var(--btn-color-dark) 100%) padding-box;
  border-color: transparent;
  box-shadow: 0 16px 40px -8px rgba(247,118,13,.75), inset 0 1px 1.5px rgba(255,255,255,.62), inset 0 -2px 4px rgba(120,45,0,.35);
}
.button-brand:hover::after,
.main-nav > .nav-contact:hover::after { transform: translateX(120%); }
.button-brand > svg,
.main-nav > .nav-contact > svg { position: relative; z-index: 1; }
.button-brand:focus-visible,
.main-nav > .nav-contact:focus-visible { outline: 3px solid #ffd2b8; outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  .button-brand::before,
  .main-nav > .nav-contact::before,
  .button-brand::after,
  .main-nav > .nav-contact::after { animation: none; transition: none; }
}
@media (max-width:1100px) {
  .main-nav { gap:17px; }
  .hero h1 { font-size:45px; }
  .hero-grid { gap:22px; }
  .hero-description { font-size:14px; }
  .plan { padding:25px 21px; }
  .plan h3 { font-size:23px; }
  .plan-price strong { font-size:27px; }
  .plan-description { min-height:108px; }
  .plans-grid-four { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
  .plans-grid-four .plan-description { min-height:88px; }
  .section-head,.development-grid,.contact-grid { gap:40px; }
  .pipeline-grid { gap:24px; }
  .pipeline-step { gap:9px; padding:14px 12px; }
}
@media (max-width:900px) {
  .wrap { width:calc(100% - 40px); }
  .nav { min-height:70px; }
  .menu-toggle { display:inline-flex; }
  .main-nav { display:none; position:absolute; top:70px; left:-20px; right:-20px; flex-direction:column; align-items:stretch; gap:0; background:#fff; border-bottom:2px solid var(--brand); padding:12px 20px 20px; }
  .main-nav.is-open { display:flex; }
  .main-nav > a:not(.button) { padding:11px 0; font-size:14px; }
  .nav-contact { margin-top:7px; }
  .hero { padding:32px 0; }
  .hero h1 { font-size:40px; }
  .hero-grid { gap:16px; }
  .hero-portfolio-head h2 { font-size:19px; }
  .hero-portfolio-stage { height:260px; }
  .hero-slide { width:87%; }
  .hero-description { font-size:13px; }
  .hero-proof { font-size:10px; gap:8px 13px; }
  .hero-actions .button { font-size:10px; padding-inline:12px; }
  .section-head { grid-template-columns:1fr; gap:22px; }
  .section-head > p { max-width:650px; }
  .centered { gap:0; }
  h2 { font-size:32px; }
  .plans-grid { gap:13px; }
  .plan { padding:25px 16px; }
  .plan h3 { font-size:21px; }
  .plan-price strong { font-size:23px; }
  .plan-description { font-size:12px; min-height:130px; }
  .plan li { font-size:12px; }
  .plan .button { font-size:10px; gap:5px; }
  .work-ribbon { height:165px; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .work-ribbon > .ribbon-brand { display:none; }
  .number-item > strong { font-size:52px; }
  .number-item h3 { font-size:16px; }
  .numbers-grid { gap:24px; }
  .pipeline-grid { grid-template-columns:1fr; }
  .pipeline-panel { min-height:0; }
  .pipeline-panel h3,.pipeline-panel > p { min-height:0; }
  .pipeline-illustration { height:55px; margin:12px 0 22px; }
  .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .review-rating { justify-self:start; }
  .reviews-grid { gap:17px; }
  .review { flex-basis:calc((100% - 17px) / 2); }
  .review { padding:20px; }
  .faq-grid,.contact-grid { grid-template-columns:1fr; gap:35px; }
  .contact-copy > p:not(.eyebrow) { max-width:620px; }
}
@media (max-width:650px) {
  html { scroll-padding-top:105px; }
  .wrap { width:calc(100% - 36px); }
  .site-brand img { width:139px; height:44px; }
  .nav { min-height:66px; }
  .contact-topbar-inner { min-height:33px; font-size:10.5px; }
  .contact-topbar-links { gap:10px; }
  .contact-topbar-links a:nth-child(2) { display:none; }
  .contact-topbar-links svg { width:12px; height:12px; }
  .language-switch { align-self:center; }
  .main-nav { top:66px; left:-18px; right:-18px; }
  .hero { padding:27px 0 22px; }
  .hero-grid { grid-template-columns:1fr; gap:19px; }
  .hero h1 { font-size:34px; margin-top:10px; }
  html[lang="en-US"] .hero h1 { font-size:32px; }
  html[lang="en-US"] .hero h1 em { width:240px; max-width:100%; }
  html[lang="en-US"] .hero-description { width:100%; max-width:320px; box-sizing:border-box; }
  .hero-description { font-size:13px; line-height:1.65; margin-top:13px; }
  .hero-actions { margin-top:17px; gap:10px; }
  .hero-actions .button { font-size:10px; min-height:41px; padding-inline:12px; }
  .hero-proof { display:none; }
  .hero .eyebrow { font-size:10px; }
  .hero-portfolio-head { display:none; }
  .hero-portfolio-stage { height:228px; max-width:430px; margin:auto; }
  .hero-slide { width:78%; }
  .hero-slide.is-active { transform:translate(-50%,-50%); }
  .laptop-screen { padding:7px 6px 8px; }
  .hero-slide-name { padding-top:13px; font-size:10px; }
  .hero-portfolio-controls { gap:10px; }
  .hero-portfolio-controls .icon-button { width:32px; height:32px; }
  .hero-portfolio-controls svg { width:16px; height:16px; }
  .hero-counter { font-size:10px; min-width:58px; }
  .section { padding:58px 0; }
  #presentacion { padding-top:16px; }
  h2 { font-size:28px; }
  .section-head { margin-bottom:30px; gap:18px; }
  .section-head > p { font-size:13px; }
  .video-showcase { aspect-ratio:16/11; }
  .video-soon h3 { font-size:22px; }
  .video-soon > img { width:22px; height:34px; margin-bottom:8px; }
  .video-soon > span,.video-soon p { font-size:10px; }
  .video-corner { display:none; }
  .numbers-grid { grid-template-columns:1fr; gap:23px; margin-top:30px; }
  .number-item { display:grid; grid-template-columns:110px 1fr; column-gap:20px; padding-top:23px; }
  .number-item > strong { grid-row:1 / 3; font-size:38px; }
  .number-item > strong em { font-size:18px; }
  .number-item h3 { font-size:16px; margin-top:0; }
  .number-item p { font-size:11px; margin-top:4px; }
  .flame-numbers { width:200px; height:300px; right:-10px; top:200px; }
  .plans-grid { grid-template-columns:1fr; gap:20px; }
  .plans-grid-four { grid-template-columns:1fr; }
  .plan { padding:28px; }
  .plan h3 { font-size:26px; }
  .plan-description { min-height:0; font-size:13px; }
  .plan-price strong { font-size:32px; }
  .plan .button { font-size:11px; }
  .plan li { font-size:13px; }
  .work-ribbon { grid-template-columns:1fr 1fr; height:155px; gap:5px; margin-bottom:23px; }
  .work-ribbon > div:nth-child(3) { display:none; }
  .work-ribbon > div > span { font-size:9px; left:11px; bottom:11px; }
  .specialty-link { flex-direction:column; align-items:start; gap:19px; margin-top:30px; }
  .specialty-link h3 { font-size:20px; }
  .development-grid { grid-template-columns:1fr; gap:23px; }
  .development-grid > div:last-child > p { font-size:13px; }
  .portfolio-grid { grid-template-columns:1fr; gap:28px; }
  .portfolio-device { min-height:210px; }
  .google-score-card { min-width:0; width:100%; }
  .reviews-grid { gap:18px; }
  .review { flex-basis:100%; }
  .review { padding:25px; }
  .review blockquote { font-size:14px; }
  .pipeline-step { padding:13px 11px; gap:10px; }
  .step-copy strong { font-size:11px; }
  .step-copy > span { font-size:9px; }
  .step-icon svg { width:21px; height:21px; }
  .step-number { width:25px; height:25px; font-size:10px; }
  .step-arrow { display:none; }
  .pipeline-panel { padding:25px; }
  .pipeline-panel h3 { font-size:21px; }
  .pipeline-panel > p { font-size:12px; }
  .pipeline-meta { font-size:9px; }
  .contact-copy h2 { font-size:34px; }
  .contact-form { padding:22px; }
  .form-grid { grid-template-columns:1fr; gap:16px; }
  .field-full { grid-column:auto; }
  .field input,.field select,.field textarea { font-size:14px; }
  .footer-top { grid-template-columns:1fr; gap:25px; }
  .footer-bottom { flex-direction:column; gap:6px; }
}
@media (max-width:370px) {
  .hero { padding:22px 0 18px; }
  .hero-grid { gap:16px; }
  .hero h1 { font-size:30px; }
  .hero-description { font-size:12px; }
  .hero-portfolio-stage { height:184px; }
  .hero-actions .button { font-size:9px; gap:5px; padding-inline:10px; }
  .hero-actions svg { width:16px; height:16px; }
  .plan { padding:24px; }
  .plan-price strong { font-size:29px; }
  .number-item { grid-template-columns:95px 1fr; gap:14px; }
  .number-item > strong { font-size:34px; }
  .number-item h3 { font-size:14px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none !important; transition:none !important; }
}

/* Sistema futurista comun para todas las acciones. Cada variante conserva su color de superficie. */
.button,
.icon-button {
  --btn-color: #ff4002;
  --btn-color-light: #ff4002;
  --btn-color-dark: #b82f00;
  --btn-core: linear-gradient(180deg,#d93408 0%,#cf2c00 56%,#a82b00 100%);
  --btn-text: #ffffff;
  position: relative;
  isolation: isolate;
  border: 2px solid transparent;
  color: var(--btn-text);
  background: var(--btn-core) padding-box;
  box-shadow: 0 10px 28px -8px color-mix(in srgb,var(--btn-color) 55%,transparent), inset 0 1px 1.5px rgba(255,255,255,.55), inset 0 -2px 4px rgba(0,0,0,.22);
  transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s cubic-bezier(.22,1,.36,1), color .25s ease, background .25s ease;
}
.button::after,
.icon-button::after {
  content: '';
  position: absolute;
  inset: 2px;
  z-index: 0;
  border-radius: inherit;
  background: linear-gradient(105deg,transparent 35%,rgba(255,255,255,.42) 50%,transparent 65%);
  transform: translateX(-120%);
  transition: transform .9s cubic-bezier(.22,1,.36,1);
  pointer-events: none;
}
.button > svg,
.icon-button > svg,
.button > span,
.icon-button > span { position: relative; z-index: 1; }
.button:hover,
.icon-button:hover { transform: translateY(-2px); box-shadow: 0 16px 38px -8px color-mix(in srgb,var(--btn-color) 72%,transparent), inset 0 1px 1.5px rgba(255,255,255,.64), inset 0 -2px 4px rgba(0,0,0,.24); }
.button:hover::after,
.icon-button:hover::after { transform: translateX(120%); }
.button:active,
.icon-button:active { transform: translateY(0) scale(.98); }
.button:focus-visible,
.icon-button:focus-visible { outline: 3px solid color-mix(in srgb,var(--btn-color) 42%,white); outline-offset: 4px; }
.button-dark {
  --btn-color: #2d81b8;
  --btn-color-light: #8fd6f3;
  --btn-color-dark: #082b50;
  --btn-core: linear-gradient(180deg,#164d78 0%,#082b50 56%,#04182b 100%);
  --btn-text: #ffffff;
}
.button-light {
  --btn-color: #ff4002;
  --btn-color-light: #ff4002;
  --btn-color-dark: #b82f00;
  --btn-core: linear-gradient(180deg,#ffffff 0%,#f6f9fc 100%);
  --btn-text: #082b50;
}
.button-outline {
  --btn-core: linear-gradient(180deg,#ffffff 0%,#f6f9fc 100%);
  --btn-text: #082b50;
}
.button-outline:hover { color: #ffffff; background: linear-gradient(180deg,#d93408 0%,#cf2c00 56%,#a82b00 100%) padding-box; }
.icon-button {
  --btn-color: #2d81b8;
  --btn-color-light: #8fd6f3;
  --btn-color-dark: #082b50;
  --btn-core: linear-gradient(180deg,#ffffff 0%,#f4f8fb 100%);
  --btn-text: #082b50;
  overflow: hidden;
}
.main-nav > .nav-contact { --btn-core: linear-gradient(180deg,#d93408 0%,#cf2c00 56%,#a82b00 100%); background:var(--btn-core) padding-box; }
.plan .button,
.contact-form > .button,
.development-grid .button,
.specialty-link .button { overflow: hidden; }
.plan .button-outline { --btn-color: #ff4002; --btn-color-light: #ff4002; --btn-color-dark: #b82f00; --btn-core: linear-gradient(180deg,#103f6b 0%,#082b50 100%); --btn-text: #ffffff; color: #ffffff; border-color: transparent; background: var(--btn-core) padding-box; }
.plan .button-outline:hover { color: #ffffff; background: linear-gradient(180deg,#d93408 0%,#cf2c00 56%,#a82b00 100%) padding-box; }
.plan .button-brand { --btn-core: linear-gradient(180deg,#d93408 0%,#cf2c00 56%,#a82b00 100%); }
.plan-featured .button { background: var(--btn-core) padding-box; }
@media (prefers-reduced-motion: reduce) {
  .button::before,
  .icon-button::before,
  .button::after,
  .icon-button::after { animation: none; transition: none; }
}

/* Fondos de movimiento del home: siempre llevan overlay, copy y controles por encima. */
.hero:has(.home-section-video),
.section:has(.home-section-video) { isolation: isolate; overflow: hidden; }
.hero:has(.home-section-video) .home-section-video,
.section:has(.home-section-video) .home-section-video { position: absolute; inset: 0; z-index: -2; display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; animation: home-video-drift 14s ease-in-out infinite alternate; }
.hero:has(.home-section-video)::after,
.section:has(.home-section-video)::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: rgba(255,255,255,.78); }
.pattern-dark:has(.home-section-video) { background-color: transparent; }
.pattern-dark:has(.home-section-video)::after { background: rgba(3,24,46,.78); }
.hero:has(.home-section-video)::after { background: linear-gradient(90deg,rgba(251,252,255,.96) 0%,rgba(251,252,255,.86) 46%,rgba(251,252,255,.48) 100%); }
.home-section-video--hero { object-position: 72% center !important; opacity: .3; filter: blur(2px) saturate(.82); }
.section:has(.home-section-video) .home-section-video { opacity: .22; }
.home-section-video + .wrap,
.home-section-video + .hero-grid { position: relative; z-index: 1; }
.home-section-video ~ .brand-flame,
.home-section-video ~ .wrap { z-index: 1; }

/* Regla de marca: fondos intensos, nunca pasteles; texto claro solo sobre contraste profundo. */
:root { --brand:#ff4002; --ink:#082b50; }
.agency-numbers, .development-band, .specialty-link { color:#fff; }
.agency-numbers h2, .agency-numbers h3, .development-band h2, .specialty-link h3 { color:#fff; }
.agency-numbers .section-head > p, .development-grid > div:last-child > p, .specialty-link p { color:#d7e6f4; }
.agency-numbers:has(.home-section-video)::after { background:linear-gradient(90deg,#082b50f7,#082b50db); }

/* Country links in the top bar on desktop and the menu on small screens. */
.language-switch { gap:3px; padding:0; border:0; border-radius:0; background:transparent; }
.language-switch a { display:inline-flex; gap:5px; width:auto; height:30px; padding:0 7px; border-radius:4px; font-size:11px; font-weight:700; line-height:1; }
.language-switch img { display:block; width:22px; height:15px; object-fit:cover; border:1px solid #ffffff55; }
.contact-topbar .language-switch a { color:#fff; text-shadow:none; }
.contact-topbar .language-switch a:hover { background:#ffffff20; }
.main-nav .language-switch { display:none; }
.agency-numbers { position:relative; isolation:isolate; overflow:hidden; background-color:#082b50; background-image:linear-gradient(#ffffff12 1px,transparent 1px),linear-gradient(90deg,#ffffff12 1px,transparent 1px),radial-gradient(circle at 80% 22%,#1c6690 1px,transparent 2px); background-size:56px 56px,56px 56px,28px 28px; }
.agency-numbers:has(.home-section-video)::after { background:linear-gradient(90deg,#082b50e8,#082b50c9),linear-gradient(#ffffff14 1px,transparent 1px),linear-gradient(90deg,#ffffff14 1px,transparent 1px); background-size:auto,56px 56px,56px 56px; }
@media (max-width:1100px) {
  .nav { min-height:70px; }
  .menu-toggle { display:inline-flex; }
  .main-nav { display:none; position:absolute; top:70px; left:-20px; right:-20px; flex-direction:column; align-items:stretch; gap:0; background:#fff; border-bottom:2px solid var(--brand); padding:12px 20px 20px; }
  .main-nav.is-open { display:flex; }
  .main-nav > a:not(.button) { padding:11px 0; font-size:14px; }
  .contact-topbar .language-switch { display:none; }
  .main-nav .language-switch { display:inline-flex; align-self:flex-start; margin:8px 0; }
  .main-nav .language-switch a { color:#082b50; border:1px solid #cbd9e6; height:36px; padding:0 10px; }
  .main-nav .language-switch a:hover { background:#e9f1f7; }
}
@media (max-width:650px) {
  .nav { min-height:66px; }
  .main-nav { top:66px; left:-18px; right:-18px; }
}

/* La metodologia usa un fondo claro; el panel conserva su superficie oscura. */
.methodology-section { color: #102f4b; }
.methodology-section:has(.home-section-video)::after { background: rgba(248, 251, 253, .94); }
.methodology-section h2 { color: #092b4c; }
.methodology-section .section-head > p { color: #334f66; }
.methodology-section .pipeline-step { color: #102f4b; background: #ffffffd9; border-color: #bdcfdd; }
.methodology-section .pipeline-step.is-active { background: #fff2e9; border-color: #c9471f; }
.methodology-section .pipeline-step.is-done { background: #e6f5f1; border-color: #339987; }
.methodology-section .step-icon, .methodology-section .step-arrow { color: #285e7b; }
.methodology-section .is-active .step-icon { color: #b63811; }
.methodology-section .step-number { border-color: #7593a8; }
.methodology-section .is-active .step-number, .methodology-section .is-done .step-number { color: #fff; }
.methodology-section .step-copy > span { color: #38546a; font-size: 12px; }
.video-soon > img { width: 58px; height: 58px; object-fit: contain; filter: drop-shadow(0 0 16px #ff400255); }
.flame-numbers, .flame-method { width: 220px; height: 180px; opacity: .2; object-fit: contain; }
.pipeline-illustration > img { width: 110px; height: 80px; object-fit: contain; filter: drop-shadow(0 0 14px #ff400255); }
@keyframes home-video-drift { from { transform: scale(1.02) translate3d(-.5%,0,0); } to { transform: scale(1.08) translate3d(.5%,-1%,0); } }
@media (prefers-reduced-motion: reduce) {
  .hero:has(.home-section-video) .home-section-video,
  .section:has(.home-section-video) .home-section-video { animation: none; }
}
@media (max-width:650px) {
  .home-landing .hero::before { display:none; }
  .home-landing .hero-portfolio { isolation:isolate; padding:20px 0; }
  .home-landing .hero-portfolio::before { content:''; position:absolute; inset:0 -18px; z-index:-1; background:linear-gradient(#ffffff18 1px,transparent 1px),linear-gradient(90deg,#ffffff18 1px,transparent 1px),#082b50; background-size:48px 48px,48px 48px,auto; }
  .home-landing .hero-portfolio-head { display:block; }
  .home-landing .hero-portfolio-head h2 { font-size:22px; }
}