/* GENERATED by build/make-css.mjs from the live site's globals.css: do not edit by hand (change source/app/globals.css or make-css.mjs, then rebuild). */
/* what Tailwind's reset gave the old site for free */
*,::after,::before{margin:0;padding:0;border:0 solid}
html{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4}
body{line-height:1.5}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}
b,strong{font-weight:bolder}
small{font-size:80%}
ol,ul,menu{list-style:none}
button,input,select,textarea{color:inherit;background-color:transparent;border-radius:0}
img,svg,video,iframe{vertical-align:middle}
svg,video{display:block}
button{cursor:pointer}
/* Font Awesome icons are drawn with the engine's inline icons: <i class="fa-..."><svg></svg></i> */
i[class*="fa-"]{display:inline-flex;align-items:center;justify-content:center;font-style:normal;line-height:1}
i[class*="fa-"]>svg{width:1em;height:1em}
i.fa-circle>svg{fill:currentColor}
i.fa-check{width:.875em}i.fa-check>svg{width:.875em}

:root {
  --green: #40f348;
  --green-dim: rgba(64,243,72,.12);
  --green-glow: rgba(64,243,72,.35);
  --bg: #050a07;
  --bg-card: rgba(14,22,15,.72);
  --border: rgba(255,255,255,.07);
  --border-green: rgba(64,243,72,.22);
  --text: #fff;
  --muted: #9ca3af;
  --muted-light: #d1d5db;
  --header-h: 72px;
  --background: #050a07;
  --foreground: #fff;
  --card: #0e160f;
  --card-foreground: #fff;
  --popover: #0e160f;
  --popover-foreground: #fff;
  --primary: #40f348;
  --primary-foreground: #071108;
  --secondary: #152117;
  --secondary-foreground: #d1d5db;
  --muted-foreground: #9ca3af;
  --accent: rgba(64,243,72,.12);
  --accent-foreground: #40f348;
  --destructive: #ef4444;
  --input: rgba(255,255,255,.12);
  --ring: #40f348;
  --radius: .75rem;
}


* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: "Montserrat", Arial, sans-serif; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
img { display: block; max-width: 100%; }
.container { width: min(1240px, calc(100% - 3rem)); margin: 0 auto; }
.section { padding: 6rem 0; scroll-margin-top: 100px; }
.tag { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 30px; background: var(--green-dim); border: 1px solid var(--border-green); color: var(--green); font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.tag i.fa-circle { font-size: .42rem; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 25px; border-radius: 999px; border: 2px solid transparent; font-weight: 700; font-size: .88rem; transition: .28s ease; cursor: pointer; }
.btn-solid { background: var(--green); color: #0a1a0c; box-shadow: 0 0 18px rgba(64,243,72,.28); }
.btn-outline { color: var(--green); border-color: var(--green); background: transparent; }
.btn-ghost { color: var(--muted-light); background: rgba(255,255,255,.05); border-color: var(--border); }
.btn:hover { transform: translateY(-2px); box-shadow: 0 0 28px rgba(64,243,72,.4); }

.site-header { position: fixed; inset: 0 0 auto; height: var(--header-h); z-index: 50; background: rgba(5,10,7,.88); backdrop-filter: blur(20px); border-bottom: 1px solid var(--border); }
.header-inner { width: min(1240px, calc(100% - 3rem)); height: 100%; margin: auto; display: flex; align-items: center; justify-content: space-between; }
.logo img { width: auto; height: 68px; filter: drop-shadow(0 0 9px rgba(64,243,72,.2)); }
.nav-links { display: flex; gap: 2rem; }
.nav-links a { color: var(--muted-light); font-size: .88rem; font-weight: 600; transition: color .2s; }
.nav-links a:hover { color: var(--green); }
.header-cta { display: flex; gap: .75rem; }
.hamburger { display: none; background: none; border: 0; padding: 8px; }
.hamburger span { display: block; width: 25px; height: 2px; margin: 5px; background: var(--muted-light); }
.avail-banner { position: fixed; top: var(--header-h); inset-inline: 0; z-index: 49; padding: .55rem; text-align: center; background: linear-gradient(90deg, rgba(64,243,72,.08), rgba(64,243,72,.04)); border-bottom: 1px solid var(--border-green); color: var(--green); font-size: .78rem; letter-spacing: .04em; }
.avail-banner .dot, .footer-brand h2 i { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green-glow); }
.mobile-menu { display: none; }

.hero { min-height: 100svh; padding: calc(var(--header-h) + 8rem) 1.5rem 5rem; display: grid; place-items: center; text-align: center; position: relative; overflow: hidden; background: radial-gradient(ellipse 80% 60% at 50% -10%, #0f2d14 0%, var(--bg) 70%); }
.hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(64,243,72,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(64,243,72,.035) 1px, transparent 1px); background-size: 60px 60px; mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000 30%, transparent); }
.hero-inner { position: relative; z-index: 1; max-width: 920px; }
.hero h1, .section-head h2, .about-text h2 { margin: 1.6rem 0 1.4rem; font-family: "Outfit", Arial, sans-serif; font-size: clamp(2.8rem, 6vw, 5.2rem); line-height: 1.05; letter-spacing: -1.5px; font-weight: 800; }
.grad-text { background: linear-gradient(135deg, #fff 20%, var(--green)); background-clip: text; color: transparent; }
.hero-sub { max-width: 650px; margin: 0 auto 1.5rem; color: var(--muted-light); font-size: 1.12rem; line-height: 1.75; }
.badge-row { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-bottom: 2.7rem; }
.badge-row span { padding: 8px 16px; border-radius: 30px; background: rgba(255,255,255,.04); border: 1px solid var(--border); color: var(--muted-light); font-size: .8rem; font-weight: 600; }
.hero-btns { display: flex; justify-content: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 3.2rem; }
.hero-btns .btn { padding: 16px 35px; font-size: 1rem; }
.hero-stats { display: flex; justify-content: center; gap: clamp(1.5rem, 5vw, 3rem); flex-wrap: wrap; padding-top: 2.4rem; border-top: 1px solid var(--border); }
.hero-stats div { min-width: 110px; }
.hero-stats strong { display: block; color: var(--green); font-family: "Outfit", Arial, sans-serif; font-size: 1.9rem; line-height: 1; }
.hero-stats div:first-child strong { font-size: 1.05rem; letter-spacing: .04em; }
.hero-stats small { display: block; margin-top: 7px; color: var(--muted); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }

.about-section { background: linear-gradient(180deg, var(--bg), #060e07); border-bottom: 1px solid var(--border); }
.about-grid { display: grid; grid-template-columns: 380px 1fr; gap: 6rem; align-items: center; }
.about-img-wrap { position: relative; }
.about-img-border { position: absolute; inset: -14px; border: 1.5px solid var(--border-green); border-radius: 26px; opacity: .55; transition: .5s; }
.about-img-wrap:hover .about-img-border { inset: -8px; opacity: 1; }
.about-img { position: relative; z-index: 1; width: 380px; height: 610px; object-fit: cover; object-position: top; border-radius: 20px; border: 1px solid var(--border); box-shadow: 0 30px 60px rgba(0,0,0,.6); animation: float 7s ease-in-out infinite; filter: contrast(1.06) brightness(1.04); }
@keyframes float { 50% { transform: translateY(-14px); } }
.about-text h2, .section-head h2 { font-size: clamp(2.4rem, 5vw, 3.2rem); margin: 1rem 0; }
.about-text h2 span, .section-head h2 span { color: var(--green); }
.about-text p, .section-head p { color: var(--muted-light); font-size: 1.05rem; line-height: 1.8; }
.trust-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem; margin-top: 1.8rem; }
.trust-grid div { display: flex; gap: 10px; align-items: center; padding: 13px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; color: var(--muted-light); font-size: .86rem; font-weight: 600; }
.trust-grid i { color: var(--green); }

.portfolio-section, .testimonials-section { background: var(--bg); }
.section-head { margin-bottom: 2.5rem; max-width: 720px; }
.section-head p { margin: 0; }
.centered { margin-inline: auto; text-align: center; }
.cd-pf__filters { display: flex; flex-wrap: wrap; gap: .65rem; margin-bottom: 2rem; }
.cd-pf__filters button { border: 1px solid var(--border); background: rgba(255,255,255,.04); color: var(--muted-light); padding: 9px 16px; border-radius: 30px; cursor: pointer; font-weight: 700; font-size: .82rem; transition: .2s; }
.cd-pf__filters button:hover, .cd-pf__filters button.is-on { color: #071108; background: var(--green); border-color: var(--green); }
.cd-pf__grid--cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; }
.cd-pf__card:not(.cd-pf__card--g) { padding: 1.4rem; border-radius: 20px; background: var(--bg-card); border: 1px solid var(--border); backdrop-filter: blur(12px); transition: .35s; }
.cd-pf__card:not(.cd-pf__card--g):hover { transform: translateY(-7px); border-color: var(--border-green); box-shadow: 0 20px 50px rgba(0,0,0,.5), 0 0 22px rgba(64,243,72,.08); }
.cd-pf__img:not(.cd-pf__img--g) { display: block; width: 100%; height: 230px; position: relative; overflow: hidden; padding: 0; margin: 0 0 1.2rem; border-radius: 12px; background: #0a120b; border: 1px solid rgba(255,255,255,.04); cursor: zoom-in; }
.cd-pf__img:not(.cd-pf__img--g) img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .7s, filter .4s; }
.cd-pf__card:not(.cd-pf__card--g):hover .cd-pf__img:not(.cd-pf__img--g) img { transform: scale(1.04); filter: brightness(.62); }
.cd-pf__badge { position: absolute; z-index: 2; top: 10px; right: 10px; padding: 4px 11px; border-radius: 20px; background: rgba(64,243,72,.15); color: var(--green); border: 1px solid var(--border-green); font-size: .68rem; font-weight: 800; }
.cd-pf__zoom { position: absolute; inset: 0; display: grid; place-items: center; color: var(--green); font-size: 2rem; opacity: 0; transition: .3s; }
.cd-pf__card:not(.cd-pf__card--g):hover .cd-pf__zoom { opacity: 1; }
.cd-pf__cat { color: var(--green); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cd-pf__card:not(.cd-pf__card--g) h3 { margin: .5rem 0; font-size: 1.2rem; }
.cd-pf__card:not(.cd-pf__card--g) p { min-height: 2.9rem; margin: 0 0 1rem; color: var(--muted); font-size: .9rem; line-height: 1.6; }
.cd-pf__links { display: flex; gap: 1rem; flex-wrap: wrap; }
.cd-pf__links button, .cd-pf__links a { padding: 0; border: 0; background: none; color: var(--green); font-weight: 800; font-size: .86rem; cursor: pointer; }

.auto-section, .packages-section { background: linear-gradient(180deg, #060e07, #040809); border-block: 1px solid var(--border); }
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.service-card, .testi-card { padding: 1.8rem; border-radius: 18px; background: var(--bg-card); border: 1px solid var(--border); transition: .3s; }
.service-card:hover, .testi-card:hover { transform: translateY(-5px); border-color: var(--border-green); }
.service-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--green-dim); border: 1px solid var(--border-green); color: var(--green); font-size: 1.2rem; }
.service-card h3 { margin: 1.2rem 0 .6rem; font-size: 1.05rem; }
.service-card p { min-height: 7rem; color: var(--muted); font-size: .87rem; line-height: 1.65; }
.service-card strong { color: var(--green); font-size: .8rem; }
.service-card strong span { color: var(--muted); font-weight: 500; }
.info-card { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-top: 2.4rem; padding: 1.8rem 2rem; border: 1px solid var(--border-green); border-left: 4px solid var(--green); border-radius: 16px; background: var(--bg-card); }
.info-card h3 { margin: 0 0 .5rem; }
.info-card h3 i, .info-card em { color: var(--green); font-style: normal; }
.info-card p { margin: 0; color: var(--muted); line-height: 1.7; font-size: .88rem; }

.packages-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; align-items: stretch; }
.pkg-card { position: relative; display: flex; flex-direction: column; padding: 2rem 1.5rem; border-radius: 18px; background: var(--bg-card); border: 1px solid var(--border); transition: .3s; }
.pkg-card:hover { transform: translateY(-7px); border-color: var(--border-green); }
.pkg-card.popular { border-color: var(--green); box-shadow: 0 0 30px rgba(64,243,72,.12); }
.popular-label { position: absolute; top: -13px; left: 50%; translate: -50%; padding: 6px 16px; border-radius: 20px; background: var(--green); color: #071108; font-size: .7rem; font-weight: 900; white-space: nowrap; }
.pkg-card h3 { margin: 0 0 1rem; }
.pkg-price { color: var(--green); font-family: "Outfit", Arial, sans-serif; font-size: 1.9rem; font-weight: 800; }
.conversion { margin: .3rem 0 1.4rem; color: var(--muted); font-size: .76rem; }
.pkg-card ul { list-style: none; padding: 0; margin: 0 0 1.5rem; flex: 1; }
.pkg-card li { display: flex; gap: 8px; margin: .8rem 0; color: var(--muted-light); font-size: .84rem; line-height: 1.4; }
.pkg-card li i { color: var(--green); margin-top: 2px; }
.delivery-note { display: flex; gap: 12px; margin-top: 2.4rem; padding: 1.2rem 1.5rem; border: 1px solid var(--border); border-left: 3px solid var(--green); border-radius: 14px; background: rgba(255,255,255,.02); }
.delivery-note i { color: var(--green); margin-top: 4px; }
.delivery-note p { margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.7; }

.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.stars { color: var(--green); letter-spacing: .15em; }
.testi-card blockquote { min-height: 13.5rem; margin: 1rem 0 1.25rem; color: var(--muted-light); font-size: .9rem; line-height: 1.7; }
.testi-card strong { display: block; font-size: .9rem; }
.testi-card > span { color: var(--green); font-size: .75rem; }
.quote-section { background: linear-gradient(180deg, #060e07, var(--bg)); }
.quote-wrapper { max-width: 850px; margin: 0 auto; padding: 1.2rem; border: 1px solid var(--border-green); border-radius: 20px; background: rgba(255,255,255,.02); }
.quote-wrapper iframe { border: 0; }

.site-footer { position: relative; padding-top: 5rem; background: linear-gradient(180deg, #060e07, #020503); border-top: 1px solid var(--border); }
.footer-grid { display: grid; grid-template-columns: 2.2fr 1fr 1fr 1.4fr; gap: 3rem; padding-bottom: 4rem; border-bottom: 1px solid var(--border); }
.footer-grid h3 { margin: 0 0 1.3rem; padding-bottom: .7rem; border-bottom: 1px solid var(--border-green); color: var(--green); font-size: .77rem; letter-spacing: .12em; text-transform: uppercase; }
.footer-brand h2 { margin: 0 0 1rem; font-family: "Outfit", Arial, sans-serif; font-size: 1.8rem; }
.footer-brand h2 span { color: var(--green); }
.footer-brand p { max-width: 355px; color: var(--muted); font-size: .9rem; line-height: 1.75; }
.footer-grid ul { list-style: none; padding: 0; margin: 0; }
.footer-grid li, .footer-grid li a { padding: .42rem 0; color: var(--muted); font-size: .88rem; line-height: 1.5; transition: color .2s; }
.footer-grid li a:hover { color: var(--green); }
.socials { display: flex; gap: .7rem; margin-top: 1.5rem; }
.socials a { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--border); border-radius: 12px; color: var(--muted-light); transition: .25s; }
.socials a:hover { background: var(--green); color: #071108; transform: translateY(-3px); }
.footer-bottom { display: flex; justify-content: space-between; padding: 1.5rem 0; color: var(--muted); font-size: .8rem; }
.footer-bottom p { margin: 0; }

.wa-float { position: fixed; right: 25px; bottom: 25px; z-index: 40; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: #25d366; color: #fff; font-size: 1.75rem; box-shadow: 0 6px 22px rgba(37,211,102,.4); transition: .25s; }
.wa-float:hover { transform: scale(1.1); }
.cd-lightbox { position: fixed; inset: 0; z-index: 100; display: grid; place-items: start center; overflow: auto; padding: 5rem 4vw; background: rgba(0,0,0,.94); }
.cd-lightbox > button { position: fixed; top: 22px; right: 25px; z-index: 2; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--border-green); background: #0e160f; color: var(--green); font-size: 1.3rem; cursor: pointer; }
.cd-lightbox img { width: min(1100px, 96vw); height: auto; border-radius: 8px; box-shadow: 0 20px 80px #000; }


.pfolio-page { background: #050a07; color: #fff; }
.pfolio-hero { min-height: 690px; display: grid; place-items: center; padding: 7rem 1.5rem; text-align: center; position: relative; overflow: hidden; background: radial-gradient(circle at 50% 0%, #0a2114, #050a07 70%); border-bottom: 1px solid var(--border); }
.pfolio-hero::after { content: ""; position: absolute; inset: 0; opacity: .45; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 40px 40px; }
.pfolio-hero > div { position: relative; z-index: 1; max-width: 900px; }
.pfolio-hero h1 { margin: 0 0 .7rem; font-family: "Outfit", sans-serif; font-size: clamp(3.2rem, 8vw, 5.2rem); line-height: 1; }
.pfolio-hero h1 span, .pfolio-about h2, .pfolio-title h2, .pfolio-cta h2 span { background: linear-gradient(135deg, #fff 10%, var(--green)); background-clip: text; color: transparent; }
.pfolio-hero h2 { margin: 0 0 1.3rem; font-size: clamp(2rem, 5vw, 2.6rem); }
.pfolio-hero p { max-width: 680px; margin: 0 auto 2.5rem; color: var(--muted-light); font-size: 1.15rem; line-height: 1.7; }
.pfolio-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 1rem; }
.pfolio-about { background: linear-gradient(180deg, #050a07, #0a140d); }
.pfolio-about-grid { display: grid; grid-template-columns: 1fr 2fr; gap: 5rem; align-items: center; }
.pfolio-profile { position: relative; }
.pfolio-profile > div { position: absolute; inset: 20px -10px -10px 20px; border: 2px solid var(--green); border-radius: 20px; opacity: .5; }
.pfolio-profile img { position: relative; z-index: 1; width: min(350px, 100%); aspect-ratio: 627/1006; object-fit: cover; object-position: top; border-radius: 20px; border: 1px solid var(--border); box-shadow: 0 20px 50px rgba(0,0,0,.6); animation: float 6s ease-in-out infinite; }
.pfolio-about h2 { margin: 0 0 1.5rem; font-family: "Outfit", sans-serif; font-size: 2.8rem; }
.pfolio-about p { color: var(--muted-light); font-size: 1.02rem; line-height: 1.8; }
.pfolio-skills { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-top: 2rem; }
.pfolio-skills div { display: grid; place-items: center; gap: .5rem; padding: 1.2rem .5rem; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); font-size: .82rem; font-weight: 700; }
.pfolio-skills i { color: var(--green); font-size: 1.4rem; }
.pfolio-work { background: #050a07; }
.pfolio-title { max-width: 760px; margin-bottom: 4rem; }
.pfolio-title h2 { margin: 0 0 1rem; font-family: "Outfit", sans-serif; font-size: clamp(2.8rem, 7vw, 4.2rem); }
.pfolio-title p { color: var(--muted-light); font-size: 1.08rem; line-height: 1.7; }
.cd-pf__group { margin-bottom: 6rem; }
.cd-pf__group > h3 { margin: 0 0 2rem; padding-left: 1rem; border-left: 4px solid var(--green); font-size: 1.55rem; }
.cd-pf--grouped .cd-pf__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.cd-pf--grouped .cd-pf__grid--web { grid-template-columns: repeat(2, 1fr); }
.cd-pf__card--g { overflow: hidden; border-radius: 18px; background: rgba(18,18,18,.65); border: 1px solid var(--border); backdrop-filter: blur(16px); transition: .35s; }
.cd-pf__card--g:hover { transform: translateY(-7px); border-color: var(--border-green); box-shadow: 0 20px 50px rgba(0,0,0,.45); }
.cd-pf__img--g { position: relative; display: block; width: 100%; height: 260px; padding: 0; overflow: hidden; border: 0; background: #0a120b; cursor: zoom-in; }
.cd-pf__grid--web .cd-pf__img--g { height: 300px; }
.cd-pf__img--g img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .8s, filter .5s; }
.cd-pf__img--g .cd-pf__zoom { position: absolute; inset: 0; display: grid; place-items: center; color: var(--green); font-size: 2rem; opacity: 0; transition: .3s; }
.cd-pf__card--g:hover .cd-pf__img--g img { transform: scale(1.04); filter: brightness(.6); }
.cd-pf__card--g:hover .cd-pf__img--g .cd-pf__zoom { opacity: 1; }
.cd-pf__copy { padding: 1.45rem; }
.cd-pf__copy small { color: var(--green); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cd-pf__copy h4 { margin: .5rem 0; font-size: 1.12rem; }
.cd-pf__copy p { min-height: 4.4rem; margin: 0 0 1rem; color: var(--muted); font-size: .86rem; line-height: 1.65; }
.cd-pf__copy a, .cd-pf__copy button { padding: 0; border: 0; background: none; color: var(--green); font-weight: 800; font-size: .84rem; cursor: pointer; }
.pfolio-cta { padding: 6rem 0; text-align: center; background: radial-gradient(circle at 50% 100%, #0a2114, #050a07 70%); border-top: 1px solid var(--border); }
.pfolio-cta h2 { margin: 0 0 1rem; font-family: "Outfit", sans-serif; font-size: clamp(2.3rem, 6vw, 3.8rem); }
.pfolio-cta p { max-width: 650px; margin: 0 auto 2rem; color: var(--muted-light); }

@media (max-width: 1050px) {
  .nav-links { gap: 1.1rem; }
  .packages-grid { grid-template-columns: repeat(2, 1fr); }
  .service-grid, .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 780px) {
  :root { --header-h: 64px; }
  .section { padding: 4rem 0; }
  .nav-links, .header-cta .btn-outline { display: none; }
  .hamburger { display: block; }
  .logo img { height: 61px; }
  .mobile-menu { position: fixed; inset: var(--header-h) 0 0; z-index: 48; flex-direction: column; justify-content: center; align-items: center; gap: 1.7rem; background: rgba(5,10,7,.98); }
  .mobile-menu.open { display: flex; }
  .mobile-menu a { color: var(--muted-light); font-size: 1.2rem; font-weight: 800; }
  .hero { padding-top: calc(var(--header-h) + 7rem); }
  .about-grid { grid-template-columns: 1fr; gap: 3.5rem; }
  .about-img-wrap { width: min(340px, 90%); margin: auto; }
  .about-img { width: 100%; height: auto; aspect-ratio: 627/1006; }
  .cd-pf__grid--cards, .service-grid, .testimonials-grid { grid-template-columns: 1fr; }
  .testi-card blockquote, .service-card p { min-height: auto; }
  .info-card { align-items: flex-start; flex-direction: column; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .pfolio-about-grid { grid-template-columns: 1fr; gap: 4rem; }
  .pfolio-profile { width: min(350px, 90%); margin: auto; }
  .cd-pf--grouped .cd-pf__grid, .cd-pf--grouped .cd-pf__grid--web { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .container, .header-inner { width: min(100% - 2rem, 1240px); }
  .header-cta .btn-solid { padding: 9px 14px; font-size: .76rem; }
  .hero h1 { font-size: 2.55rem; }
  .hero-sub { font-size: 1rem; }
  .hero-stats { display: grid; grid-template-columns: 1fr 1fr; }
  .trust-grid, .packages-grid, .footer-grid { grid-template-columns: 1fr; }
  .cd-pf__filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .5rem; }
  .cd-pf__filters button { white-space: nowrap; }
  .footer-brand { grid-column: auto; }
  .footer-bottom { flex-direction: column; gap: .7rem; text-align: center; }
  .pfolio-skills { grid-template-columns: repeat(2, 1fr); }
  .pfolio-hero { min-height: 600px; padding-block: 5rem; }
}


svg.cd-i{display:inline-block;vertical-align:-.125em}
.cd-pf__card p{opacity:1}
/* the engine wraps every block in a section; the fixed header must stay above the sections that come after it */
.cx-top{position:relative;z-index:60}
/* the portfolio blocks sit inside the original section spacing */
.cx-list{background:var(--bg);padding:0 0 6rem}
.cx-list>.cd-wrap,.cx-pfwork>.cd-wrap{width:min(1240px,calc(100% - 3rem));max-width:none;margin:0 auto}
/* Tailwind's .container also capped the width at each of its breakpoints; the old site's .container carried those caps, so these wrappers do too */
@media (min-width:40rem){.container,.cx-list>.cd-wrap,.cx-pfwork>.cd-wrap{max-width:40rem}}
@media (min-width:48rem){.container,.cx-list>.cd-wrap,.cx-pfwork>.cd-wrap{max-width:48rem}}
@media (min-width:64rem){.container,.cx-list>.cd-wrap,.cx-pfwork>.cd-wrap{max-width:64rem}}
@media (min-width:80rem){.container,.cx-list>.cd-wrap,.cx-pfwork>.cd-wrap{max-width:80rem}}
@media (min-width:96rem){.container,.cx-list>.cd-wrap,.cx-pfwork>.cd-wrap{max-width:96rem}}
.cx-list .cd-head{display:none}
.cx-pfwork{background:#050a07;padding:0}
.cx-pfwork .cd-head{display:none}
/* the quote form (Tally) keeps its framed box */
.cx-quote{background:linear-gradient(180deg,#060e07,var(--bg));padding:0 0 6rem}
.cx-quote>.cd-wrap{max-width:850px;margin:0 auto;width:calc(100% - 3rem);padding:1.2rem;border:1px solid var(--border-green);border-radius:20px;background:rgba(255,255,255,.02)}
.cx-quote .cd-tally{border:0;width:100%;height:650px;background:#1a1917;border-radius:12px}
.cx-quote .cd-head{display:none}
.cx-quote>.cd-wrap{box-sizing:border-box}
.cx-pfwork{padding-bottom:6rem}
@media (max-width:780px){.cx-list,.cx-quote,.cx-pfwork{padding-bottom:4rem}}
@media (max-width:560px){.cx-list>.cd-wrap,.cx-pfwork>.cd-wrap{width:min(100% - 2rem,1240px)}.cx-quote>.cd-wrap{width:calc(100% - 2rem)}}