:root {
  --navy-deep: #071323;
  --navy: #0d1d33;
  --navy-soft: #162b47;
  --blue: #174f96;
  --blue-bright: #2f75cf;
  --blue-pale: #edf5ff;
  --white: #fff;
  --off-white: #f6f9fc;
  --line: #dfe7f0;
  --gray: #65758a;
  --text: #101827;
  --danger: #b93445;
  --container: 1220px;
  --header-height: 84px;
  --radius-sm: 12px;
  --radius: 20px;
  --radius-lg: 30px;
  --shadow: 0 28px 70px rgba(7, 19, 35, .13);
  --ease: cubic-bezier(.22, 1, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 20px); overflow-x: hidden; }
body { margin: 0; min-width: 320px; overflow-x: hidden; color: var(--text); background: var(--white); font: 16px/1.65 Inter, "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
body.menu-open, body.dialog-open { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button, summary, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
p, h1, h2, h3, h4, ul, ol, figure { margin-top: 0; }
h1, h2, h3, h4 { margin-bottom: 0; font-family: "Avenir Next", Inter, "Segoe UI", sans-serif; font-weight: 750; line-height: 1.08; letter-spacing: -.035em; }
h1 em, h2 em { color: var(--blue-bright); font-style: normal; }
::selection { color: var(--white); background: var(--blue); }
:focus-visible { outline: 3px solid #70aaf2; outline-offset: 4px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 9999; top: 10px; left: 10px; padding: 10px 15px; color: #fff; background: var(--blue); border-radius: 8px; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.section { position: relative; padding: clamp(82px, 8vw, 128px) 0; }
.section-dark { color: #fff; background: var(--navy-deep); }
.section-heading { position: relative; z-index: 2; margin-bottom: clamp(38px, 5vw, 64px); }
.heading-split { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .6fr); gap: clamp(36px, 7vw, 100px); align-items: end; }
.heading-centered { width: min(760px, 100%); margin-inline: auto; text-align: center; }
.section-heading h2, .why-copy h2, .faq-intro h2 { max-width: 820px; font-size: clamp(38px, 4.8vw, 64px); }
.section-heading > p, .heading-split > p, .why-copy > p, .faq-intro > p { color: var(--gray); font-size: clamp(16px, 1.4vw, 19px); }
.heading-centered > p { max-width: 600px; margin: 20px auto 0; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 19px; color: var(--blue); font-size: 11px; font-weight: 800; line-height: 1.2; letter-spacing: .16em; text-transform: uppercase; }
.heading-centered .eyebrow { justify-content: center; }
.eyebrow > span { width: 24px; height: 2px; background: currentColor; border-radius: 99px; }
.eyebrow-light { color: #79adf0; }
.button { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; gap: 11px; padding: 13px 22px; color: #fff; background: var(--blue); border: 1px solid var(--blue); border-radius: var(--radius-sm); box-shadow: 0 12px 28px rgba(23,79,150,.2); font-size: 14px; font-weight: 750; line-height: 1.2; cursor: pointer; transition: transform .22s var(--ease), background-color .22s, border-color .22s, box-shadow .22s; }
.button:hover { background: #123f79; border-color: #123f79; box-shadow: 0 17px 34px rgba(23,79,150,.27); transform: translateY(-2px); }
.button-sm { min-height: 43px; padding: 10px 16px; font-size: 13px; }
.button-bright { background: var(--blue-bright); border-color: var(--blue-bright); }
.button-bright:hover { background: #3c82dc; border-color: #3c82dc; }
.button-ghost { background: rgba(255,255,255,.055); border-color: rgba(255,255,255,.22); box-shadow: none; }
.button-ghost:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.36); }
.button-outline { color: var(--blue); background: #fff; border-color: #bed0e6; box-shadow: none; }
.button-outline:hover { color: #fff; }
.section-actions { display: flex; justify-content: center; margin-top: 40px; }

/* Header */
.site-header { position: fixed; z-index: 1000; inset: 0 0 auto; height: var(--header-height); color: #fff; border-bottom: 1px solid transparent; transition: height .24s var(--ease), background-color .24s, border-color .24s, box-shadow .24s; }
.site-header.is-scrolled, .site-header:has(.mobile-menu.is-open) { height: 74px; background: rgba(7,19,35,.92); border-color: rgba(255,255,255,.1); box-shadow: 0 10px 35px rgba(3,10,19,.18); backdrop-filter: blur(16px); }
.header-inner { display: flex; height: 100%; align-items: center; gap: clamp(16px, 2.4vw, 36px); }
.brand { display: inline-flex; flex: 0 0 auto; border-radius: 10px; }
.brand-surface { display: block; width: 150px; height: 50px; overflow: hidden; background: #fff; border-radius: 9px; }
.brand-surface img { width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.14); }
.legal-brand { display: inline-flex; width: 150px; height: 50px; overflow: hidden; background: #fff; border-radius: 9px; }
.legal-brand img { width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.14); }
.desktop-nav { display: flex; flex: 1; justify-content: flex-end; gap: clamp(18px, 2.2vw, 32px); }
.desktop-nav a { position: relative; color: #afbdcd; font-size: 13px; font-weight: 650; transition: color .2s; }
.desktop-nav a::after { position: absolute; right: 0; bottom: -9px; left: 0; height: 2px; background: var(--blue-bright); content: ""; transform: scaleX(0); transition: transform .22s var(--ease); }
.desktop-nav a:hover, .desktop-nav a[aria-current="location"] { color: #fff; }
.desktop-nav a:hover::after, .desktop-nav a[aria-current="location"]::after { transform: scaleX(1); }
.menu-toggle { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; flex-direction: column; gap: 5px; padding: 0; color: #fff; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16); border-radius: 11px; }
.menu-toggle span { width: 19px; height: 2px; background: currentColor; border-radius: 9px; transition: .2s; }
.menu-toggle.is-active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle.is-active span:nth-child(2) { opacity: 0; }
.menu-toggle.is-active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-menu[hidden] { display: none; }
.mobile-menu { position: fixed; z-index: 999; top: 74px; inset-inline: 0; height: calc(100dvh - 74px); padding: 18px 24px 34px; overflow-y: auto; background: rgba(7,19,35,.985); opacity: 0; transform: translateY(-10px); transition: .18s; }
.mobile-menu.is-open { opacity: 1; transform: none; }
.mobile-nav { display: grid; width: min(100%, 600px); margin: auto; }
.mobile-nav > a:not(.button) { display: flex; min-height: 58px; align-items: center; color: #e8eff8; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 18px; font-weight: 650; }
.mobile-nav .button { margin-top: 26px; }

/* Hero */
.hero { position: relative; display: flex; min-height: min(900px, 100svh); align-items: center; padding: 138px 0 92px; isolation: isolate; overflow: hidden; }
.hero::before { position: absolute; z-index: -2; inset: 0; background: radial-gradient(circle at 80% 35%, rgba(47,117,207,.18), transparent 30%), radial-gradient(circle at 5% 0%, rgba(23,79,150,.2), transparent 30%); content: ""; }
.digital-lines { position: absolute; z-index: -1; inset: 0; overflow: hidden; opacity: .55; pointer-events: none; }
.digital-lines i { position: absolute; width: 42vw; height: 1px; background: linear-gradient(90deg, transparent, rgba(82,149,234,.3), transparent); }
.digital-lines i:nth-child(1) { top: 25%; left: -8%; transform: rotate(12deg); }
.digital-lines i:nth-child(2) { top: 58%; right: -10%; animation-delay: -5s; transform: rotate(-8deg); }
.digital-lines i:nth-child(3) { bottom: 12%; left: 30%; animation-delay: -9s; transform: rotate(5deg); }
.hero-layout { display: grid; grid-template-columns: minmax(0,.9fr) minmax(500px,1.1fr); gap: clamp(52px, 7vw, 96px); align-items: center; }
.hero-copy { position: relative; z-index: 4; }
.hero h1 { max-width: 690px; font-size: clamp(50px, 5.3vw, 76px); letter-spacing: -.055em; }
.hero-lead { max-width: 630px; margin: 25px 0 0; color: #b4c2d3; font-size: clamp(17px,1.45vw,20px); }
.hero-actions, .contact-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 31px; }
.hero-benefits { display: flex; flex-wrap: wrap; gap: 10px 20px; margin: 30px 0 0; padding: 0; color: #bac8d8; list-style: none; font-size: 12px; font-weight: 650; }
.hero-benefits li { display: flex; align-items: center; gap: 8px; }
.hero-benefits span { display: grid; width: 18px; height: 18px; place-items: center; color: #cbe1ff; background: rgba(47,117,207,.2); border: 1px solid rgba(112,170,242,.3); border-radius: 50%; font-size: 9px; }
.hero-visual { position: relative; width: 100%; height: 540px; opacity: 1; filter: drop-shadow(0 34px 40px rgba(0,7,18,.38)); }
.interface-label { position: absolute; z-index: 6; top: 6px; left: 6%; display: flex; align-items: center; gap: 8px; padding: 8px 12px; color: #b9c8d9; background: rgba(13,29,51,.75); border: 1px solid rgba(255,255,255,.13); border-radius: 99px; font-size: 9px; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; backdrop-filter: blur(10px); }
.interface-label span { width: 7px; height: 7px; background: #5d9aeb; border-radius: 50%; box-shadow: 0 0 0 4px rgba(47,117,207,.16); }
.browser-window { position: absolute; z-index: 2; top: 52px; right: 0; width: 94%; overflow: hidden; background: #f8fafc; border: 1px solid rgba(255,255,255,.25); border-radius: 18px; box-shadow: 0 42px 90px rgba(0,7,18,.42); }
.browser-topbar { display: grid; grid-template-columns: 80px 1fr 80px; height: 40px; align-items: center; color: #7e8a99; background: #eaf0f6; }
.browser-dots { display: flex; gap: 5px; padding-left: 15px; }
.browser-dots i, .mock-browser-bar i { width: 7px; height: 7px; background: #9aa8b8; border-radius: 50%; }
.browser-dots i:first-child, .mock-browser-bar i:first-child { background: #ec7880; }.browser-dots i:nth-child(2), .mock-browser-bar i:nth-child(2) { background: #e8bd5d; }.browser-dots i:nth-child(3), .mock-browser-bar i:nth-child(3) { background: #66b88d; }
.browser-address { padding: 4px 12px; background: #fff; border: 1px solid #dbe2ea; border-radius: 7px; font-size: 9px; text-align: center; }
.demo-site { height: 365px; color: #233a31; background: #f3efe7; }
.demo-nav { display: flex; height: 52px; align-items: center; justify-content: space-between; padding: 0 25px; background: rgba(255,255,255,.72); font-size: 8px; }
.demo-nav b { display: flex; align-items: center; gap: 7px; font: 700 13px Georgia, serif; }.demo-nav b i { width: 19px; height: 19px; border: 5px solid #426659; border-radius: 50%; }
.demo-hero { display: grid; height: 313px; grid-template-columns: .9fr 1.1fr; }
.demo-hero > div { display: flex; justify-content: center; flex-direction: column; padding: 28px 18px 28px 34px; }
.demo-hero small { color: #708379; font-size: 7px; font-weight: 800; letter-spacing: .15em; }.demo-hero strong { max-width: 220px; margin-top: 9px; font: 500 30px/1.03 Georgia, serif; }.demo-hero p { color: #708078; font-size: 8px; }.demo-hero div > b { align-self: flex-start; padding: 8px 12px; color: #fff; background: #385d50; border-radius: 3px; font-size: 7px; }
.demo-hero figure { position: relative; margin: 0; overflow: hidden; background: linear-gradient(135deg,#d3c7b3,#f1eadf 58%,#bfae94); }.demo-hero figure::before { position: absolute; top: 0; right: 18%; width: 44%; height: 65%; border: 9px solid rgba(65,77,68,.48); border-top: 0; content: ""; }.demo-hero figure i { position: absolute; right: 10%; bottom: 30px; width: 72%; height: 92px; background: #e8ded0; border-radius: 42px 42px 12px 12px; box-shadow: 0 24px 28px rgba(57,52,42,.2); }.demo-hero figure span { position: absolute; bottom: 16px; left: 10%; width: 30px; height: 120px; background: #466852; border-radius: 100% 0; transform: rotate(-20deg); }
.phone-window { position: absolute; z-index: 5; right: -4px; bottom: 6px; width: 146px; height: 294px; padding: 8px; color: #24362f; background: #08131f; border: 1px solid rgba(255,255,255,.24); border-radius: 26px; box-shadow: 0 28px 60px rgba(0,7,18,.5); transform: rotate(3deg); }.phone-window > i { position: absolute; z-index: 2; top: 13px; left: 50%; width: 40px; height: 5px; background: #07101a; border-radius: 9px; transform: translateX(-50%); }.phone-window > div { height: 100%; padding: 36px 11px 12px; overflow: hidden; background: #f5f2ea; border-radius: 19px; }.phone-window small { color: #708379; font-size: 7px; font-weight: 800; letter-spacing: .14em; }.phone-window strong { display: block; margin-top: 8px; font: 500 20px/1.05 Georgia,serif; }.phone-window figure { position: relative; height: 100px; margin: 17px 0; overflow: hidden; background: linear-gradient(135deg,#cbbda8,#ede5da); border-radius: 8px; }.phone-window figure i { position: absolute; right: 10px; bottom: 10px; width: 80px; height: 44px; background: #e9dfd2; border-radius: 22px 22px 5px 5px; }.phone-window b { padding: 7px 10px; color: #fff; background: #385d50; border-radius: 3px; font-size: 7px; }
.signal-card { position: absolute; z-index: 7; display: flex; min-width: 178px; align-items: center; gap: 10px; padding: 11px 13px; background: rgba(13,29,51,.9); border: 1px solid rgba(255,255,255,.14); border-radius: 13px; box-shadow: 0 18px 36px rgba(0,7,18,.32); backdrop-filter: blur(14px); }.signal-card > span { display: grid; width: 28px; height: 28px; place-items: center; color: #c9e0ff; background: rgba(47,117,207,.28); border-radius: 8px; font-size: 11px; }.signal-card small { display: block; color: #7f94aa; font-size: 7px; font-weight: 800; letter-spacing: .12em; }.signal-card strong { display: block; font-size: 10px; }.signal-one { bottom: 14px; left: 0; }.signal-two { top: 145px; right: -35px; }

/* Portfolio */
.section-projects { background: linear-gradient(180deg,#fff 0,#f8fbff 100%); }
.project-filters { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 30px; }
.filter-button { min-height: 40px; padding: 8px 15px; color: #53657a; background: #fff; border: 1px solid var(--line); border-radius: 99px; font-size: 12px; font-weight: 750; cursor: pointer; transition: .2s; }
.filter-button:hover, .filter-button.is-active { color: #fff; background: var(--blue); border-color: var(--blue); }
.projects-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; transition: opacity .18s ease; }
.projects-grid.is-changing { opacity: 0; }
.project-card { position: relative; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 14px 42px rgba(7,19,35,.065); opacity: 0; transform: translateY(18px); transition: opacity .45s var(--ease), transform .45s var(--ease), border-color .25s, box-shadow .25s; }
.project-card.is-visible { opacity: 1; transform: none; }
.project-card:hover { border-color: #80ace5; box-shadow: 0 24px 55px rgba(7,19,35,.11); transform: translateY(-3px); }
.project-preview { position: relative; height: 370px; overflow: hidden; background: #eaf0f7; }
.project-preview::after { position: absolute; inset: 0; background: linear-gradient(180deg,transparent 48%,rgba(7,19,35,.76)); content: ""; opacity: 0; transition: opacity .25s; }
.project-card:hover .project-preview::after { opacity: 1; }
.mock-browser { position: absolute; inset: 38px 32px 28px; overflow: hidden; background: #fff; border-radius: 12px; box-shadow: 0 22px 55px rgba(7,19,35,.24); transform: scale(1); transition: transform .35s var(--ease); }
.project-card:hover .mock-browser { transform: translateY(-3px) scale(1.02); }
.mock-browser-bar { display: flex; height: 28px; align-items: center; gap: 4px; padding: 0 10px; background: #e9eef4; }
.mock-page { position: relative; height: calc(100% - 28px); overflow: hidden; padding: 30px; }
.mock-page small { display: block; font-size: 7px; font-weight: 850; letter-spacing: .17em; }.mock-page strong { display: block; max-width: 62%; margin-top: 10px; font-size: clamp(23px,3vw,38px); line-height: .98; }.mock-page b { display: inline-block; margin-top: 18px; padding: 8px 11px; font-size: 7px; }.mock-art { position: absolute; right: 0; bottom: 0; width: 46%; height: 78%; }
.theme-real .project-preview { background: #dbe8f7; }.theme-real .mock-page { color: #eef6ff; background: linear-gradient(140deg,#102947,#174f96); }.theme-real .mock-page b { color: #173253; background: #fff; }.theme-real .mock-art { background: linear-gradient(145deg,#3476c8,#081728); clip-path: polygon(28% 0,100% 0,100% 100%,0 100%); }
.theme-food .project-preview { background: #e8ddd0; }.theme-food .mock-page { color: #f8eade; background: #301b15; }.theme-food .mock-page strong { font-family: Georgia,serif; }.theme-food .mock-page b { color: #301b15; background: #d99a5f; }.theme-food .mock-art { right: 4%; bottom: 7%; width: 34%; height: 68%; background: radial-gradient(circle at 50% 50%,#e4c59f 0 22%,#a66d3d 23% 36%,#ede1cf 37% 52%,transparent 53%); border-radius: 50%; }
.theme-beauty .project-preview { background: #eee3e3; }.theme-beauty .mock-page { color: #482f35; background: #f8eeed; }.theme-beauty .mock-page strong { font-family: Georgia,serif; font-weight: 500; }.theme-beauty .mock-page b { color: #fff; background: #7d4f5b; }.theme-beauty .mock-art { right: 5%; bottom: -15%; width: 40%; height: 110%; background: linear-gradient(145deg,#d5aaa7,#794d55); border-radius: 48% 48% 12% 12%; transform: rotate(8deg); }
.theme-tattoo .project-preview { background: #d9d9d9; }.theme-tattoo .mock-page { color: #f4f4f2; background: #111; }.theme-tattoo .mock-page strong { font-family: Georgia,serif; font-weight: 500; }.theme-tattoo .mock-page b { color: #111; background: #e8e6dd; }.theme-tattoo .mock-art { right: 7%; bottom: 9%; width: 34%; height: 62%; border: 1px solid #bab8b0; border-radius: 50%; box-shadow: inset 0 0 0 20px #111,inset 0 0 0 21px #777; }
.theme-local .project-preview { background: #d9e2e7; }.theme-local .mock-page { color: #0e2932; background: #eff4f4; }.theme-local .mock-page b { color: #fff; background: #e56836; }.theme-local .mock-art { right: 4%; bottom: 5%; width: 39%; height: 75%; background: repeating-linear-gradient(90deg,#183943 0 2px,transparent 2px 26px),repeating-linear-gradient(#183943 0 2px,transparent 2px 26px); transform: skewY(-8deg); opacity: .65; }
.project-overlay { position: absolute; z-index: 2; right: 20px; bottom: 18px; left: 20px; display: flex; align-items: center; justify-content: space-between; color: #fff; opacity: 0; transform: translateY(8px); transition: .25s var(--ease); }.project-card:hover .project-overlay { opacity: 1; transform: none; }.project-overlay span { font-size: 11px; font-weight: 750; }.project-overlay b { display: grid; width: 38px; height: 38px; place-items: center; background: var(--blue-bright); border-radius: 50%; }
.project-content { padding: 25px 27px 28px; }.project-topline { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 15px; }.project-category { color: var(--blue); font-size: 10px; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }.project-type { display: inline-flex; align-items: center; padding: 6px 9px; color: #53657a; background: #f0f4f8; border-radius: 99px; font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.project-type.real { color: #145431; background: #e6f5ec; }.project-content h3 { font-size: clamp(24px,2.6vw,34px); }.project-content > p { min-height: 52px; margin: 13px 0 17px; color: var(--gray); font-size: 14px; }.project-services { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 22px; padding: 0; list-style: none; }.project-services li { padding: 5px 8px; color: #5f6f81; background: var(--off-white); border: 1px solid #e7edf3; border-radius: 6px; font-size: 9px; font-weight: 700; }.project-actions { display: flex; flex-wrap: wrap; gap: 10px; }.project-actions .button { min-height: 43px; padding: 10px 14px; font-size: 12px; }.project-more-wrap { display: flex; justify-content: center; margin-top: 30px; }.project-more-wrap[hidden] { display: none; }
.section-bridge { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 62px; padding: 26px 30px; color: #fff; background: var(--navy); border-radius: var(--radius); }.section-bridge p { margin: 0; font-size: clamp(18px,2vw,24px); font-weight: 700; }

/* Services */
.section-services { background: var(--blue-pale); }
.services-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.service-card { position: relative; min-height: 340px; padding: clamp(27px,3vw,38px); background: #fff; border: 1px solid #dce6f1; border-radius: var(--radius); box-shadow: 0 12px 38px rgba(7,19,35,.045); transition: .25s var(--ease); }
.service-card:hover { border-color: #b8cce4; box-shadow: 0 22px 48px rgba(7,19,35,.09); transform: translateY(-4px); }.service-featured { color: #fff; background: linear-gradient(145deg,var(--navy),#12335b); border-color: transparent; }.service-number { position: absolute; top: 28px; right: 30px; color: #95a5b8; font-size: 10px; font-weight: 850; letter-spacing: .14em; }.service-icon { display: grid; width: 46px; height: 46px; place-items: center; color: var(--blue); background: var(--blue-pale); border: 1px solid #cadaed; border-radius: 13px; font-size: 23px; }.service-featured .service-icon { color: #a9cdf9; background: rgba(47,117,207,.2); border-color: rgba(112,170,242,.25); }.service-card h3 { margin-top: 26px; font-size: clamp(24px,2.4vw,32px); }.service-card > p { max-width: 520px; margin: 14px 0 17px; color: var(--gray); font-size: 14px; }.service-featured > p { color: #afbed0; }.service-card ul { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin: 0 0 24px; padding: 0; list-style: none; }.service-card li { padding-top: 10px; color: #5c6d81; border-top: 1px solid #e2e9f1; font-size: 11px; font-weight: 650; }.service-featured li { color: #b9c8d9; border-color: rgba(255,255,255,.12); }.service-card > a { display: inline-flex; align-items: center; gap: 8px; color: var(--blue); font-size: 12px; font-weight: 800; }.service-featured > a { color: #9fc9ff; }

/* Process */
.section-process { background: #fff; }
.process-list { position: relative; display: grid; grid-template-columns: repeat(4,1fr); gap: 0; margin: 0; padding: 0; list-style: none; }.process-list::before { position: absolute; top: 37px; right: 10%; left: 10%; height: 1px; background: #cfdbe9; content: ""; }.process-list li { position: relative; padding: 0 22px; text-align: center; }.process-list li > span { position: relative; z-index: 1; display: grid; width: 74px; height: 74px; margin: 0 auto 23px; place-items: center; color: var(--blue); background: #fff; border: 1px solid #bcd0e8; border-radius: 50%; box-shadow: 0 9px 25px rgba(7,19,35,.07); font-size: 12px; font-weight: 850; letter-spacing: .1em; }.process-list h3 { font-size: 22px; }.process-list p { margin: 11px 0 0; color: var(--gray); font-size: 13px; }.process-note { width: fit-content; margin: 52px auto 0; padding: 14px 20px; color: #486079; background: var(--off-white); border: 1px solid var(--line); border-radius: 99px; font-size: 13px; font-weight: 650; }

/* Management */
.section-management { overflow: hidden; }
.management-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(50px,8vw,112px); align-items: center; }.management-copy { position: relative; z-index: 1; }.management-copy h2 { max-width: 610px; font-size: clamp(40px,5vw,66px); }.management-copy > p:not(.eyebrow) { margin: 22px 0 0; color: #a7b7ca; }.plan-price { display: flex; align-items: baseline; gap: 8px; margin: 29px 0; }.plan-price small { color: #9fb0c3; font-size: 13px; }.plan-price strong { font-size: 44px; line-height: 1; }.plan-price span { color: #9fb0c3; font-size: 13px; }.management-panel { position: relative; z-index: 1; padding: clamp(27px,4vw,46px); background: rgba(255,255,255,.065); border: 1px solid rgba(255,255,255,.13); border-radius: var(--radius-lg); box-shadow: 0 30px 70px rgba(0,6,15,.25); backdrop-filter: blur(12px); }.management-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; margin: 0; padding: 0; list-style: none; }.management-summary li { position: relative; padding: 16px 0 16px 25px; color: #d7e1ed; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 14px; font-weight: 650; }.management-summary li::before { position: absolute; top: 23px; left: 2px; width: 7px; height: 7px; background: var(--blue-bright); border-radius: 50%; box-shadow: 0 0 0 4px rgba(47,117,207,.15); content: ""; }.management-panel details { margin-top: 25px; border-top: 1px solid rgba(255,255,255,.14); }.management-panel summary { display: flex; align-items: center; justify-content: space-between; padding: 22px 0 0; color: #9fc9ff; font-size: 13px; font-weight: 800; cursor: pointer; list-style: none; }.management-panel summary::-webkit-details-marker { display: none; }.management-panel summary span, .faq-list summary span { position: relative; width: 18px; height: 18px; }.management-panel summary span::before, .management-panel summary span::after, .faq-list summary span::before, .faq-list summary span::after { position: absolute; top: 8px; left: 3px; width: 12px; height: 2px; background: currentColor; content: ""; transition: transform .2s; }.management-panel summary span::after, .faq-list summary span::after { transform: rotate(90deg); }.management-panel details[open] summary span::after, .faq-list details[open] summary span::after { transform: rotate(0); }.management-panel details div { padding-top: 15px; color: #a8b8ca; font-size: 13px; }.management-panel details p { margin-bottom: 9px; }

/* Why */
.section-why { background: #fff; }.why-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(50px,8vw,112px); align-items: center; }.why-brand { position: relative; min-height: 450px; display: grid; place-items: center; overflow: hidden; background: linear-gradient(145deg,#0d1d33,#18365d); border-radius: var(--radius-lg); }.why-brand > span { position: relative; z-index: 2; display: block; width: 190px; height: 190px; overflow: hidden; background: #fff; border-radius: 24px; box-shadow: 0 26px 60px rgba(0,6,15,.35); }.why-brand img { width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.14); }.why-orbits, .why-orbits::before { position: absolute; inset: 11%; border: 1px solid rgba(94,153,229,.25); border-radius: 50%; content: ""; }.why-orbits::before { inset: 18%; }.why-orbits i { position: absolute; width: 9px; height: 9px; background: var(--blue-bright); border-radius: 50%; box-shadow: 0 0 0 6px rgba(47,117,207,.13); }.why-orbits i:first-child { top: 15%; left: 10%; }.why-orbits i:last-child { right: 5%; bottom: 21%; }.why-copy > p { max-width: 690px; margin-top: 23px; }.why-points { display: grid; margin-top: 30px; border-top: 1px solid var(--line); }.why-points article { display: grid; grid-template-columns: 52px 1fr; align-items: center; padding: 19px 0; border-bottom: 1px solid var(--line); }.why-points span { color: var(--blue); font-size: 10px; font-weight: 850; letter-spacing: .12em; }.why-points h3 { font-size: 19px; }

/* FAQ */
.section-faq { background: var(--blue-pale); }.faq-layout { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(50px,8vw,110px); align-items: start; }.faq-intro { position: sticky; top: 120px; }.faq-intro > p { margin-top: 21px; }.faq-list { border-top: 1px solid #cfdbe8; }.faq-list details { border-bottom: 1px solid #cfdbe8; }.faq-list summary { display: flex; min-height: 78px; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; list-style: none; font-size: 17px; font-weight: 750; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary span { flex: 0 0 18px; color: var(--blue); }.faq-list details div { padding: 0 42px 22px 0; color: var(--gray); font-size: 14px; }.faq-list details p { margin: 0; }.faq-list details[open] > div,.management-panel details[open] > div { animation: details-fade .2s ease; }
@keyframes details-fade { from { opacity: 0; transform: translateY(-3px); } }

/* Contact */
.section-contact { padding-top: clamp(90px,9vw,145px); overflow: hidden; background: radial-gradient(circle at 50% 0,rgba(47,117,207,.17),transparent 32%),var(--navy-deep); }.contact-heading { max-width: 1000px; text-align: center; }.contact-heading .eyebrow { justify-content: center; }.contact-heading h2 { margin-inline: auto; font-size: clamp(46px,6.5vw,84px); }.contact-heading > p { max-width: 690px; margin: 25px auto 0; color: #adbdcf; font-size: clamp(16px,1.5vw,19px); }.contact-heading .contact-actions { justify-content: center; }.contact-heading > small { display: block; margin-top: 17px; color: #8497ad; }.contact-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(35px,6vw,80px); align-items: start; margin-top: 72px; }.contact-info { padding-top: 26px; }.contact-info h3 { font-size: 28px; }.contact-info > p { margin: 16px 0 28px; color: #9fb0c3; }.contact-list { display: grid; border-top: 1px solid rgba(255,255,255,.12); }.contact-list > div, .contact-list > a { display: flex; align-items: center; gap: 14px; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.12); }.contact-list > * > span { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; color: #bcd8fb; background: rgba(47,117,207,.2); border-radius: 9px; font-size: 12px; }.contact-list p { min-width: 0; margin: 0; }.contact-list small { display: block; color: #8093a9; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }.contact-list strong { display: block; margin-top: 2px; overflow-wrap: anywhere; color: #dbe6f2; font-size: 12px; }.contact-form-wrap { overflow: hidden; color: var(--text); background: #fff; border-radius: var(--radius); box-shadow: 0 30px 80px rgba(0,5,14,.3); }.form-topline { display: flex; justify-content: space-between; gap: 20px; padding: 18px 26px; background: #edf2f7; border-bottom: 1px solid #dce4ed; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.form-topline small { color: var(--gray); }.contact-form { padding: clamp(24px,4vw,42px); }.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }.field { display: flex; min-width: 0; flex-direction: column; }.field-full { grid-column: 1/-1; }.field label { margin-bottom: 7px; color: #334155; font-size: 11px; font-weight: 800; }.field input, .field select, .field textarea { width: 100%; color: var(--text); background: #f9fbfd; border: 1px solid #d9e2eb; border-radius: 9px; outline: none; transition: border-color .2s,box-shadow .2s,background-color .2s; }.field input, .field select { height: 48px; padding: 0 13px; }.field textarea { min-height: 110px; padding: 12px 13px; resize: vertical; }.field input:focus, .field select:focus, .field textarea:focus { background: #fff; border-color: #65a0e8; box-shadow: 0 0 0 3px rgba(47,117,207,.12); }.checkbox-field { display: grid; grid-template-columns: 19px 1fr; align-items: start; gap: 9px; }.checkbox-field input { width: 17px; height: 17px; margin: 3px 0 0; accent-color: var(--blue); }.checkbox-field label { margin: 0; color: #5f6f82; font-size: 11px; font-weight: 500; }.checkbox-field label a { color: var(--blue); text-decoration: underline; }.field-error { min-height: 16px; margin-top: 4px; color: var(--danger); font-size: 10px; }.checkbox-field .field-error { grid-column: 2; }.has-error input,.has-error select,.has-error textarea { border-color: var(--danger); }.button-submit { width: 100%; margin-top: 6px; }.form-status { margin: 13px 0 0; padding: 10px 12px; color: #4f6072; background: #f2f5f8; border-radius: 7px; font-size: 10px; }.form-status-error { color: #842534; background: #fff0f2; }.form-status-success { color: #1f6541; background: #edf9f2; }.form-status-config { color: #6e5a25; background: #fff9e9; }

/* Footer + fixed CTAs */
.site-footer { color: #a6b6c8; background: #040d18; }.footer-main { display: grid; grid-template-columns: 1.6fr .7fr .8fr; gap: 55px; padding: 65px 0 50px; }.footer-brand p { max-width: 360px; margin: 20px 0 0; font-size: 13px; }.footer-column { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: 9px; font-size: 12px; }.footer-column h2 { margin-bottom: 7px; color: #fff; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }.footer-column a { overflow-wrap: anywhere; }.footer-column a:hover { color: #fff; }.footer-bottom { display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "copyright back" "copyright credit"; gap: 4px 24px; align-items: center; padding: 22px 0; border-top: 1px solid rgba(255,255,255,.09); font-size: 11px; }.footer-bottom p { margin: 0; }.footer-copyright { grid-area: copyright; }.footer-bottom > a { grid-area: back; justify-self: end; }.developer-credit { grid-area: credit; justify-self: end; margin: 0; font-size: 12px; font-weight: 400; letter-spacing: .04em; line-height: 1.4; text-align: right; opacity: .58; }.floating-cta { position: fixed; z-index: 800; right: 22px; bottom: 22px; padding: 11px 17px; color: #fff; background: var(--blue); border: 1px solid rgba(255,255,255,.17); border-radius: 99px; box-shadow: 0 15px 35px rgba(7,19,35,.28); font-size: 12px; font-weight: 800; transition: .2s; }.floating-cta:hover { background: var(--blue-bright); transform: translateY(-2px); }.floating-whatsapp { display: none; }

/* Legal-page responsive safeguards */
.legal-table-wrap { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.legal-footer-inner { display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "copyright nav" "copyright credit"; gap: 4px 24px; align-items: center; padding: 22px 0; border-top: 1px solid rgba(255,255,255,.09); font-size: 11px; }.legal-footer-inner p { margin: 0; }.legal-footer-inner .footer-copyright { grid-area: copyright; }.legal-footer-inner nav { display: flex; grid-area: nav; flex-wrap: wrap; justify-content: flex-end; gap: 8px 18px; }.legal-footer-inner .developer-credit { grid-area: credit; }

/* Project dialog */
.project-dialog { width: min(1060px,calc(100% - 36px)); max-height: min(820px,calc(100dvh - 36px)); padding: 0; overflow: auto; color: var(--text); background: #fff; border: 0; border-radius: var(--radius-lg); box-shadow: 0 40px 100px rgba(0,6,15,.5); }.project-dialog::backdrop { background: rgba(3,10,19,.78); backdrop-filter: blur(5px); }.dialog-close { position: absolute; z-index: 5; top: 14px; right: 14px; display: grid; width: 40px; height: 40px; place-items: center; color: #fff; background: rgba(7,19,35,.72); border: 1px solid rgba(255,255,255,.2); border-radius: 50%; font-size: 25px; line-height: 1; cursor: pointer; }.dialog-layout { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 650px; }.dialog-visual { position: relative; display: grid; place-items: center; min-height: 650px; overflow: hidden; background: #e7eef6; }.dialog-visual .mock-browser { inset: auto; width: 82%; height: 58%; }.dialog-phone { position: absolute; z-index: 3; right: 7%; bottom: 5%; width: 115px; height: 235px; padding: 7px; background: #091421; border-radius: 22px; box-shadow: 0 23px 48px rgba(7,19,35,.33); transform: rotate(3deg); }.dialog-phone > div { height: 100%; padding: 29px 12px; color: #fff; background: var(--blue); border-radius: 16px; }.dialog-phone small { font-size: 6px; letter-spacing: .13em; }.dialog-phone strong { display: block; margin-top: 10px; font-size: 16px; line-height: 1.05; }.dialog-content { padding: clamp(38px,5vw,65px); }.dialog-content .eyebrow { margin: 16px 0 11px; }.dialog-content .eyebrow i { font-style: normal; }.dialog-content h2 { font-size: clamp(34px,4vw,52px); }.dialog-content > p { margin: 18px 0 25px; color: var(--gray); font-size: 14px; }.dialog-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 24px; }.dialog-facts > div { padding-top: 13px; border-top: 1px solid var(--line); }.dialog-facts small,.dialog-label { color: var(--blue); font-size: 9px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }.dialog-facts p { margin: 6px 0 0; color: #56677a; font-size: 12px; }.feature-list { display: flex; flex-wrap: wrap; gap: 7px; margin: 8px 0 28px; padding: 0; list-style: none; }.feature-list li { padding: 6px 9px; color: #4e6074; background: var(--off-white); border: 1px solid var(--line); border-radius: 7px; font-size: 10px; font-weight: 650; }.dialog-site-link[hidden] { display: none; }

/* Reveal */
.js [data-reveal] { opacity: 0; transform: translateY(20px); transition: opacity .55s var(--ease), transform .55s var(--ease); transition-delay: var(--reveal-delay,0ms); }.js [data-reveal].is-visible { opacity: 1; transform: none; }
.js [data-reveal] .eyebrow > span { transform: scaleX(0); transform-origin: left; transition: transform .48s var(--ease); transition-delay: calc(var(--reveal-delay,0ms) + 80ms); }
.js [data-reveal].is-visible .eyebrow > span { transform: scaleX(1); }
.js .service-card .service-icon,.js .process-list li > span { opacity: .45; transform: translateY(6px) scale(.94); transition: opacity .38s var(--ease),transform .42s var(--ease); }
.js .service-card.is-visible .service-icon,.js .process-list li.is-visible > span { opacity: 1; transform: none; transition-delay: calc(var(--reveal-delay,0ms) + 90ms); }
.button:active,.filter-button:active { transform: scale(.98); }
.mobile-nav > a { transition: opacity .28s var(--ease),transform .32s var(--ease),color .2s; }
.js .mobile-menu:not(.is-open) .mobile-nav > a { opacity: 0; transform: translateY(7px); }
.js .mobile-menu.is-open .mobile-nav > a:nth-child(2) { transition-delay: 35ms; }.js .mobile-menu.is-open .mobile-nav > a:nth-child(3) { transition-delay: 70ms; }.js .mobile-menu.is-open .mobile-nav > a:nth-child(4) { transition-delay: 105ms; }.js .mobile-menu.is-open .mobile-nav > a:nth-child(5) { transition-delay: 140ms; }.js .mobile-menu.is-open .mobile-nav > a:nth-child(6) { transition-delay: 175ms; }
@media (max-width: 1080px) {
  .desktop-nav,.header-cta { display: none; }.menu-toggle { display: flex; margin-left: auto; }
  .hero { min-height: auto; padding-bottom: 110px; }.hero-layout { grid-template-columns: 1fr; }.hero-copy { max-width: 800px; }.hero-visual { width: min(680px,100%); margin: 0 auto; }
  .projects-grid { grid-template-columns: 1fr 1fr; }.project-preview { height: 320px; }
  .management-layout,.why-layout { gap: 55px; }.faq-layout { gap: 55px; }
  .floating-cta { display: none; }.floating-whatsapp { position: fixed; z-index: 800; right: 18px; bottom: 18px; display: grid; width: 49px; height: 49px; place-items: center; color: #fff; background: #168b58; border: 2px solid rgba(255,255,255,.8); border-radius: 50%; box-shadow: 0 14px 34px rgba(7,19,35,.25); font-size: 20px; font-weight: 800; }
}

@media (max-width: 820px) {
  .container { width: min(calc(100% - 32px),var(--container)); }.section { padding: 76px 0; }
  .heading-split { grid-template-columns: 1fr; gap: 20px; }.section-heading h2,.why-copy h2,.faq-intro h2 { font-size: clamp(36px,9vw,54px); }
  .projects-grid,.services-grid,.management-layout,.why-layout,.faq-layout,.contact-layout { grid-template-columns: 1fr; }.project-preview { height: 360px; }
  .management-copy { max-width: 680px; }.why-brand { min-height: 380px; }.faq-intro { position: static; }
  .process-list { grid-template-columns: 1fr 1fr; gap: 35px 0; }.process-list::before { display: none; }
  .contact-layout { margin-top: 55px; }.contact-info { padding-top: 0; }.footer-main { grid-template-columns: 1.2fr 1fr 1fr; gap: 30px; }
  .dialog-layout { grid-template-columns: 1fr; }.dialog-visual { min-height: 430px; }.dialog-content { padding: 36px 28px; }
}

@media (max-width: 560px) {
  :root { --header-height: 74px; }.container { width: min(calc(100% - 24px),var(--container)); }.section { padding: 66px 0; }
  .brand-surface { width: 132px; height: 45px; }.hero { padding: 112px 0 75px; }.hero h1 { font-size: clamp(42px,13vw,58px); }.hero-lead { font-size: 16px; }.hero-actions,.contact-actions { flex-direction: column; align-items: stretch; }.hero-benefits { display: grid; }.hero-visual { height: 355px; margin-top: 8px; }.browser-window { top: 37px; width: 100%; }.browser-topbar { grid-template-columns: 62px 1fr 20px; height: 30px; }.demo-site { height: 246px; }.demo-nav { height: 38px; padding: 0 13px; }.demo-nav span { display: none; }.demo-hero { height: 208px; }.demo-hero > div { padding: 18px 12px 18px 18px; }.demo-hero strong { font-size: 19px; }.demo-hero p { display: none; }.demo-hero figure i { height: 58px; }.phone-window { right: 4px; bottom: 0; width: 94px; height: 190px; padding: 5px; border-radius: 18px; }.phone-window > div { padding: 24px 8px 8px; border-radius: 13px; }.phone-window strong { font-size: 13px; }.phone-window figure { height: 62px; margin: 10px 0; }.signal-card { min-width: 145px; padding: 8px 9px; }.signal-one { bottom: 2px; left: 3px; }.signal-two { display: none; }.interface-label { left: 2%; }
  .project-filters { flex-wrap: nowrap; margin-inline: -12px; padding: 0 12px 7px; overflow-x: auto; }.filter-button { flex: 0 0 auto; }.projects-grid { grid-template-columns: 1fr; }.project-preview { height: 295px; }.mock-browser { inset: 28px 18px 22px; }.project-content { padding: 22px 20px 24px; }.project-content > p { min-height: 0; }.project-overlay { display: none; }.section-bridge { align-items: stretch; flex-direction: column; margin-top: 45px; padding: 24px 20px; }.section-bridge .button { width: 100%; }
  .services-grid { grid-template-columns: 1fr; }.service-card { min-height: auto; }.service-card ul { grid-template-columns: 1fr; }.service-card li { padding: 8px 0 0; }
  .process-list { grid-template-columns: 1fr; gap: 0; }.process-list li { display: grid; grid-template-columns: 55px 1fr; gap: 17px; padding: 0 0 24px; text-align: left; }.process-list li > span { width: 54px; height: 54px; margin: 0; }.process-list p { margin-top: 7px; }.process-note { width: 100%; border-radius: 14px; text-align: center; }
  .management-summary { grid-template-columns: 1fr; }.management-panel { padding: 24px 20px; }.why-brand { min-height: 310px; }.why-brand > span { width: 150px; height: 150px; }.faq-list summary { min-height: 72px; font-size: 15px; }
  .contact-heading h2 { font-size: clamp(40px,12vw,58px); }.form-topline { flex-direction: column; gap: 2px; padding: 15px 19px; }.contact-form { padding: 22px 18px; }.form-grid { grid-template-columns: 1fr; gap: 14px; }.field-full { grid-column: auto; }.footer-main { grid-template-columns: 1fr 1fr; }.footer-brand { grid-column: 1/-1; }.footer-bottom,.legal-footer-inner { grid-template-columns: 1fr; grid-template-areas: "copyright" "credit" "back"; gap: 8px; align-items: start; justify-items: start; }.footer-bottom > a,.developer-credit { justify-self: start; text-align: left; }.legal-footer-inner { grid-template-areas: "copyright" "credit" "nav"; }.legal-footer-inner nav { justify-content: flex-start; }
  .project-dialog { width: calc(100% - 16px); max-height: calc(100dvh - 16px); border-radius: 18px; }.dialog-visual { min-height: 330px; }.dialog-visual .mock-browser { width: 88%; height: 62%; }.dialog-phone { right: 4%; width: 76px; height: 155px; }.dialog-content { padding: 30px 20px; }.dialog-facts { grid-template-columns: 1fr; }
}

/* Phone refinements */
@media (max-width: 560px) {
  .section { padding: 60px 0; }
  .section-heading { margin-bottom: 36px; }
  .site-header,.site-header.is-scrolled,.site-header:has(.mobile-menu.is-open) { height: 70px; }
  .header-inner { gap: 12px; }
  .brand-surface { width: 136px; height: 44px; }
  .menu-toggle { width: 42px; height: 42px; }
  .mobile-menu { top: 70px; height: calc(100dvh - 70px); padding: 14px 18px max(28px,env(safe-area-inset-bottom)); }
  .mobile-nav > a:not(.button) { min-height: 55px; font-size: 17px; }
  .hero { padding: 102px 0 58px; }
  .hero-layout { gap: 30px; }
  .hero h1 { font-size: clamp(40px,12vw,48px); line-height: 1.02; }
  .hero-lead { margin-top: 20px; line-height: 1.55; }
  .hero-actions { margin-top: 26px; }
  .hero-benefits { gap: 10px 14px; margin-top: 24px; }
  .hero-visual { height: 325px; margin-top: 0; filter: drop-shadow(0 24px 30px rgba(0,7,18,.3)); }
  .browser-window { top: 32px; border-radius: 14px; }
  .demo-site { height: 224px; }.demo-nav { height: 36px; }.demo-hero { height: 188px; }
  .demo-hero > div { padding: 16px 10px 16px 16px; }.demo-hero strong { font-size: 18px; }
  .phone-window { right: 2px; width: 88px; height: 175px; }
  .phone-window > div { padding: 23px 7px 7px; }.phone-window figure { height: 56px; margin: 9px 0; }
  .signal-card { min-width: 138px; padding: 8px; }.signal-one { bottom: 3px; }.interface-label { top: 0; padding: 7px 10px; font-size: 8px; }
  .project-filters { gap: 7px; margin-bottom: 24px; scroll-snap-type: x proximity; scrollbar-width: none; }
  .project-filters::-webkit-scrollbar { display: none; }.filter-button { min-height: 42px; scroll-snap-align: start; }
  .project-preview { height: 270px; }.mock-browser { inset: 23px 14px 18px; }.mock-page { padding: 24px 20px; }
  .project-card { border-radius: 16px; }.project-content { padding: 20px 18px 22px; }.project-actions .button { width: 100%; }
  .service-card { padding: 24px 20px; border-radius: 16px; }.service-card h3 { margin-top: 20px; }
  .process-list li { grid-template-columns: 50px 1fr; gap: 14px; }.process-list li > span { width: 50px; height: 50px; }
  .management-panel { padding: 22px 18px; border-radius: 20px; }.plan-price strong { font-size: 40px; }
  .why-brand { min-height: 270px; }.why-brand > span { width: 145px; height: 145px; border-radius: 20px; }
  .faq-list summary { min-height: 68px; gap: 14px; }.faq-list details div { padding-right: 24px; }
  .contact-heading h2 { font-size: clamp(38px,11.5vw,48px); }.contact-layout { margin-top: 44px; }
  .contact-form { padding: 20px 16px; }.contact-form-wrap { border-radius: 16px; }
  .floating-whatsapp { right: max(14px,env(safe-area-inset-right)); bottom: max(14px,env(safe-area-inset-bottom)); }
  .dialog-visual { min-height: 285px; }.dialog-content { padding: 26px 18px; }
  .js [data-reveal] { transform: translateY(14px); transition-duration: .44s; }
}

@media (max-width: 420px) {
  .footer-main { grid-template-columns: 1fr; gap: 28px; padding: 52px 0 38px; }.footer-brand { grid-column: auto; }.footer-brand .brand-surface { width: 150px; height: 50px; }
  .footer-column { gap: 11px; }.footer-bottom { padding-bottom: max(24px,env(safe-area-inset-bottom)); }
}

@media (hover: none) {
  .project-card:hover,.service-card:hover,.button:hover,.floating-cta:hover { transform: none; }
  .project-card:hover .mock-browser { transform: none; }
  .project-card:hover .project-preview::after,.project-card:hover .project-overlay { opacity: 0; }
  .button:active,.filter-button:active { transform: scale(.98); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; } *,*::before,*::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }.project-card,.js [data-reveal] { opacity: 1; transform: none; }
}