/* Stack Page — site comercial premium
   Arquivo único, sem framework. Ajuste as variáveis abaixo para rebranding. */

:root {
  --ink: #eef1f5;
  --muted: #a7afbd;
  --soft: #747e8f;
  --bg: #070910;
  --bg-2: #0b0f18;
  --panel: rgba(17, 22, 33, .78);
  --panel-solid: #101621;
  --line: rgba(255,255,255,.105);
  --line-strong: rgba(221,180,111,.34);
  --gold: #ddb46f;
  --gold-2: #f2d49a;
  --gold-dark: #8f6935;
  --green: #478b70;
  --red: #85434a;
  --blue: #315d80;
  --navy: #102b46;
  --radius-sm: 12px;
  --radius: 22px;
  --radius-lg: 34px;
  --shadow: 0 28px 80px rgba(0,0,0,.42);
  --container: min(1180px, calc(100vw - 44px));
  --serif: Georgia, "Times New Roman", serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background:
    radial-gradient(circle at 70% 4%, rgba(49,93,128,.16), transparent 31rem),
    radial-gradient(circle at 7% 28%, rgba(143,105,53,.08), transparent 29rem),
    var(--bg);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
button { color: inherit; }
::selection { color: #090b0f; background: var(--gold-2); }

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; z-index: 1000; top: 12px; left: 12px;
  padding: 10px 14px; border-radius: 8px;
  color: #080b12; background: var(--gold-2);
  transform: translateY(-150%);
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }

.container { width: var(--container); margin-inline: auto; }
.section { position: relative; padding: 118px 0; }
.scroll-progress {
  position: fixed; z-index: 220; inset: 0 0 auto;
  height: 3px; pointer-events: none;
  background: linear-gradient(90deg, var(--gold-dark), var(--gold-2), #7ea6c8);
  box-shadow: 0 0 18px rgba(221,180,111,.34);
  transform: scaleX(0); transform-origin: 0 50%;
  will-change: transform;
}
.ambient {
  position: fixed; z-index: -1;
  width: 38rem; aspect-ratio: 1; border-radius: 50%;
  filter: blur(120px); opacity: .08; pointer-events: none;
}
.ambient--one { top: 5vh; right: -22rem; background: #6189ac; }
.ambient--two { bottom: -22rem; left: -22rem; background: #c18d46; }

.site-header {
  position: fixed; z-index: 100;
  inset: 0 0 auto;
  border-bottom: 1px solid transparent;
  transition: background .25s ease, border-color .25s ease, backdrop-filter .25s ease;
}
.site-header.is-scrolled {
  background: rgba(7,9,16,.82);
  border-color: var(--line);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}
.header-inner {
  min-height: 82px;
  display: flex; align-items: center; gap: 32px;
}
.brand {
  display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto;
  border-radius: 10px; transform-origin: left center;
}
.site-header .brand { position:relative; z-index:3; }
.brand-logo-mark {
  width: 48px; height: 50px; flex: 0 0 auto; object-fit: contain;
  filter: drop-shadow(0 7px 15px rgba(20,77,172,.2));
  transform-origin: 50% 52%; will-change: transform;
}
.brand-copy { display: grid; line-height: 1.08; }
.brand-copy strong {
  font-size: .88rem; letter-spacing: .2em; font-weight: 600;
  background: linear-gradient(90deg,#f3e3c1 0%,#d9b372 48%,#8ab4ff 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.brand-copy small { margin-top: 4px; color: var(--gold); font-size: .55rem; letter-spacing: .16em; text-transform: uppercase; }

.site-nav { margin-left: auto; display: flex; align-items: center; gap: 27px; }
.site-nav a {
  position: relative; color: #c9ced7;
  font-size: .78rem; font-weight: 650; letter-spacing: .05em;
}
.site-nav a::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: -8px;
  height: 1px; background: var(--gold); transition: right .2s ease;
}
.site-nav a:hover::after, .site-nav a:focus-visible::after { right: 0; }
.menu-toggle { display: none; }
.button {
  min-height: 52px;
  display: inline-flex; align-items: center; justify-content: center; gap: 14px;
  padding: 0 22px; border: 1px solid transparent; border-radius: 10px;
  font-size: .78rem; font-weight: 750; letter-spacing: .045em;
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button:focus-visible, .circle-button:focus-visible, .project-tab:focus-visible,
.filter:focus-visible, .scroll-preview:focus-visible, .browser-expand:focus-visible,
.modal-close:focus-visible, .menu-toggle:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 2px solid var(--gold-2); outline-offset: 3px;
}
.button--compact { min-height: 44px; padding: 0 17px; }
.button--gold {
  color: #14100a;
  background: linear-gradient(135deg, var(--gold-2), var(--gold));
  box-shadow: 0 12px 28px rgba(221,180,111,.13);
}
.button--gold:hover { box-shadow: 0 16px 35px rgba(221,180,111,.22); }
.button--ghost { color: var(--ink); border-color: var(--line); background: rgba(255,255,255,.025); }
.button--ghost:hover { border-color: var(--line-strong); background: rgba(221,180,111,.05); }
.button--full { width: 100%; }
.header-cta { margin-left: 2px; }

:where(a[href], button, summary, input, select, textarea, .scroll-preview, .choice) {
  -webkit-tap-highlight-color: transparent;
}
:where(a[href], button, summary, .scroll-preview, .choice) { touch-action: manipulation; }
:where(a[href], button, summary, .scroll-preview, .choice):active { scale:.985; transition-duration:.08s; }
.site-nav a, .footer-links a, .text-link, .contact-details a, .faq-list summary, .choice span {
  transition: color .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease, opacity .2s ease;
}
.site-nav a:hover, .site-nav a:focus-visible, .footer-links a:hover, .footer-links a:focus-visible { color: var(--ink); }
.text-link:hover, .text-link:focus-visible, .contact-details a:hover, .contact-details a:focus-visible { color: var(--gold-2); }
.faq-list summary:hover, .faq-list summary:focus-visible { color: var(--ink); background: rgba(221,180,111,.018); }
.choice:hover span { border-color: rgba(221,180,111,.28); background: rgba(221,180,111,.025); }
input:focus, select:focus, textarea:focus {
  border-color: rgba(221,180,111,.55); background:#0c121b;
  box-shadow: 0 0 0 4px rgba(221,180,111,.055);
}

.hero { min-height: 890px; padding-top: 152px; padding-bottom: 58px; overflow: clip; }
.hero::after {
  content:""; position:absolute; left:50%; top:2%; z-index:-1;
  width: 62rem; height: 46rem;
  background: radial-gradient(ellipse, rgba(47,86,120,.14), transparent 67%);
  transform: translateX(-10%);
}
.hero-grid {
  display: grid; grid-template-columns: minmax(0, .87fr) minmax(520px, 1.13fr);
  gap: clamp(50px, 7vw, 105px); align-items: center;
}
.hero-copy { padding-top: 4px; }
.eyebrow {
  display: flex; align-items: center; gap: 12px;
  margin: 0 0 22px; color: var(--gold);
  font-size: .67rem; font-weight: 750; letter-spacing: .22em; text-transform: uppercase;
}
.eyebrow > span { width: 38px; height: 1px; background: currentColor; transform-origin: 0 50%; }
.eyebrow--center { justify-content: center; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 {
  margin-bottom: 24px; font-family: var(--serif); font-weight: 400;
  line-height: .98; letter-spacing: -.038em;
}
h1 { max-width: 690px; font-size: clamp(3.25rem, 5.15vw, 5.7rem); }
.hero-copy h1 { max-width: 560px; font-size: clamp(3rem, 4.6vw, 5rem); line-height: 1.02; }
h2 { font-size: clamp(2.75rem, 4.65vw, 5.1rem); }
h1 em, h2 em { color: var(--gold-2); font-weight: 400; }
.hero-lead { max-width: 630px; margin-bottom: 34px; color: var(--muted); font-size: 1.04rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-proof {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px; margin: 45px 0 0; padding: 30px 0 0;
  border-top: 1px solid var(--line); list-style: none;
}
.hero-proof li {
  position: relative; min-width: 0; margin: -10px; padding: 10px;
  display: grid; grid-template-columns: 39px minmax(0,1fr); gap: 12px; align-items: center;
  border: 1px solid transparent; border-radius: 13px;
  transition: border-color .25s ease, background .25s ease, box-shadow .25s ease;
  will-change: transform;
}
.hero-proof li:hover, .hero-proof li:focus-visible {
  border-color: rgba(221,180,111,.18);
  background: rgba(221,180,111,.035);
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
  outline: none;
}
.proof-icon {
  width: 38px; height: 38px; display: grid; place-items: center;
  border: 1px solid var(--line-strong); border-radius: 12px;
  color: var(--gold); background: rgba(221,180,111,.045);
  transform-origin: 50% 50%;
}
.proof-icon svg { width: 22px; height: 22px; overflow: visible; }
.proof-icon path, .proof-icon circle {
  fill: none; stroke: currentColor; stroke-width: 1.45;
  stroke-linecap: round; stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.proof-copy { min-width: 0; display: grid; gap: 3px; }
.hero-proof strong { color: var(--gold-2); font-family: var(--serif); font-size: 1.3rem; font-weight: 400; line-height: 1; }
.hero-proof .proof-copy > span { color: var(--soft); font-size: .69rem; line-height: 1.38; }

.hero-showcase { position: relative; min-width: 0; }
.hero-browser-float, .hero-browser-tilt {
  position: relative; transform-style: preserve-3d; will-change: transform;
}
.hero-browser-float { perspective: 1500px; }
.hero-browser-float { animation: hero-float-fallback 7s ease-in-out infinite; }
.motion-loaded .hero-browser-float { animation: none; }
.showcase-halo {
  position: absolute; z-index: -1; inset: 6% -10% 20%;
  border-radius: 50%; background: rgba(39,74,106,.21); filter: blur(72px);
  animation: halo-breathe 8s ease-in-out infinite;
}
.browser {
  overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 17px;
  background: #0c1017; box-shadow: var(--shadow);
}
.browser--hero { transform: perspective(1500px) rotateY(-2.5deg) rotateX(.5deg); transform-origin: center; }
.browser-bar {
  height: 42px; display: grid; grid-template-columns: 74px 1fr 36px;
  align-items: center; padding: 0 10px; background: #11151d; border-bottom: 1px solid rgba(255,255,255,.07);
}
.traffic { display: flex; gap: 6px; }
.traffic i { width: 8px; height: 8px; border-radius: 50%; background: #626875; }
.traffic i:nth-child(1) { background: #be685b; }
.traffic i:nth-child(2) { background: #c8a254; }
.traffic i:nth-child(3) { background: #5f9a73; }
.browser-url {
  height: 24px; max-width: 310px; width: 67%; margin-inline: auto;
  display: flex; align-items: center; justify-content: center; gap: 7px;
  color: #8e96a3; background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.045); border-radius: 6px;
  font-size: .63rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.browser-expand {
  width: 28px; height: 28px; display: grid; place-items: center;
  border: 0; border-radius: 7px; color: var(--muted); background: transparent;
}
.browser-expand:hover { color: var(--gold-2); background: rgba(255,255,255,.05); }
.browser-screen--hero {
  position: relative; height: 554px; overflow: hidden; isolation:isolate;
  background: #031e19; --switch-direction:1;
}
.hero-image-stage { position:relative; min-height:100%; transform-origin:50% 48%; }
.hero-project-image {
  width: 100%; height: auto; min-height: 100%; display:block;
  object-fit: cover; object-position: top; backface-visibility:hidden;
  will-change: opacity, transform, filter;
}
.hero-project-image--current { position:relative; z-index:1; transition:opacity .28s ease, transform 10s cubic-bezier(.16,.8,.2,1), filter .28s ease; }
.hero-project-image--next {
  position:absolute; z-index:2; inset:0 auto auto 0; opacity:0; pointer-events:none;
  transform:translateX(calc(var(--switch-direction) * 14px)) scale(1.012);
  filter:blur(2px);
  transition:opacity .42s cubic-bezier(.22,1,.36,1), transform .48s cubic-bezier(.22,1,.36,1), filter .42s ease;
}
.project-transition-wash {
  position:absolute; z-index:3; inset:-12% -35%; pointer-events:none; opacity:0;
  background:linear-gradient(105deg,transparent 37%,rgba(221,180,111,.13) 49%,rgba(87,135,220,.11) 53%,transparent 65%);
  transform:translateX(calc(var(--switch-direction) * -30%));
  mix-blend-mode:screen; will-change:transform,opacity;
}
.browser-screen--hero.is-css-switching .hero-project-image--current {
  opacity:0; transform:translateX(calc(var(--switch-direction) * -10px)) scale(.995); filter:blur(2px);
}
.browser-screen--hero.is-css-switching .hero-project-image--next { opacity:1; transform:translateX(0) scale(1); filter:blur(0); }
.browser-screen--hero.is-css-switching .project-transition-wash { opacity:.34; transform:translateX(calc(var(--switch-direction) * 28%)); transition:opacity .48s ease, transform .55s cubic-bezier(.22,1,.36,1); }
.browser--hero:hover .hero-project-image--current { transform: translateY(calc(-100% + 554px)); }
.screen-shade { position: absolute; z-index:4; inset: auto 0 0; height: 35%; background: linear-gradient(transparent, rgba(3,8,14,.93)); pointer-events:none; }
.screen-caption { position:absolute; z-index:5; left: 24px; right:24px; bottom:20px; display:grid; gap:4px; pointer-events:none; }
.screen-caption span { color: var(--gold); font-size:.62rem; letter-spacing:.17em; text-transform:uppercase; }
.screen-caption strong { font-family:var(--serif); font-size:1.4rem; font-weight:400; }
.project-switcher {
  position: relative; z-index: 2; margin-top: 13px;
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px;
}
.project-tab {
  position:relative; min-width: 0; padding: 11px 6px 10px; border: 1px solid var(--line); border-radius: 9px;
  color: #818a98; background: rgba(255,255,255,.018);
  font-size: .62rem; white-space: nowrap; overflow:hidden; text-overflow:ellipsis;
  transition: color .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.project-tab::after {
  content:""; position:absolute; left:14%; right:14%; bottom:0; height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  transform:scaleX(0); opacity:0; transition:transform .28s cubic-bezier(.22,1,.36,1),opacity .22s ease;
}
.project-tab.is-active::after { transform:scaleX(1); opacity:.9; }
.project-tab span { display: block; margin-bottom: 2px; color: #515a68; font-size:.52rem; }
.project-tab:hover, .project-tab.is-active { color: var(--ink); border-color: var(--line-strong); background: rgba(221,180,111,.065); }
.project-tab.is-active span { color: var(--gold); }
.concept-badge { margin: 13px 0 0; color:#737d8d; text-align:center; font-size:.66rem; letter-spacing:.05em; }
.concept-badge span { color:var(--gold); margin-right:5px; }

.niche-strip {
  margin-top: 63px; padding: 22px 0 8px;
  display:flex; justify-content:center; align-items:center; gap:23px; flex-wrap:wrap;
  border-top: 1px solid var(--line);
  color:#7f8896; font-size:.68rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
}
.niche-strip i { color:var(--gold-dark); font-style:normal; }

.problem { background: linear-gradient(180deg, rgba(255,255,255,.012), transparent); }
.section-heading { margin-bottom: 58px; }
.split-heading { display:grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr); gap:80px; align-items:end; }
.split-heading h2 { max-width: 780px; margin-bottom:0; }
.split-heading > p, .split-heading > div:last-child > p, .centered > p {
  color:var(--muted); line-height:1.75;
}
.split-heading > p, .split-heading > div:last-child > p { margin:0; }
.centered { max-width:850px; margin-inline:auto; text-align:center; }
.centered h2 { line-height:1.04; }
.centered > p { max-width:680px; margin:0 auto; }

.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.problem-card {
  position:relative; min-height:360px; padding:31px;
  display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--radius);
  background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.008));
  overflow:hidden;
}
.problem-card::before {
  content:""; position:absolute; inset:auto -30% -45% 20%; height:70%;
  background:radial-gradient(ellipse, rgba(221,180,111,.09), transparent 68%);
}
.card-index { color:var(--gold); font-size:.64rem; letter-spacing:.16em; }
.problem-card h3 { margin:68px 0 12px; font-family:var(--serif); font-size:1.8rem; font-weight:400; line-height:1.12; }
.problem-card p { color:var(--muted); font-size:.88rem; }
.problem-card small { margin-top:auto; padding-top:28px; color:var(--gold-dark); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; }
.problem-card strong { position:relative; margin-top:7px; font-size:.82rem; font-weight:650; }

.portfolio { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#080c14; overflow:hidden; }
.filters { display:flex; flex-wrap:wrap; gap:7px; margin-top:25px; }
.filter {
  padding:7px 11px; border:1px solid var(--line); border-radius:999px;
  color:#838c9b; background:transparent; font-size:.66rem;
}
.filter:hover, .filter.is-active { color:#0b0c10; border-color:var(--gold); background:var(--gold); }

.portfolio-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:24px; }
.project-card {
  min-width:0; padding:18px; border:1px solid var(--line); border-radius:var(--radius);
  background:linear-gradient(150deg, rgba(255,255,255,.034), rgba(255,255,255,.009));
  transition:opacity .25s ease, transform .25s ease, border-color .25s ease;
}
.project-card:hover { border-color:rgba(221,180,111,.25); }
.project-card.is-hidden { display:none; }
.project-card--wide, .project-card.is-filter-lead { grid-column:1/-1; }
.project-meta { min-height:74px; padding:4px 5px 15px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.project-meta span { color:var(--gold); font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; }
.project-meta h3 { margin:4px 0 0; font-family:var(--serif); font-size:clamp(1.35rem,2.2vw,2rem); font-weight:400; }
.circle-button {
  flex:0 0 auto; width:41px; height:41px; border:1px solid var(--line); border-radius:50%;
  background:rgba(255,255,255,.02); transition:transform .2s, background .2s, border-color .2s;
}
.circle-button:hover { transform:rotate(45deg); border-color:var(--gold); background:rgba(221,180,111,.07); }
.project-browser { border-radius:12px; box-shadow:0 20px 48px rgba(0,0,0,.28); }
.project-browser .browser-bar { height:34px; grid-template-columns:58px 1fr 58px; }
.project-browser .traffic i { width:6px; height:6px; }
.project-browser .browser-url { height:20px; max-width:260px; font-size:.53rem; }
.scroll-preview {
  position:relative; width:100%; height:430px; overflow:hidden; padding:0; border:0; background:#0b1118; cursor:zoom-in;
}
.project-card--wide .scroll-preview, .project-card.is-filter-lead .scroll-preview { height:545px; }
.scroll-preview img { width:100%; height:auto; min-height:100%; object-fit:cover; object-position:top; transition:transform 9s cubic-bezier(.16,.8,.2,1); }
.scroll-preview:hover img, .scroll-preview:focus-visible img { transform:translateY(calc(-100% + 430px)); }
.project-card--wide .scroll-preview:hover img, .project-card--wide .scroll-preview:focus-visible img, .project-card.is-filter-lead .scroll-preview:hover img, .project-card.is-filter-lead .scroll-preview:focus-visible img { transform:translateY(calc(-100% + 545px)); }
.project-outcome { padding:17px 5px 3px; display:grid; grid-template-columns:70px 1fr; gap:14px; }
.project-outcome span { color:var(--gold); font-size:.57rem; letter-spacing:.15em; text-transform:uppercase; }
.project-outcome p { margin:0; color:#919aa8; font-size:.76rem; line-height:1.55; }
.portfolio-tip { margin:25px 0 0; color:#697382; text-align:center; font-size:.69rem; }
.portfolio-tip span { color:var(--gold); margin-right:7px; }

.method { overflow:hidden; }
.method::before {
  content:""; position:absolute; left:50%; top:50%; z-index:-1; width:62rem; height:24rem;
  background:radial-gradient(ellipse, rgba(40,80,115,.13), transparent 66%); transform:translate(-50%,-50%);
}
.method-instruction {
  width: fit-content; margin: 30px auto -32px; padding: 8px 13px;
  border: 1px solid var(--line); border-radius: 999px;
  color: #7e8897; background: rgba(255,255,255,.018);
  font-size: .64rem; letter-spacing: .035em; text-align: center;
}
.method-instruction span { margin-right: 6px; color: var(--gold); }
.method-track { position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:66px; }
.method-track::before {
  content:""; position:absolute; left:10%; right:10%; top:68px; height:1px;
  background:linear-gradient(90deg,transparent,rgba(221,180,111,.14),transparent);
}
.method-progress {
  position:absolute; z-index:0; left:10%; right:10%; top:68px; height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--gold-2),transparent);
  box-shadow:0 0 16px rgba(221,180,111,.22);
  transform:scaleX(0); transform-origin:0 50%; will-change:transform;
}
.method-step { position:relative; min-width:0; padding:0 17px; text-align:center; }
.method-step > span { color:#657080; font-size:.58rem; letter-spacing:.15em; }
.method-icon {
  position:relative; z-index:1; width:76px; height:76px; margin:21px auto 23px; padding:0;
  display:grid; place-items:center; border:1px solid var(--line-strong); border-radius:50%;
  color:var(--gold); background:radial-gradient(circle at 35% 30%, rgba(221,180,111,.12), transparent 46%), var(--bg);
  box-shadow:0 0 0 0 rgba(221,180,111,0);
  transition:border-color .25s ease, background .25s ease, box-shadow .25s ease, color .25s ease;
  isolation:isolate; overflow:visible; will-change:transform;
}
.method-icon::before {
  content:""; position:absolute; inset:7px; z-index:-1;
  border:1px solid rgba(221,180,111,.12); border-radius:50%;
}
.method-icon::after {
  content:""; position:absolute; inset:-8px; z-index:-2;
  border:1px solid rgba(221,180,111,.08); border-radius:50%; opacity:0;
  transform:scale(.75); transition:opacity .25s ease, transform .25s ease;
}
.method-icon svg { width:31px; height:31px; overflow:visible; }
.method-icon path, .method-icon circle {
  fill:none; stroke:currentColor; stroke-width:1.45;
  stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke;
}
.method-icon .icon-path--accent, .method-icon .icon-shape--accent { stroke:var(--gold-2); }
.method-step.is-active .method-icon, .method-icon:hover, .method-icon:focus-visible {
  color:var(--gold-2); border-color:rgba(242,212,154,.72);
  background:radial-gradient(circle at 35% 30%, rgba(221,180,111,.2), transparent 48%), #0b0d13;
  box-shadow:0 15px 45px rgba(221,180,111,.12), 0 0 0 7px rgba(221,180,111,.025);
}
.method-step.is-active .method-icon::after, .method-icon:hover::after, .method-icon:focus-visible::after {
  opacity:1; transform:scale(1);
}
.method-step h3 { margin-bottom:11px; font-family:var(--serif); font-size:1.55rem; font-weight:400; transition:color .25s ease; }
.method-step.is-active h3 { color:var(--gold-2); }
.method-step p { margin:0; color:var(--muted); font-size:.78rem; line-height:1.7; }
.method-feedback {
  max-width:900px; margin:56px auto 0; padding:23px 26px;
  display:grid; grid-template-columns:145px minmax(0,1fr); gap:8px 28px; align-items:start;
  border:1px solid rgba(221,180,111,.2); border-radius:18px;
  background:linear-gradient(135deg,rgba(221,180,111,.055),rgba(49,93,128,.045));
  box-shadow:0 24px 65px rgba(0,0,0,.18); overflow:hidden;
}
.method-feedback > span {
  grid-row:1/3; padding-top:3px; color:var(--gold);
  font-size:.59rem; font-weight:750; letter-spacing:.15em; text-transform:uppercase;
}
.method-feedback > div { min-width:0; }
.method-feedback strong { display:block; margin-bottom:5px; font-family:var(--serif); font-size:1.25rem; font-weight:400; line-height:1.25; }
.method-feedback p { margin:0; color:var(--muted); font-size:.76rem; line-height:1.65; }
.method-feedback small {
  grid-column:1/-1; margin-top:10px; padding-top:12px; border-top:1px solid var(--line);
  color:#677281; font-size:.58rem; letter-spacing:.035em;
}

.deliverables { background:linear-gradient(145deg,#0b111a,#080a10); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.deliverables-grid { display:grid; grid-template-columns:minmax(330px,.72fr) minmax(0,1.28fr); gap:100px; align-items:start; }
.deliverables-intro { position:sticky; top:130px; }
.deliverables-intro h2 { font-size:clamp(3rem,5vw,5.2rem); }
.deliverables-intro > p { max-width:440px; color:var(--muted); }
.text-link {
  display:inline-flex; align-items:center; gap:10px; margin-top:15px; padding-bottom:5px;
  border-bottom:1px solid var(--gold-dark); color:var(--gold-2); font-size:.76rem; font-weight:700;
}
.text-link span { transition:transform .2s; }
.text-link:hover span { transform:translate(3px,-3px); }
.deliverables-list { border-top:1px solid var(--line); }
.deliverable { display:grid; grid-template-columns:64px 1fr; gap:20px; padding:27px 0; border-bottom:1px solid var(--line); }
.deliverable > span { color:var(--gold-dark); font-size:.64rem; letter-spacing:.13em; }
.deliverable h3 { margin:0 0 7px; font-family:var(--serif); font-size:1.45rem; font-weight:400; }
.deliverable p { margin:0; color:var(--muted); font-size:.8rem; }

.process-list { margin:0; padding:0; border-top:1px solid var(--line); list-style:none; }
.process-list li {
  display:grid; grid-template-columns:75px 1fr 40px; gap:24px; align-items:center;
  min-height:122px; border-bottom:1px solid var(--line);
  transition:padding .2s ease, background .2s ease;
}
.process-list li:hover { padding-inline:15px; background:rgba(255,255,255,.015); }
.process-number { color:var(--gold-dark); font-size:.63rem; letter-spacing:.16em; }
.process-list li > div { display:grid; grid-template-columns:minmax(160px,.37fr) 1fr; gap:30px; align-items:center; }
.process-list strong { font-family:var(--serif); font-size:1.65rem; font-weight:400; }
.process-list p { margin:0; color:var(--muted); font-size:.82rem; }
.process-symbol { color:var(--gold); font-size:1.3rem; text-align:right; }

.plans { background:#080c13; border-top:1px solid var(--line); }
.plans-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:60px; align-items:stretch; }
.plan {
  position:relative; padding:32px; display:flex; flex-direction:column;
  border:1px solid var(--line); border-radius:var(--radius);
  background:rgba(255,255,255,.018);
}
.plan--featured {
  border-color:var(--line-strong);
  background:linear-gradient(145deg,rgba(221,180,111,.09),rgba(255,255,255,.018));
  box-shadow:0 25px 80px rgba(0,0,0,.25);
  transform:translateY(-10px);
}
.plan-label {
  position:absolute; top:-13px; right:23px; padding:5px 10px; border-radius:999px;
  color:#11100d; background:var(--gold); font-size:.57rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
}
.plan-top > span { color:var(--gold); font-family:var(--serif); font-size:1.85rem; }
.plan-top p { min-height:78px; margin:10px 0 25px; color:var(--muted); font-size:.78rem; }
.price { padding:23px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); display:grid; }
.price small { color:#727c8b; font-size:.61rem; text-transform:uppercase; letter-spacing:.12em; }
.price strong { margin:2px 0; font-family:var(--serif); font-size:2.35rem; font-weight:400; line-height:1.2; }
.price span { color:var(--gold); font-size:.72rem; }
.plan ul { margin:25px 0 28px; padding:0; list-style:none; }
.plan li { position:relative; padding:7px 0 7px 20px; color:#aeb5c0; font-size:.76rem; }
.plan li::before { content:"✓"; position:absolute; left:0; color:var(--gold); }
.plan .button { margin-top:auto; padding-inline:12px; font-size:.68rem; }

.about { overflow:hidden; }
.about-grid { display:grid; grid-template-columns:minmax(340px,.8fr) minmax(0,1.2fr); gap:100px; align-items:center; }
.brand-card {
  position:relative; min-height:590px; padding:58px;
  display:flex; flex-direction:column; justify-content:flex-end;
  border:1px solid var(--line-strong); border-radius:var(--radius-lg);
  background:
    linear-gradient(160deg,rgba(39,72,100,.22),transparent 45%),
    linear-gradient(330deg,rgba(221,180,111,.11),transparent 40%),
    #0b1018;
  overflow:hidden; box-shadow:var(--shadow);
}
.brand-card::before {
  content:""; position:absolute; inset:10%; border:1px solid rgba(255,255,255,.055); border-radius:50%; transform:rotate(-20deg);
}
.brand-logo-full {
  position:absolute; z-index:1; top:30px; left:50%; width:min(82%,390px); height:auto;
  transform:translateX(-50%); object-fit:contain;
  filter:drop-shadow(0 22px 45px rgba(5,32,88,.24));
  mix-blend-mode:screen; will-change:transform,opacity;
}
.brand-orbit { position:absolute; border:1px solid rgba(221,180,111,.13); border-radius:50%; }
.brand-orbit--one { width:320px; height:160px; top:55px; left:50%; transform:translateX(-50%) rotate(38deg); }
.brand-orbit--two { width:250px; height:390px; top:10px; left:50%; transform:translateX(-50%) rotate(-47deg); }
.brand-card > strong { position:relative; margin-top:13px; font-family:var(--serif); font-size:2.45rem; font-weight:400; line-height:1.02; }
.code-lines { position:absolute; right:32px; top:30px; display:grid; gap:6px; opacity:.25; }
.code-lines i { display:block; height:1px; background:var(--gold); }
.code-lines i:nth-child(1){width:40px}.code-lines i:nth-child(2){width:70px}.code-lines i:nth-child(3){width:53px}.code-lines i:nth-child(4){width:88px}.code-lines i:nth-child(5){width:32px}
.about-copy h2 { font-size:clamp(3rem,5vw,5.2rem); }
.about-copy > p { color:var(--muted); }
.about-points { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:37px; padding-top:28px; border-top:1px solid var(--line); }
.about-points span { color:var(--gold-dark); font-size:.58rem; letter-spacing:.15em; }
.about-points strong { display:block; margin:7px 0 4px; font-family:var(--serif); font-size:1rem; font-weight:400; }
.about-points p { margin:0; color:var(--soft); font-size:.68rem; line-height:1.5; }

.faq { border-top:1px solid var(--line); background:linear-gradient(180deg,#0a0e16,#070910); }
.faq-grid { display:grid; grid-template-columns:minmax(300px,.66fr) minmax(0,1.34fr); gap:110px; align-items:start; }
.faq-intro { position:sticky; top:130px; }
.faq-intro h2 { font-size:clamp(3rem,4.8vw,5rem); }
.faq-intro > p { color:var(--muted); }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary {
  min-height:84px; display:flex; align-items:center; justify-content:space-between; gap:20px;
  color:#d7dbe1; font-family:var(--serif); font-size:1.15rem; list-style:none; cursor:pointer;
}
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary span {
  flex:0 0 auto; width:28px; height:28px; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:50%; color:var(--gold);
  transition:transform .2s;
}
.faq-list details[open] summary span { transform:rotate(45deg); }
.faq-list details p { max-width:700px; margin:-3px 50px 25px 0; color:var(--muted); font-size:.8rem; }

.contact { padding-bottom:90px; }
.contact-shell {
  position:relative; padding:70px; display:grid; grid-template-columns:minmax(0,.88fr) minmax(400px,1.12fr); gap:80px;
  border:1px solid var(--line-strong); border-radius:var(--radius-lg);
  background:
    radial-gradient(circle at 0 100%, rgba(221,180,111,.12), transparent 35%),
    radial-gradient(circle at 100% 0, rgba(43,82,116,.21), transparent 39%),
    #0d121b;
  box-shadow:var(--shadow); overflow:hidden;
}
.contact-copy h2 { font-size:clamp(3rem,4.7vw,5rem); }
.contact-copy > p { color:var(--muted); }
.contact-details { margin-top:45px; display:grid; gap:16px; }
.contact-details a, .contact-details > div {
  display:grid; grid-template-columns:90px 1fr; gap:15px; align-items:center;
  padding-bottom:14px; border-bottom:1px solid var(--line);
}
.contact-details span { color:var(--gold); font-size:.57rem; letter-spacing:.14em; text-transform:uppercase; }
.contact-details strong { font-size:.76rem; font-weight:600; }
.brief-form { padding:34px; border:1px solid var(--line); border-radius:var(--radius); background:rgba(4,7,12,.43); }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.brief-form label { display:grid; gap:8px; margin-bottom:17px; }
.brief-form label > span, .brief-form legend { color:#a9b1bd; font-size:.65rem; font-weight:700; letter-spacing:.06em; }
input, select, textarea {
  width:100%; border:1px solid var(--line); border-radius:9px;
  color:var(--ink); background:#0b1018; transition:border-color .2s, background .2s;
}
input, select { height:48px; padding:0 13px; }
textarea { min-height:112px; padding:12px 13px; resize:vertical; }
input::placeholder, textarea::placeholder { color:#535d6c; }
input:hover, select:hover, textarea:hover { border-color:rgba(255,255,255,.19); }
select { color:#b8bec7; }
fieldset { margin:0 0 17px; padding:0; border:0; }
legend { margin-bottom:9px; }
.choice-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.choice { position:relative; margin:0!important; }
.choice input { position:absolute; opacity:0; pointer-events:none; }
.choice span {
  min-height:42px; display:flex; align-items:center; padding:0 11px;
  border:1px solid var(--line); border-radius:8px; color:#7f8997!important; background:#0b1018;
  font-size:.64rem!important; letter-spacing:0!important; transition:.2s;
}
.choice input:checked + span { color:var(--ink)!important; border-color:var(--gold); background:rgba(221,180,111,.08); }
.choice input:focus-visible + span { outline:2px solid var(--gold-2); outline-offset:2px; }
.form-note { display:block; margin-top:13px; color:#66717f; font-size:.58rem; line-height:1.5; }

.site-footer { border-top:1px solid var(--line); background:#05070b; }
.footer-main { min-height:180px; display:grid; grid-template-columns:250px 1fr auto; gap:60px; align-items:center; }
.footer-main > p { max-width:430px; margin:0; color:#7c8593; font-size:.76rem; }
.footer-links { display:flex; gap:22px; color:#a1a8b3; font-size:.7rem; }
.footer-links a:hover { color:var(--gold); }
.footer-bottom {
  min-height:62px; display:flex; justify-content:space-between; align-items:center; gap:30px;
  border-top:1px solid var(--line); color:#535d6b; font-size:.6rem;
}
.whatsapp-float {
  position:fixed; z-index:80; right:20px; bottom:20px; min-height:48px; padding:0 16px 0 11px;
  display:flex; align-items:center; gap:9px; border:1px solid rgba(126,220,153,.35); border-radius:999px;
  color:#dceee1; background:rgba(15,92,51,.87); box-shadow:0 13px 35px rgba(0,0,0,.3);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); font-size:.68rem;
  transition:transform .2s, background .2s;
}
.whatsapp-float::after {
  content:""; position:absolute; inset:-1px; border:1px solid rgba(126,220,153,.28); border-radius:inherit;
  animation:whatsapp-pulse 3.8s ease-out infinite; pointer-events:none;
}
.whatsapp-float span { width:27px; height:27px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.18); border-radius:50%; }
.whatsapp-icon svg { width:17px; height:17px; overflow:visible; }
.whatsapp-icon path { fill:none; stroke:currentColor; stroke-width:1.45; stroke-linecap:round; stroke-linejoin:round; }
.whatsapp-float:hover { transform:translateY(-3px); background:#136e3e; }

.motion-loaded .button,
.motion-loaded .circle-button,
.motion-loaded .filter,
.motion-loaded .project-tab,
.motion-loaded .problem-card,
.motion-loaded .project-card,
.motion-loaded .proof-item,
.motion-loaded .contact-details > *,
.motion-loaded .about-points > * { transition-property:border-color,background,color,box-shadow; }
.motion-loaded .hero-project-image,
.motion-loaded .scroll-preview img { transition:opacity .26s ease; }
.motion-loaded .browser--hero:hover .hero-project-image--current,
.motion-loaded .scroll-preview:hover img,
.motion-loaded .scroll-preview:focus-visible img { transform:none; }
.icon-path, .icon-shape { transform-box:fill-box; transform-origin:center; }
.code-lines i { transform-origin:0 50%; }

@keyframes hero-float-fallback {
  0%,100% { transform:translateY(0) rotateZ(0); }
  50% { transform:translateY(-8px) rotateZ(.18deg); }
}
@keyframes halo-breathe {
  0%,100% { opacity:.68; transform:scale(.94); }
  50% { opacity:1; transform:scale(1.05); }
}
@keyframes whatsapp-pulse {
  0%,72% { opacity:0; transform:scale(1); }
  82% { opacity:.55; }
  100% { opacity:0; transform:scale(1.28); }
}

.project-modal {
  width:min(1020px, calc(100vw - 32px)); max-height:calc(100vh - 32px); padding:0;
  border:1px solid rgba(255,255,255,.16); border-radius:18px;
  color:var(--ink); background:#080b11; box-shadow:0 35px 100px rgba(0,0,0,.7);
}
.project-modal::backdrop { background:rgba(1,3,6,.84); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.modal-panel { min-height:0; }
.modal-bar {
  position:sticky; z-index:2; top:0; height:68px; padding:0 18px 0 24px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  border-bottom:1px solid var(--line); background:rgba(10,13,20,.92); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
}
.modal-bar > div { display:grid; }
.modal-bar span { color:var(--gold); font-size:.54rem; letter-spacing:.14em; text-transform:uppercase; }
.modal-bar strong { font-family:var(--serif); font-size:1.1rem; font-weight:400; }
.modal-close {
  width:39px; height:39px; border:1px solid var(--line); border-radius:50%;
  color:#c9ced6; background:transparent; font-size:1.4rem; line-height:1;
}
.modal-close:hover { color:#0b0d11; border-color:var(--gold); background:var(--gold); }
.modal-image-wrap { max-height:calc(100vh - 102px); overflow:auto; background:#0d1118; }
.modal-image-wrap img { width:100%; height:auto; }
.noscript { position:fixed; z-index:200; left:10px; right:10px; bottom:10px; padding:12px; border-radius:8px; color:#111; background:var(--gold-2); text-align:center; font-size:.8rem; }

.js .reveal { opacity:0; transform:translateY(24px); }
.js .reveal.is-visible { opacity:1; transform:translateY(0); transition:opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); transition-delay:var(--delay,0ms); }

@media (max-width: 1100px) {
  :root { --container:min(100% - 36px, 980px); }
  .header-cta { display:none; }
  .site-nav { margin-left:auto; }
  .hero { min-height:auto; }
  .hero-grid { grid-template-columns:1fr 1fr; gap:46px; }
  h1 { font-size:clamp(3rem,5.6vw,4.8rem); }
  .hero-copy h1 { max-width: 10ch; }
  .browser-screen--hero { height:480px; }
  .browser--hero:hover .hero-project-image--current { transform:translateY(calc(-100% + 480px)); }
  .project-tab { font-size:0; }
  .project-tab span { margin:0; font-size:.58rem; }
  .deliverables-grid, .about-grid { gap:65px; }
  .contact-shell { padding:52px; gap:52px; }
  .footer-main { grid-template-columns:220px 1fr; }
  .footer-links { grid-column:1/-1; padding-bottom:30px; }
}

@media (max-width: 860px) {
  :root { --container:calc(100vw - 32px); }
  .section { padding:86px 0; }
  .header-inner { min-height:72px; }
  .menu-toggle {
    z-index:2; margin-left:auto; width:42px; height:42px; padding:0;
    display:grid; place-content:center; gap:6px; border:1px solid var(--line); border-radius:9px; background:rgba(255,255,255,.025);
  }
  .menu-toggle span:not(.sr-only) { display:block; width:17px; height:1px; background:var(--ink); transition:transform .2s; }
  .menu-toggle[aria-expanded="true"] span:nth-last-child(2) { transform:translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform:translateY(-3.5px) rotate(-45deg); }
  .site-nav {
    position:fixed; inset:0; padding:110px 32px 40px;
    display:flex; flex-direction:column; align-items:flex-start; gap:23px;
    background:rgba(6,8,13,.97); transform:translateX(100%); transition:transform .28s ease;
  }
  .site-nav.is-open { transform:translateX(0); }
  .site-nav a { font-family:var(--serif); font-size:2rem; font-weight:400; }
  body.menu-open { overflow:hidden; }

  .hero { padding-top:116px; }
  .hero-grid { grid-template-columns:1fr; }
  .hero-copy { max-width:680px; }
  .hero-showcase { max-width:700px; width:100%; margin-inline:auto; }
  .hero-browser-float { animation:none; }
  .browser--hero { transform:none; }
  .project-tab { font-size:.6rem; }
  .project-tab span { font-size:.5rem; }

  .split-heading { grid-template-columns:1fr; gap:28px; }
  .problem-grid { grid-template-columns:1fr; }
  .problem-card { min-height:270px; }
  .problem-card h3 { margin-top:40px; }
  .portfolio-grid { grid-template-columns:1fr; }
  .project-card--wide, .project-card.is-filter-lead { grid-column:auto; }
  .project-card--wide .scroll-preview, .scroll-preview { height:430px; }
  .project-card--wide .scroll-preview:hover img, .project-card--wide .scroll-preview:focus-visible img { transform:translateY(calc(-100% + 430px)); }

  .method-track { grid-template-columns:1fr 1fr; row-gap:45px; }
  .method-track::before, .method-progress { display:none; }
  .method-feedback { grid-template-columns:1fr; }
  .method-feedback > span { grid-row:auto; }
  .method-feedback small { grid-column:auto; }

  .deliverables-grid, .about-grid, .faq-grid { grid-template-columns:1fr; gap:55px; }
  .deliverables-intro, .faq-intro { position:static; }
  .deliverables-intro > p { max-width:680px; }
  .brand-card { min-height:500px; max-width:600px; width:100%; margin-inline:auto; }
  .plans-grid { grid-template-columns:1fr; max-width:620px; margin-inline:auto; }
  .plan--featured { transform:none; }

  .contact-shell { grid-template-columns:1fr; }
  .footer-main { grid-template-columns:1fr; gap:28px; padding:45px 0; }
  .footer-links { grid-column:auto; padding:0; flex-wrap:wrap; }
}

@media (max-width: 600px) {
  :root { --container:calc(100vw - 24px); }
  body { font-size:15px; }
  .section { padding:72px 0; }
  .brand-logo-mark { width:42px; height:44px; }
  .brand-copy strong { font-size:.74rem; }
  .brand-copy small { font-size:.48rem; letter-spacing:.13em; }
  h1 { font-size:clamp(2.7rem,13vw,4rem); }
  h2 { font-size:clamp(2.55rem,12vw,4rem); }
  .hero { padding-top:105px; }
  .hero-lead { font-size:.95rem; }
  .hero-actions { display:grid; }
  .hero-actions .button { width:100%; }
  .hero-proof { grid-template-columns:1fr; gap:12px; }
  .hero-proof li { margin:0; padding:8px; grid-template-columns:42px 1fr; align-items:center; }
  .hero-proof strong { font-size:1.2rem; }
  .browser-bar { height:34px; grid-template-columns:60px 1fr 30px; }
  .browser-screen--hero { height:380px; }
  .browser--hero:hover .hero-project-image--current { transform:none; }
  .screen-caption { left:16px; right:16px; bottom:15px; }
  .screen-caption strong { font-size:1.1rem; }
  .project-switcher { grid-template-columns:repeat(5,1fr); gap:4px; }
  .project-tab { min-height:35px; padding:7px 3px; font-size:0; }
  .niche-strip { justify-content:flex-start; gap:13px; margin-top:42px; }

  .problem-card { padding:25px; }
  .filters { gap:5px; }
  .filter { padding:6px 9px; }
  .project-card { padding:10px; border-radius:15px; }
  .project-meta { min-height:68px; }
  .project-meta h3 { font-size:1.24rem; }
  .scroll-preview, .project-card--wide .scroll-preview { height:310px; }
  .scroll-preview:hover img, .scroll-preview:focus-visible img,
  .project-card--wide .scroll-preview:hover img, .project-card--wide .scroll-preview:focus-visible img { transform:none; }
  .project-outcome { grid-template-columns:1fr; gap:4px; }
  .project-browser .browser-bar { grid-template-columns:45px 1fr 45px; }
  .portfolio-tip { display:none; }

  .method-instruction { width:auto; margin-bottom:-25px; line-height:1.45; }
  .method-track { grid-template-columns:1fr; }
  .method-step { max-width:430px; margin-inline:auto; }
  .method-feedback { margin-top:40px; padding:20px; }
  .deliverable { grid-template-columns:40px 1fr; }
  .process-list li { grid-template-columns:42px 1fr 20px; gap:12px; padding:18px 0; }
  .process-list li > div { grid-template-columns:1fr; gap:3px; }
  .process-list strong { font-size:1.35rem; }

  .plan { padding:25px; }
  .plan-top p { min-height:0; }
  .about-points { grid-template-columns:1fr; }
  .brand-card { min-height:440px; padding:36px; }
  .brand-logo-full { top:26px; width:min(88%,340px); }
  .brand-card > strong { font-size:2rem; }
  .faq-list summary { font-size:1rem; }
  .faq-list details p { margin-right:0; }

  .contact-shell { padding:27px 18px; border-radius:22px; }
  .brief-form { padding:19px 14px; }
  .field-row, .choice-grid { grid-template-columns:1fr; }
  .contact-details a, .contact-details > div { grid-template-columns:75px 1fr; }
  .footer-bottom { padding:19px 0; align-items:flex-start; flex-direction:column; gap:8px; }
  .whatsapp-float { right:12px; bottom:12px; }
  .whatsapp-float strong { display:none; }
  .whatsapp-float { width:48px; padding:0; justify-content:center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .scroll-preview img, .hero-project-image { transform:none!important; }
  .hero-browser-float, .showcase-halo, .whatsapp-float::after { animation:none!important; }
  .scroll-progress { display:none; }
  .js .reveal { opacity:1; transform:none; }
}

@media print {
  .site-header, .scroll-progress, .whatsapp-float, .project-modal, .hero-actions, .filters, .contact { display:none!important; }
  body { color:#111; background:#fff; }
  .section { padding:35px 0; }
  .browser, .project-card, .problem-card, .plan, .brand-card { box-shadow:none; }
}

/* Integration 1.0.0: original brand, independent page and dynamic plans. */
.no-js .brief-form { display:none; }
.plan { min-width:0; }
.price strong { overflow-wrap:anywhere; }
.sp-empty-plans { text-align:center; padding:30px; }
.site-nav { gap:clamp(10px,1.25vw,20px); }
@media (max-width:1180px) and (min-width:861px) { .header-cta { display:none; } }