@font-face {
  font-family:Manrope;
  src:url('/assets/manrope-latin.woff2') format('woff2');
  font-display:swap;
  font-weight:200 800;
  font-style:normal;
}
:root {
  --bg:#101014;
  --surface:#1b1b22;
  --surface-soft:#25252d;
  --ink:#f6f5f2;
  --muted:#bbb9c4;
  --line:#414149;
  --purple:#a17cff;
  --purple-light:#c3abff;
  --paper:#f6f5f2;
  --paper-ink:#19191f;
  --paper-muted:#56545f;
  --sans:Manrope,Arial,sans-serif;
  --max:1280px;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:2rem;
}
body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:16px/1.65 var(--sans);
  -webkit-font-smoothing:antialiased;
}
button,input,select,textarea {
  font:inherit;
}
img {
  display:block;
  max-width:100%;
  height:auto;
}
a {
  color:inherit;
  text-decoration:none;
}
p {
  margin:0 0 1rem;
  max-width:68ch;
}
h1,h2,h3 {
  margin:0;
  color:inherit;
  font-family:var(--sans);
}
h1,h2 {
  font-weight:700;
  letter-spacing:-.065em;
  text-wrap:balance;
}
h1 {
  font-size:clamp(3.25rem,6vw,6rem);
  line-height:1.05;
}
h2 {
  font-size:clamp(2.4rem,4.4vw,4.65rem);
  line-height:1.1;
}
h3 {
  font-size:1.3rem;
  font-weight:750;
  line-height:1.25;
  letter-spacing:-.035em;
}
h1 em,h2 em {
  color:var(--purple);
  font-style:normal;
  font-weight:inherit;
}
::selection {
  background:var(--purple);
  color:var(--bg);
}
:focus-visible {
  outline:3px solid var(--purple);
  outline-offset:5px;
}
[hidden] {
  display:none!important;
}
.wrap {
  width:min(var(--max),calc(100% - 80px));
  margin-inline:auto;
}
.skip-link {
  position:absolute;
  left:1rem;
  top:-6rem;
  z-index:100;
  padding:.75rem 1rem;
  background:var(--paper);
  color:var(--paper-ink);
  font-weight:700;
}
.skip-link:focus {
  top:1rem;
}
/* Navigation stays quiet so the page can carry the brand. */
.site-header {
  position:relative;
  z-index:30;
  background:var(--bg);
  border-bottom:1px solid var(--line);
}
.header-inner {
  min-height:98px;
  display:flex;
  align-items:center;
  gap:2.3rem;
}
.brand {
  display:inline-flex;
  align-items:center;
  flex:none;
  height:54px;
  overflow:hidden;
}
.brand img {
  width:148px;
  height:auto;
  filter:invert(1) hue-rotate(180deg);
}
.desktop-nav {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:clamp(1rem,1.7vw,1.8rem);
  white-space:nowrap;
}
.desktop-nav a {
  padding:.8rem 0;
  color:#d9d7df;
  font-size:.88rem;
  line-height:1.4;
  font-weight:650;
  transition:color .18s;
}
.desktop-nav a:hover,.desktop-nav a[aria-current=page] {
  color:var(--purple-light);
}
.desktop-nav a[aria-current=page] {
  box-shadow:inset 0 -2px var(--purple);
}
.header-contact {
  margin-left:.2rem;
  display:inline-flex;
  align-items:center;
  gap:.65rem;
  padding:.8rem 1rem;
  border:1px solid #797380;
  font-size:.88rem;
  line-height:1.4;
  font-weight:750;
  white-space:nowrap;
  transition:border-color .18s,background .18s,color .18s;
}
.header-contact:hover {
  border-color:var(--purple);
  background:var(--purple);
  color:var(--bg);
}
.header-contact span {
  font-size:1.05rem;
}
.mobile-menu {
  display:none;
  position:relative;
  margin-left:auto;
}
.mobile-menu summary {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  min-height:44px;
  padding:.45rem 0 .45rem .6rem;
  cursor:pointer;
  list-style:none;
  font-size:1rem;
  font-weight:700;
}
.mobile-menu summary::-webkit-details-marker {
  display:none;
}
.mobile-menu summary span {
  color:var(--purple);
  font-size:1.6rem;
  line-height:1;
  transition:transform .18s;
}
.mobile-menu[open] summary span {
  transform:rotate(45deg);
}
.mobile-nav {
  position:absolute;
  top:calc(100% + 22px);
  right:0;
  z-index:40;
  width:min(350px,calc(100vw - 40px));
  max-height:calc(100dvh - 110px);
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:.65rem 1.35rem;
  background:var(--surface);
  border:1px solid #77707e;
}
.mobile-nav a {
  display:block;
  min-height:48px;
  padding:.85rem 0;
  border-bottom:1px solid var(--line);
  font-size:1rem;
  line-height:1.4;
  font-weight:650;
}
.mobile-nav a:last-child {
  border-bottom:0;
}
.mobile-nav a[aria-current=page],.mobile-nav a:hover,.mobile-nav .mobile-contact {
  color:var(--purple-light);
}
.overline,.hero-kicker {
  color:var(--purple-light);
  font-size:.69rem;
  font-weight:800;
  line-height:1.55;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.overline {
  margin-bottom:1.4rem;
}
.hero-kicker {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.75rem;
  margin-bottom:2.5rem;
}
.hero-kicker span {
  width:28px;
  height:1px;
  background:var(--purple);
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:54px;
  padding:.92rem 1.2rem;
  background:var(--purple);
  border:1px solid transparent;
  color:var(--bg);
  font-size:.95rem;
  line-height:1.3;
  font-weight:800;
  transition:background .18s,color .18s;
}
.button:hover {
  background:var(--purple-light);
}
.button span {
  font-size:1.2em;
}
.button-light {
  background:var(--bg);
  color:var(--ink);
}
.button-light:hover {
  background:#29242e;
  color:var(--ink);
}
.text-link,.inline-arrow {
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  width:fit-content;
  min-height:44px;
  padding:.4rem 0;
  border-bottom:1px solid currentColor;
  font-size:.96rem;
  font-weight:700;
  line-height:1.4;
  transition:color .18s;
}
.text-link:hover,.inline-arrow:hover {
  color:var(--purple-light);
}
.actions {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:1rem 1.5rem;
}
.hero-lead {
  margin-top:1.7rem;
  color:var(--muted);
  font-size:clamp(1rem,1.35vw,1.17rem);
  line-height:1.7;
}
/* The home introduces the work before any sales explanation. */
.home-hero {
  border-bottom:1px solid var(--line);
}
.home-hero-inner {
  padding:clamp(3.5rem,5.2vw,5.5rem) 0 clamp(4.3rem,6.2vw,6rem);
}
.home-hero-layout {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);
  grid-template-areas:'title feature' 'bottom feature';
  column-gap:5%;
  row-gap:2rem;
  align-items:center;
}
.home-hero-layout>h1 {
  grid-area:title;
  max-width:none;
  font-size:clamp(3.25rem,5.7vw,5.25rem);
  line-height:1.07;
  letter-spacing:-.065em;
}
.home-hero-layout>h1 span {
  color:var(--purple);
}
.home-feature {
  grid-area:feature;
  display:block;
  min-width:0;
  align-self:center;
}
.home-feature img {
  width:100%;
  height:auto;
  border:1px solid #57515e;
}
.home-feature>span {
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:.3rem .65rem;
  padding-top:.9rem;
  font-size:.73rem;
  line-height:1.5;
  font-weight:800;
  letter-spacing:.06em;
}
.home-feature small {
  color:var(--muted);
  font-size:.73rem;
  font-weight:500;
  letter-spacing:0;
}
.home-feature b {
  margin-left:auto;
  color:var(--purple-light);
  font-size:1.1rem;
}
.home-feature:hover>span {
  color:var(--purple-light);
}
.home-hero-bottom {
  grid-area:bottom;
  min-width:0;
}
.home-hero-bottom p {
  margin:0;
  max-width:49ch;
  color:var(--muted);
  font-size:1rem;
  line-height:1.7;
}
.home-hero-bottom .actions {
  margin-top:1.7rem;
}
.section {
  padding:clamp(4.5rem,7.8vw,7.5rem) 0;
}
.section-muted {
  background:var(--surface);
}
.section-headline {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.68fr);
  align-items:end;
  gap:.8rem 9%;
  margin-bottom:3rem;
}
.section-headline .overline {
  grid-column:1/-1;
  margin-bottom:.45rem;
}
.section-headline h2 {
  max-width:17ch;
}
.section-headline>p:not(.overline) {
  margin:0;
  color:var(--muted);
  font-size:1rem;
}
.home-work {
  background:var(--surface);
}
.example-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2rem;
  margin-bottom:1.6rem;
}
.example-link {
  display:block;
  min-width:0;
}
.example-link img {
  width:100%;
  height:auto;
  border:1px solid #56515d;
}
.example-link>span {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 0 .9rem;
  border-bottom:1px solid var(--line);
  font-size:1.15rem;
  font-weight:700;
}
.example-link b {
  color:var(--purple);
  font-size:1.4rem;
  font-weight:500;
}
.example-link:hover>span {
  color:var(--purple-light);
}
.home-about {
  background:var(--paper);
  color:var(--paper-ink);
  padding:clamp(4.5rem,7.8vw,7.5rem) 0;
}
.home-about .overline {
  color:#6843aa;
}
.home-about .about-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.68fr);
  gap:9%;
  align-items:start;
}
.about-grid h2 {
  max-width:16ch;
}
.about-grid p {
  color:var(--paper-muted);
  font-size:1.06rem;
}
.about-grid strong {
  color:var(--paper-ink);
  font-weight:750;
}
.home-about .inline-arrow,.home-about .text-link {
  color:#6843aa;
}
.home-about .inline-arrow:hover,.home-about .text-link:hover {
  color:#3d216d;
}
.home-about :focus-visible {
  outline-color:#6843aa;
}
.area-list {
  border-top:1px solid var(--line);
}
.area-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.7fr) 2rem;
  gap:2rem;
  align-items:center;
  padding:1.4rem 0;
  min-height:116px;
  border-bottom:1px solid var(--line);
}
.area-name {
  font-size:clamp(1.8rem,3.35vw,3.4rem);
  font-weight:650;
  letter-spacing:-.055em;
  line-height:1.15;
  transition:color .18s;
}
.area-description {
  color:var(--muted);
  font-size:1rem;
  line-height:1.5;
}
.area-arrow {
  justify-self:end;
  color:var(--purple);
  font-size:1.7rem;
  line-height:1;
}
.area-row:hover .area-name {
  color:var(--purple-light);
}
.home-process,.linked-section {
  background:var(--surface);
}
.linked-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:8%;
}
.linked-grid h2 {
  max-width:13ch;
}
.linked-list {
  align-self:end;
  border-top:1px solid var(--line);
}
.linked-list a {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:.2rem 1rem;
  align-items:end;
  padding:1.2rem 0;
  border-bottom:1px solid var(--line);
}
.linked-list a>span:first-child {
  grid-column:1/-1;
  color:var(--muted);
  font-size:.75rem;
  font-weight:600;
}
.linked-list strong {
  font-size:1.3rem;
  font-weight:750;
}
.linked-list a>span:last-child {
  color:var(--purple);
  font-size:1.5rem;
}
.linked-list a:hover strong {
  color:var(--purple-light);
}
.contact-band {
  padding:clamp(4.3rem,7.5vw,7rem) 0;
  background:var(--purple);
  color:var(--bg);
}
.contact-grid {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:3rem;
}
.contact-grid>div {
  min-width:0;
}
.contact-grid .overline {
  color:#302348;
}
.contact-grid h2 {
  max-width:17ch;
}
.contact-grid p:not(.overline) {
  margin:1.4rem 0 0;
  max-width:55ch;
  color:#302348;
  font-size:1rem;
}
.contact-grid .button {
  flex:none;
  margin-bottom:.35rem;
}
.contact-band :focus-visible {
  outline-color:var(--bg);
}
/* Service pages answer a practical question at each section. */
.page-hero {
  border-bottom:1px solid var(--line);
}
.page-hero .wrap {
  padding-top:2rem;
}
.breadcrumb {
  display:flex;
  align-items:center;
  gap:.6rem;
  margin-bottom:3.5rem;
  color:var(--muted);
  font-size:.8rem;
  line-height:1.5;
}
.breadcrumb a {
  border-bottom:1px solid #807887;
  padding:.25rem 0;
}
.breadcrumb a:hover {
  color:var(--purple-light);
}
.page-hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(0,.65fr);
  align-items:end;
  gap:9%;
  padding-bottom:clamp(4rem,6.8vw,6.5rem);
}
.page-hero h1 {
  max-width:15ch;
}
.page-hero .hero-lead {
  max-width:55ch;
}
.page-hero .actions {
  margin-top:2rem;
}
.hero-aside,.portfolio-disclosure {
  align-self:end;
  border-left:2px solid var(--purple);
  padding:.1rem 0 .2rem 1.5rem;
}
.hero-aside>span {
  display:block;
  margin-bottom:1.4rem;
  color:var(--purple-light);
  font-size:.69rem;
  font-weight:800;
  letter-spacing:.12em;
}
.hero-aside>strong {
  display:block;
  font-size:clamp(1.7rem,2.65vw,2.65rem);
  font-weight:700;
  line-height:1.16;
  letter-spacing:-.05em;
}
.hero-aside>p {
  margin:1.4rem 0 0;
  color:var(--muted);
  font-size:1rem;
}
.hero-aside b {
  color:var(--purple-light);
}
.portfolio-disclosure strong {
  font-size:1rem;
}
.portfolio-disclosure p {
  margin:.65rem 0 0;
  color:var(--muted);
  font-size:1rem;
}
.intro-grid {
  display:grid;
  grid-template-columns:minmax(0,.38fr) minmax(0,1fr);
  gap:9%;
}
.intro-grid h2 {
  max-width:17ch;
}
.intro-grid p:not(.overline) {
  margin-top:1.5rem;
  color:var(--muted);
}
.intro-grid .inline-arrow {
  margin-top:1.4rem;
}
.rule-list {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:2.7rem;
  border-top:1px solid var(--line);
}
.rule-list span {
  padding:1rem 1.1rem .3rem 0;
  border-right:1px solid var(--line);
  font-size:.95rem;
  font-weight:700;
}
.rule-list span+span {
  padding-left:1.1rem;
}
.rule-list span:last-child {
  border-right:0;
}
.sites-hero .breadcrumb,.grafica-intro .breadcrumb,.pg-hero .breadcrumb,.portfolio-intro .breadcrumb {
  margin-bottom:2.5rem;
}
.sites-hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.85fr);
  align-items:center;
  gap:6%;
  padding-bottom:clamp(3.7rem,6.5vw,6rem);
}
.sites-hero h1 {
  max-width:13ch;
  font-size:clamp(3rem,5.05vw,5.35rem);
}
.sites-hero .actions {
  margin-top:2rem;
}
.sites-hero-preview {
  display:block;
  min-width:0;
}
.sites-hero-preview img {
  width:100%;
  height:auto;
  border:1px solid #57515e;
}
.sites-hero-preview span {
  display:block;
  padding-top:.85rem;
  color:var(--muted);
  font-size:.79rem;
  line-height:1.5;
}
/* Two readable choices; prices remain part of the explanation. */
.plan-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.5rem;
}
.plan {
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:clamp(1.6rem,3vw,2.8rem);
  background:var(--paper);
  color:var(--paper-ink);
  border-top:4px solid var(--purple);
}
.plan+.plan {
  background:#e8defd;
}
.plan-top {
  display:flex;
  align-items:start;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.4rem .8rem;
  color:#604092;
  font-size:.69rem;
  line-height:1.5;
  font-weight:800;
  letter-spacing:.08em;
}
.plan h3 {
  margin:1.6rem 0 .8rem;
  font-size:clamp(1.8rem,2.7vw,2.7rem);
  font-weight:750;
  line-height:1.15;
  letter-spacing:-.055em;
}
.plan>p:not(.plan-renewal) {
  min-height:3rem;
  margin-bottom:0;
  color:var(--paper-muted);
  font-size:1rem;
}
.plan-price {
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:.35rem .8rem;
  margin:1.9rem 0 1.7rem;
}
.plan-price strong {
  font-size:clamp(2.9rem,4.2vw,4.1rem);
  font-weight:800;
  line-height:1.05;
  letter-spacing:-.065em;
}
.plan-price span {
  color:var(--paper-muted);
  font-size:1rem;
}
.plan ul {
  margin:0 0 1.7rem;
  padding:0;
  list-style:none;
  border-top:1px solid #b6b3bd;
}
.plan li {
  position:relative;
  padding:.9rem 0 .9rem 1.15rem;
  border-bottom:1px solid #b6b3bd;
  font-size:.95rem;
  line-height:1.55;
}
.plan li::before {
  content:'—';
  position:absolute;
  left:0;
  color:#6843aa;
  font-size:.7rem;
  font-weight:800;
  top:1.08rem;
}
.plan-renewal {
  margin-top:auto;
  margin-bottom:1rem;
  font-size:.93rem;
  line-height:1.6;
}
.plan .button {
  align-self:flex-start;
  margin-top:.7rem;
  background:var(--bg);
  color:var(--ink);
}
.plan .button:hover {
  background:#38313f;
}
.plan :focus-visible {
  outline-color:#6843aa;
}
.fineprint {
  max-width:105ch;
  margin:1.6rem 0 0;
  color:var(--muted);
  font-size:.81rem;
  line-height:1.75;
}
.offer-list {
  border-top:1px solid var(--line);
}
.offer-list article {
  display:grid;
  grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr) minmax(0,1fr);
  gap:4%;
  padding:2rem 0;
  border-bottom:1px solid var(--line);
}
.offer-list article>span {
  color:var(--purple-light);
  font-size:.69rem;
  line-height:1.55;
  font-weight:800;
  letter-spacing:.08em;
}
.offer-list h3 {
  margin-bottom:.75rem;
  font-size:1.85rem;
  font-weight:700;
  letter-spacing:-.05em;
}
.offer-list p {
  margin:0;
  color:var(--muted);
  font-size:1rem;
}
.offer-list strong {
  display:block;
  margin-bottom:.7rem;
  font-size:1.15rem;
}
.offer-list a {
  display:inline-block;
  padding:.4rem 0;
  margin-top:.6rem;
  border-bottom:1px solid currentColor;
  font-size:1rem;
  font-weight:700;
}
.offer-list a:hover {
  color:var(--purple-light);
}
.steps {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2.5rem;
  margin:3rem 0 0;
  padding:0;
  list-style:none;
}
.steps li {
  border-top:1px solid #756b83;
  padding-top:1.4rem;
}
.steps li>span {
  color:var(--purple);
  font-size:1.25rem;
  font-weight:650;
  line-height:1.4;
  letter-spacing:-.05em;
}
.steps h3 {
  margin:1.3rem 0 .75rem;
  font-size:1.25rem;
}
.steps p {
  margin:0;
  color:var(--muted);
  font-size:1rem;
}
.faq-grid {
  display:grid;
  grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr);
  gap:10%;
}
.faq-list {
  border-top:1px solid var(--line);
}
.faq-list details {
  border-bottom:1px solid var(--line);
}
.faq-list summary {
  position:relative;
  min-height:64px;
  padding:1.2rem 2.5rem 1.2rem 0;
  cursor:pointer;
  list-style:none;
  font-size:1rem;
  line-height:1.5;
  font-weight:700;
}
.faq-list summary::-webkit-details-marker {
  display:none;
}
.faq-list summary::after {
  content:'+';
  position:absolute;
  right:.25rem;
  top:1rem;
  color:var(--purple);
  font-size:1.5rem;
  font-weight:500;
}
.faq-list details[open] summary::after {
  content:'−';
}
.faq-list p {
  padding:.1rem 2.5rem 1.4rem 0;
  margin:0;
  color:var(--muted);
  font-size:1rem;
}
.status-strip,.pg-state {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.75rem;
  padding:1rem 0;
  margin-top:2.3rem;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  font-size:1rem;
}
.status-dot {
  width:.55rem;
  height:.55rem;
  flex:none;
  border-radius:50%;
  background:var(--purple);
}
.status-strip>span:last-child,.pg-state>span:last-child {
  margin-left:auto;
  color:var(--muted);
}
.compact-cta {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:3rem;
}
.compact-cta h2 {
  max-width:13ch;
}
.compact-cta p {
  max-width:40ch;
  color:var(--muted);
}
.service-columns,.contact-details {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--line);
}
.service-columns article,.contact-details>div {
  padding:1.6rem 1.7rem 0 0;
  border-right:1px solid var(--line);
}
.service-columns article+article,.contact-details>div+div {
  padding-left:1.7rem;
}
.service-columns article:last-child,.contact-details>div:last-child {
  border-right:0;
}
.service-columns span,.contact-details span {
  display:block;
  margin-bottom:1.7rem;
  color:var(--purple-light);
  font-size:.69rem;
  font-weight:800;
  letter-spacing:.1em;
}
.service-columns h3 {
  margin-bottom:.75rem;
  font-size:1.75rem;
  font-weight:700;
}
.service-columns p,.contact-details p {
  color:var(--muted);
  font-size:1rem;
}
.contact-details .button {
  margin-top:.8rem;
}
.grafica-intro,.pg-hero,.portfolio-intro {
  border-bottom:1px solid var(--line);
}
.grafica-intro .wrap,.pg-hero .wrap,.portfolio-intro .wrap {
  padding-top:2rem;
}
.grafica-intro-row {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
  align-items:end;
  gap:8%;
  padding-bottom:clamp(3.7rem,6vw,6rem);
}
.grafica-intro h1 {
  max-width:11ch;
  font-size:clamp(3.4rem,6.5vw,6.5rem);
}
.grafica-intro-row>div:last-child p {
  color:var(--muted);
  font-size:1.08rem;
}
.grafica-intro-row .inline-arrow {
  margin-top:.65rem;
}
.grafica-prices {
  padding-top:clamp(3.5rem,6vw,6rem);
}
.price-table {
  border-top:1px solid var(--line);
}
.price-table>div {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:1.5rem;
  padding:1.2rem 0;
  border-bottom:1px solid var(--line);
}
.price-table>div span {
  font-size:clamp(1rem,1.35vw,1.12rem);
}
.price-table strong {
  color:var(--purple-light);
  font-size:clamp(1.4rem,2.1vw,2rem);
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.05em;
  text-align:right;
}
.grafica-order-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.8fr);
  gap:8%;
}
.grafica-order-grid h2 {
  max-width:16ch;
}
.grafica-order-grid p {
  color:var(--muted);
}
.grafica-order-grid .button {
  margin-top:.8rem;
}
.pg-hero-inner {
  max-width:960px;
  padding:1.5rem 0 4.5rem;
}
.pg-hero h1 {
  max-width:17ch;
  font-size:clamp(3.4rem,5.6vw,6rem);
}
.pg-hero-inner>p:not(.overline) {
  max-width:66ch;
  margin:1.8rem 0 0;
  color:var(--muted);
  font-size:1.08rem;
}
.pg-detail-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.85fr);
  gap:9%;
}
.pg-detail-grid h2 {
  max-width:15ch;
  overflow-wrap:anywhere;
}
.pg-detail-grid>div:last-child p {
  color:var(--muted);
}
.portfolio-intro-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.66fr);
  align-items:end;
  gap:8%;
  padding-bottom:clamp(3.2rem,4.8vw,4.8rem);
}
.portfolio-intro h1 {
  max-width:15ch;
  font-size:clamp(3rem,4.8vw,5rem);
}
.portfolio-intro-row>p {
  margin:0;
  color:var(--muted);
  font-size:1rem;
}
.portfolio-work {
  padding:clamp(2.7rem,4.8vw,4.8rem) 0 clamp(4.5rem,7vw,7rem);
}
.portfolio-filters {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.6rem;
  margin-bottom:2.5rem;
}
.portfolio-filters button {
  min-height:44px;
  padding:.6rem 1rem;
  border:1px solid #77707e;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font-size:.95rem;
  font-weight:650;
  line-height:1.35;
  transition:background .18s,color .18s,border-color .18s;
}
.portfolio-filters button:hover {
  border-color:var(--purple-light);
  color:var(--purple-light);
}
.portfolio-filters button[aria-pressed=true],.portfolio-filters button.active {
  border-color:var(--purple);
  background:var(--purple);
  color:var(--bg);
}
.models-grid {
  display:grid;
  grid-template-columns:1fr;
}
.model-card {
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(0,.55fr);
  align-items:center;
  gap:clamp(1.8rem,5vw,4.5rem);
  min-width:0;
  padding:clamp(2.3rem,4.8vw,4rem) 0;
  border-bottom:1px solid var(--line);
}
.model-card:first-child {
  padding-top:0;
}
.model-preview {
  display:block;
  min-width:0;
  background:var(--surface-soft);
}
.model-preview img {
  width:100%;
  height:auto;
  border:1px solid #57515e;
}
.model-info {
  min-width:0;
}
.model-info>span {
  display:block;
  color:var(--purple-light);
  font-size:.69rem;
  font-weight:800;
  line-height:1.6;
  letter-spacing:.08em;
}
.model-info h2 {
  margin:.9rem 0 1rem;
  font-size:clamp(2rem,2.9vw,3.1rem);
  font-weight:700;
  line-height:1.1;
}
.model-info p {
  margin-bottom:1.2rem;
  color:var(--muted);
  font-size:1rem;
}
.model-info a {
  font-size:1rem;
  font-weight:700;
}
.model-info a:hover {
  color:var(--purple-light);
}
.work-showcase {
  background:var(--surface);
  padding:clamp(2.5rem,3.4vw,3.4rem) 0 clamp(4rem,7vw,7rem);
}
.showcase-image {
  display:block;
  background:var(--surface-soft);
}
.showcase-image picture,.showcase-image img {
  display:block;
  width:100%;
}
.showcase-image img {
  height:auto;
}
.showcase-caption {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.67fr);
  gap:9%;
  padding-top:2.1rem;
}
.showcase-caption h2 {
  max-width:18ch;
  font-size:clamp(2.2rem,3.4vw,3.6rem);
}
.showcase-caption p:not(.overline) {
  margin-top:.2rem;
  color:var(--muted);
  font-size:1rem;
}
.showcase-caption .inline-arrow {
  margin-top:.8rem;
}
.site-footer {
  background:#0a0a0e;
  padding:4.5rem 0 1.5rem;
}
.footer-top {
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,.75fr);
  gap:3rem;
}
.footer-brand {
  display:inline-flex;
  align-items:center;
  height:54px;
  overflow:hidden;
  font-size:2rem;
  font-weight:800;
  letter-spacing:-.08em;
  line-height:1;
}
.footer-brand img {
  width:150px;
  height:auto;
  filter:invert(1) hue-rotate(180deg);
}
.footer-brand span {
  color:var(--purple);
}
.footer-top p {
  margin-top:1.4rem;
  color:var(--muted);
  font-size:.95rem;
}
.footer-nav {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-content:start;
  gap:.4rem 1rem;
}
.footer-nav a,.footer-social a {
  width:fit-content;
  min-height:32px;
  padding:.2rem 0;
  font-size:.95rem;
  font-weight:650;
}
.footer-nav a:hover,.footer-social a:hover {
  color:var(--purple-light);
}
.footer-social {
  display:flex;
  flex-direction:column;
  gap:.4rem;
}
.footer-bottom {
  display:flex;
  align-items:start;
  justify-content:space-between;
  gap:1rem;
  margin-top:3.5rem;
  padding-top:1.3rem;
  border-top:1px solid var(--line);
  color:#aaa5b3;
  font-size:.8rem;
  line-height:1.5;
}
@media(max-width:1050px) {
  .desktop-nav {
    display:none;
  }
  .mobile-menu {
    display:block;
  }
  .header-contact {
    margin-left:auto;
  }
  .header-inner {
    gap:2rem;
  }
  .home-hero-layout {
    grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr);
    column-gap:4%;
  }
  .home-hero-layout>h1 {
    font-size:clamp(3rem,5.5vw,4.8rem);
  }
  .home-hero-bottom .actions {
    gap:.8rem 1.2rem;
  }
  .plan {
    padding:1.7rem;
  }
  .contact-grid {
    gap:2rem;
  }
  .contact-grid h2 {
    font-size:clamp(2.4rem,4.8vw,4.5rem);
  }
}
@media(max-width:820px) {
  .wrap {
    width:calc(100% - 48px);
  }
  .header-inner {
    min-height:86px;
  }
  .home-hero-layout {
    grid-template-columns:1fr;
    grid-template-areas:'title' 'feature' 'bottom';
    row-gap:2rem;
  }
  .home-hero-layout>h1 {
    font-size:clamp(3.5rem,8.5vw,5rem);
  }
  .home-feature {
    max-width:680px;
  }
  .home-hero-bottom p {
    max-width:55ch;
  }
  .section-headline,.home-about .about-grid,.page-hero-grid,.linked-grid,.intro-grid,.faq-grid,.sites-hero-grid,.grafica-intro-row,.grafica-order-grid,.pg-detail-grid,.portfolio-intro-row,.showcase-caption {
    grid-template-columns:1fr;
    gap:1.7rem;
  }
  .section-headline .overline {
    grid-column:auto;
  }
  .section-headline h2 {
    max-width:19ch;
  }
  .section-headline>p:not(.overline) {
    max-width:58ch;
  }
  .page-hero-grid {
    gap:3rem;
  }
  .page-hero h1 {
    max-width:16ch;
  }
  .hero-aside,.portfolio-disclosure {
    max-width:45ch;
  }
  .sites-hero h1 {
    max-width:16ch;
    font-size:clamp(3.2rem,7vw,4.8rem);
  }
  .sites-hero-preview {
    max-width:650px;
    margin-top:.5rem;
  }
  .about-grid h2 {
    max-width:18ch;
  }
  .about-grid p {
    max-width:58ch;
  }
  .compact-cta,.contact-grid {
    display:block;
  }
  .contact-grid .button {
    margin-top:2rem;
  }
  .contact-grid h2 {
    max-width:19ch;
  }
  .offer-list article {
    grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
    gap:1rem 5%;
  }
  .offer-list article>span {
    grid-column:1/-1;
  }
  .model-card {
    grid-template-columns:1fr;
    gap:1.5rem;
  }
  .model-info h2 {
    font-size:2.6rem;
  }
  .model-info p {
    max-width:55ch;
  }
  .grafica-intro-row h1 {
    max-width:13ch;
  }
  .footer-top {
    grid-template-columns:1fr 1fr;
    gap:2rem;
  }
  .footer-top>div:first-child {
    grid-column:1/-1;
  }
}
@media(max-width:650px) {
  .wrap {
    width:calc(100% - 40px);
  }
  .header-inner {
    min-height:78px;
    gap:1rem;
  }
  .brand img {
    width:134px;
  }
  .header-contact {
    display:none;
  }
  .mobile-menu {
    margin-left:auto;
  }
  .mobile-nav {
    top:calc(100% + 17px);
  }
  .home-hero-inner {
    padding:2.8rem 0 3.6rem;
  }
  .home-hero .hero-kicker {
    margin-bottom:1.7rem;
  }
  .home-hero-layout {
    row-gap:1.8rem;
  }
  .home-hero-layout>h1 {
    font-size:clamp(2.1rem,10.5vw,4.1rem);
    line-height:1.12;
    letter-spacing:-.065em;
  }
  .home-feature>span {
    gap:.15rem .65rem;
  }
  .home-feature small {
    flex-basis:100%;
    order:2;
  }
  .home-feature b {
    order:1;
  }
  .home-hero-bottom .actions {
    margin-top:1.5rem;
    gap:.75rem 1.5rem;
  }
  .button {
    min-height:52px;
    padding:.85rem 1rem;
    font-size:.95rem;
  }
  .section,.home-about {
    padding:4rem 0;
  }
  .section-headline {
    margin-bottom:2.4rem;
    gap:.9rem;
  }
  .overline {
    margin-bottom:1.2rem;
  }
  h2 {
    font-size:clamp(2.05rem,8.6vw,3.5rem);
  }
  .section-headline .overline {
    margin-bottom:.35rem;
  }
  .area-row {
    grid-template-columns:minmax(0,1fr) 1.5rem;
    gap:.7rem 1rem;
    min-height:0;
    padding:1.6rem 0;
  }
  .area-name {
    font-size:clamp(1.8rem,7vw,2.6rem);
  }
  .area-description {
    grid-column:1;
    grid-row:2;
    font-size:1rem;
  }
  .area-arrow {
    grid-column:2;
    grid-row:1/3;
  }
  .page-hero .wrap,.grafica-intro .wrap,.pg-hero .wrap,.portfolio-intro .wrap {
    padding-top:1.3rem;
  }
  .breadcrumb {
    font-size:.8rem;
  }
  .sites-hero .breadcrumb,.grafica-intro .breadcrumb,.pg-hero .breadcrumb,.portfolio-intro .breadcrumb {
    margin-bottom:1.7rem;
  }
  .page-hero h1,.sites-hero h1,.portfolio-intro h1,.pg-hero h1 {
    font-size:clamp(2.55rem,10.3vw,4rem);
  }
  .page-hero-grid,.sites-hero-grid {
    padding-bottom:3.4rem;
  }
  .hero-lead {
    margin-top:1.5rem;
  }
  .example-grid,.rule-list,.plan-grid,.steps,.service-columns,.contact-details {
    grid-template-columns:1fr;
  }
  .example-grid {
    gap:1.8rem;
  }
  .example-link>span {
    font-size:1.1rem;
  }
  .rule-list span,.rule-list span+span {
    padding:.75rem 0;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .plan-grid {
    gap:1.4rem;
  }
  .plan {
    padding:1.6rem;
  }
  .plan h3 {
    font-size:2rem;
  }
  .plan-price strong {
    font-size:3.3rem;
  }
  .plan>p:not(.plan-renewal) {
    min-height:auto;
  }
  .plan li {
    font-size:.95rem;
  }
  .offer-list article {
    grid-template-columns:1fr;
    gap:1.1rem;
    padding:1.8rem 0;
  }
  .offer-list article>span {
    grid-column:auto;
  }
  .offer-list h3 {
    font-size:1.7rem;
  }
  .steps {
    gap:1.7rem;
    margin-top:2.2rem;
  }
  .steps li {
    display:grid;
    grid-template-columns:2rem minmax(0,1fr);
    gap:1rem;
    padding-top:1.3rem;
  }
  .steps h3 {
    margin-top:0;
  }
  .faq-grid {
    gap:2rem;
  }
  .faq-list summary {
    padding-right:2rem;
  }
  .faq-list p {
    padding-right:.5rem;
  }
  .service-columns article,.service-columns article+article,.contact-details>div,.contact-details>div+div {
    padding:1.3rem 0;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .service-columns article:last-child,.contact-details>div:last-child {
    border-bottom:0;
  }
  .service-columns span,.contact-details span {
    margin-bottom:.7rem;
  }
  .grafica-intro h1 {
    font-size:clamp(3rem,12vw,4.5rem);
  }
  .grafica-intro-row,.portfolio-intro-row {
    padding-bottom:3.3rem;
  }
  .price-table>div {
    gap:1rem;
    align-items:center;
  }
  .price-table>div span {
    flex:1 1 50%;
  }
  .price-table strong {
    max-width:47%;
    flex:0 1 auto;
    font-size:1.4rem;
  }
  .pg-hero-inner {
    padding:.5rem 0 3.5rem;
  }
  .pg-hero-inner>p:not(.overline) {
    font-size:1rem;
  }
  .pg-state>span:last-child,.status-strip>span:last-child {
    flex-basis:100%;
    margin-left:1.3rem;
  }
  .portfolio-work {
    padding-top:1.7rem;
  }
  .portfolio-filters {
    gap:.5rem;
    margin-bottom:1.8rem;
  }
  .portfolio-filters button {
    padding:.55rem .8rem;
    font-size:.9rem;
  }
  .model-card {
    padding:2.2rem 0;
    gap:1.4rem;
  }
  .model-info h2 {
    font-size:2.25rem;
  }
  .contact-band {
    padding:4rem 0;
  }
  .contact-grid h2 {
    font-size:clamp(2.05rem,8.6vw,3.5rem);
  }
  .work-showcase {
    padding:2rem 0 4rem;
  }
  .showcase-caption {
    padding-top:1.5rem;
  }
  .site-footer {
    padding-top:3.5rem;
  }
  .footer-nav a,.footer-social a {
    min-height:44px;
    padding:.5rem 0;
    font-size:.92rem;
  }
  .footer-bottom {
    display:block;
    margin-top:2.5rem;
  }
  .footer-bottom span {
    display:block;
  }
  .footer-bottom span+span {
    margin-top:.55rem;
  }
}
@media(max-width:370px) {
  .wrap {
    width:calc(100% - 36px);
  }
  .mobile-nav {
    width:calc(100vw - 36px);
  }
  .home-hero-layout>h1 {
    font-size:10.6vw;
  }
  .home-hero .hero-kicker {
    font-size:.66rem;
    gap:.55rem;
  }
  .page-hero h1,.sites-hero h1,.portfolio-intro h1,.pg-hero h1 {
    font-size:2.4rem;
  }
  .plan {
    padding:1.3rem;
  }
  .plan h3 {
    font-size:1.8rem;
  }
  .plan .button {
    align-self:stretch;
    gap:.6rem;
  }
  .footer-top {
    gap:1.7rem 1rem;
  }
  .footer-nav {
    grid-template-columns:1fr;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}