:root {
  --cream: #f4e4d9;
  --green: #2f503d;
  --green-deep: #244532;
  --gold: #b18e5b;
  --gold-text: #806033;
  --gold-bright: #efc778;
  --gold-shimmer: linear-gradient(110deg, transparent 30%, rgba(239, 199, 120, .18) 40%, rgba(255, 225, 161, .96) 50%, rgba(239, 199, 120, .18) 60%, transparent 70%);
  --white: #fff8f1;
  --serif: "Baskervville", Georgia, serif;
  --sans: "Montserrat Alternates", "Trebuchet MS", sans-serif;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --gutter: 24px;
}
/* Scope changing gold values to the material, not its whole text/layout subtree.
   Browsers without @property support retain the original inherited fallback. */
@property --shimmer-position { syntax: "<percentage>"; inherits: false; initial-value: 200%; }
@property --shimmer-glint { syntax: "<number>"; inherits: false; initial-value: 0; }
.site-header__mark::after, .hero__logo-wrap::after, .site-header__rule::after,
.mobile-menu::after, .eyebrow > span::after, .service::after, .about__statement::before,
main > section + section::before, .timeline__dot::after, .timeline__progress::after,
.site-footer__legal i::after { --shimmer-position: inherit; --shimmer-glint: inherit; }
.timeline__track, .timeline__progress, .timeline__steps, .timeline__step, .timeline__dot {
  --shimmer-position: inherit;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; }
body { margin: 0; background: var(--cream); color: var(--green); font: 400 16px/1.6 var(--sans); -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; }
h1 { font-size: 44px; line-height: 1.06; }
h2 { font-size: 36px; line-height: 1.08; }
h3 { font-size: 24px; line-height: 1.25; }
:focus-visible { outline: 3px solid var(--green); outline-offset: 6px; }
.section--green :focus-visible, .button:focus-visible { outline-color: var(--gold-bright); box-shadow: 0 0 0 8px var(--green); }
::selection { background: var(--gold-bright); color: var(--green-deep); }
[hidden] { display: none !important; }
.page-shell { width: min(100% - var(--gutter) * 2, 1300px); margin-inline: auto; }
.section--cream { background: var(--cream); color: var(--green); }
.section--green { background: var(--green); color: var(--white); }
main > section + section { position: relative; border-top: 2px solid var(--gold); }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: fixed; z-index: 100; top: 12px; left: 12px; padding: 12px 16px; background: var(--white); transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.desktop-only { display: none; }
.button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 26px; min-height: 58px; padding: 15px 22px; border: 1px solid transparent; --cta-radius: 10px; border-radius: var(--cta-radius); background: var(--green); color: var(--white); font-size: 16px; line-height: 1.4; --shimmer-glint: 0; transition: background .2s, box-shadow .2s, transform .2s; }
.button > span { position: relative; color: var(--gold-bright); font-size: 25px; line-height: 1; }
.button > span::after { content: "→"; position: absolute; inset: 0; color: #fff6df; opacity: var(--shimmer-glint, 0); pointer-events: none; text-shadow: 0 0 8px #fff0c9a0; }
.button:active { transform: translateY(1px); }
/* OriginKit orbit: one full lap, a soft moving fade, then three seconds invisible.
   Unlike the other gold details, CTAs ignore scroll. */
@property --comet-arc { syntax: "<angle>"; inherits: true; initial-value: 108deg; }
@property --comet-solid { syntax: "<angle>"; inherits: true; initial-value: 32.4deg; }
@keyframes cta-orbit-lap {
  0% { transform: rotate(0deg); opacity: 0; }
  2.4691% { opacity: 1; }
  51.85185% { transform: rotate(-360deg); opacity: 1; }
  55.55556% { opacity: .9; }
  59.25926% { opacity: .4; }
  61.11111% { opacity: .1; }
  62.96296%, 100% { transform: rotate(-437.143deg); opacity: 0; }
}
.cta-orbit { position: absolute; inset: 1px; padding: 1px; border-radius: calc(var(--cta-radius) - 2px); contain: paint; pointer-events: none; background: rgb(177 142 91 / .22); -webkit-mask: linear-gradient(#000 0 0) border-box, linear-gradient(#000 0 0) content-box; mask: linear-gradient(#000 0 0) border-box, linear-gradient(#000 0 0) content-box; -webkit-mask-composite: xor; mask-composite: exclude; }
.cta-orbit__comet { position: absolute; top: 50%; left: 50%; width: var(--orbit-size, 400px); height: var(--orbit-size, 400px); margin-top: calc(var(--orbit-size, 400px) / -2); margin-left: calc(var(--orbit-size, 400px) / -2); transform: rotate(0deg); transform-origin: center; animation: cta-orbit-lap 8.1s linear infinite; --comet-arc: 108deg; --comet-solid: 32.4deg; transition: --comet-arc .3s var(--ease), --comet-solid .3s var(--ease); }
.cta-orbit__halo, .cta-orbit__core { position: absolute; inset: 0; background: conic-gradient(from 0deg, #ffdda0 0deg, #ffdda0 var(--comet-solid), transparent var(--comet-arc), transparent 360deg); }
.cta-orbit__halo { filter: blur(13px); }
.cta-orbit__core { opacity: .45; }
.button:focus-visible .cta-orbit__comet { --comet-arc: 360deg; --comet-solid: 360deg; }
@media (hover: hover) {
  .button:hover .cta-orbit__comet { --comet-arc: 360deg; --comet-solid: 360deg; }
  .button:hover { background: var(--green-deep); box-shadow: 0 5px 18px #24453220; }
  .desktop-nav > a:not(.button):hover, .contact__links a:hover { text-decoration: underline; text-underline-offset: 5px; }
}
.eyebrow { display: flex; align-items: center; justify-content: center; gap: 20px; min-height: 24px; font: 400 12px/1.6 var(--sans); letter-spacing: 3px; text-transform: uppercase; text-align: center; }
.eyebrow > span { position: relative; flex: 0 0 42px; height: 1px; background: var(--gold); }
.eyebrow--light { color: var(--cream); }
.brand-wordmark { display: block; width: 100%; aspect-ratio: 810.660785 / 127.355756; background: currentColor; -webkit-mask: url("assets/marca/aline-quiteria-lettering-vetorial.svg") center / contain no-repeat; mask: url("assets/marca/aline-quiteria-lettering-vetorial.svg") center / contain no-repeat; }

/* Header stays in the document flow; the full-width rule never crosses the mark. */
.site-header { position: relative; z-index: 10; background: var(--cream); }
.site-header__inner { height: 96px; display: flex; align-items: center; justify-content: space-between; }
.site-header__mark { position: relative; width: 40px; display: flex; align-items: center; min-height: 66px; }
.site-header__mark img { width: 100%; max-height: 66px; }
.site-header__rule { position: relative; height: 1px; background: var(--gold); }
.desktop-nav { display: none; }
.menu-toggle { display: grid; align-content: center; gap: 7px; width: 44px; height: 44px; padding: 10px; border: 0; background: transparent; cursor: pointer; }
.menu-toggle span { display: block; height: 1px; background: var(--green); transition: transform .2s; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
.mobile-menu { position: absolute; top: 100%; inset-inline: 0; display: grid; gap: 8px; padding: 20px var(--gutter) 28px; background: var(--cream); border-bottom: 2px solid var(--gold); box-shadow: 0 14px 20px #24453212; }
.mobile-menu::after { content: ""; position: absolute; inset: auto 0 -2px; height: 2px; pointer-events: none; background: var(--gold-shimmer); background-size: 250% 100%; background-repeat: no-repeat; background-position: var(--shimmer-position, 200%) center; }
.mobile-menu > a:not(.button) { padding: 12px 0; min-height: 44px; }
.no-js .menu-toggle { display: none; }
.no-js .desktop-nav { display: flex; flex-wrap: wrap; gap: 10px; font-size: 13px; }
.no-js .desktop-nav .button { display: none; }

/* Optical bounds are cropped in the SVG, not approximated with CSS offsets. */
.hero__inner { display: flex; flex-direction: column; align-items: center; text-align: center; padding-block: 51px 40px; }
.hero__logo-wrap { position: relative; display: block; width: 165px; aspect-ratio: 810.6607056 / 594.8153076; margin-bottom: 42px; }
.hero__logo { width: 100%; height: auto; }
.hero__practice { max-width: 342px; font-size: 11px; line-height: 1.55; letter-spacing: 2.2px; text-transform: uppercase; margin-bottom: 40px; text-wrap: balance; }
.hero__practice > span { display: none; }
.hero h1 { max-width: 600px; margin-bottom: 36px; }
.hero__lead { max-width: 560px; line-height: 1.6; margin-bottom: 32px; text-wrap: pretty; }
.hero__cta { width: 100%; max-width: 342px; }
.hero__signature { margin-top: 28px; font: italic 16px/1.4 var(--serif); }

/* About: the same mark, photograph and exact Penpot frame, reordered for mobile. */
.about { overflow-x: clip; }
.about__inner { display: grid; justify-items: center; padding-block: 44px 36px; }
.about__content { display: contents; }
.about .eyebrow { grid-row: 1; margin-bottom: 32px; }
.about .brand-name { grid-row: 2; width: min(100%, 318px); margin-bottom: 33px; }
.about__portrait-wrap { grid-row: 3; position: relative; width: min(100%, 342px); aspect-ratio: 530 / 750; margin-bottom: 46px; }
.about__portrait-frame { position: absolute; inset: 0 0 auto; aspect-ratio: 530 / 750; }
.about__portrait { position: absolute; width: 88.6792%; left: 4.1509%; top: 2.6667%; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 28px; }
.about__copy { grid-row: 4; width: min(100%, 560px); display: grid; gap: 32px; text-align: center; line-height: 1.6; }
.about__statement { grid-row: 5; position: relative; width: min(100%, 560px); margin-top: 28px; padding-top: 26px; border-top: 1.5px solid var(--gold); font: 400 24px/1.25 var(--serif); text-align: center; }
.about__statement::before { content: ""; position: absolute; inset: -1.5px 0 auto; height: 1.5px; pointer-events: none; background: var(--gold-shimmer); background-size: 250% 100%; background-repeat: no-repeat; background-position: var(--shimmer-position, 200%) center; }

/* Text opacity and position follow scroll progress directly. */
.scroll-reveal { opacity: 0; transform: translate3d(0, 18px, 0); }


/* Services use content-height rows; descriptions are vertically centered. */
.practice { background: radial-gradient(ellipse at 50% 18%, #f9ece4, var(--cream) 82%); }
.practice__inner { padding-block: 40px 48px; text-align: center; }
.practice h2 { max-width: 840px; margin: 32px auto 24px; }
.practice__intro { max-width: 950px; margin: 0 auto 32px; }
.service { position: relative; padding: 26px 0; border-bottom: 1px solid var(--gold); display: grid; gap: 20px; align-items: center; }
.service h3, .service p { min-width: 0; }
.service p { line-height: 1.6; }
.service:last-child { border-bottom: 0; }

/* The progress composition stays visible while the scroll paints the line. */
.path__pin { display: flex; align-items: center; min-height: 85svh; background: radial-gradient(ellipse at 50% 35%, #30583f, #2b4c3a); }
.path__pin.is-offscreen { visibility: hidden; }
.path__inner { padding-block: 46px 46px; text-align: center; }
.path .eyebrow { font-size: 11px; letter-spacing: 2.4px; gap: 12px; }
.path .eyebrow > span { flex-basis: 22px; }
.path h2 { max-width: 840px; margin: 36px auto 24px; }
.path__intro { max-width: 1060px; margin-inline: auto; }
.timeline { position: relative; margin: 32px auto; width: min(100%, 342px); --progress: 1; }
.timeline__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.timeline__step { position: relative; min-height: 100px; display: flex; align-items: flex-start; gap: 22px; padding: 0 0 0 20px; text-align: left; font: 400 24px/1.3 var(--serif); }
.timeline__step:last-child { min-height: 32px; }
.timeline__dot { position: relative; flex: 0 0 14px; width: 14px; height: 14px; margin-top: 8px; border-radius: 50%; background: var(--gold); }
.timeline__step.is-active .timeline__dot { background: var(--gold-bright); }
.timeline__track { position: absolute; left: 25px; top: 15px; bottom: 17px; width: 4px; }
.timeline__base { display: none; }
/* Each milestone is revealed only when the scroll-driven gold reaches it.
   Opacity preserves the layout and keeps the labels available to screen readers. */
.timeline.is-scroll-driven .timeline__step > span { opacity: 0; }
.timeline.is-scroll-driven .timeline__dot { transform: scale(.65); }
.timeline.is-scroll-driven .timeline__step > span:last-child { transform: translateY(8px); }
.timeline.is-scroll-driven .timeline__step.is-active > span { opacity: 1; transform: none; }
.timeline.is-scroll-driven .timeline__step.is-current .timeline__dot { background: #ecd29e; }
.timeline.is-scroll-driven .timeline__progress { background: var(--gold-bright); }
.timeline.is-scroll-driven .timeline__progress::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(20deg, transparent 30%, rgba(255, 240, 201, .72) 50%, transparent 70%); background-size: 100% 250%; background-repeat: no-repeat; background-position: center var(--shimmer-position, 200%); }

.timeline__progress { position: absolute; inset: 0; border-radius: 3px; background: linear-gradient(90deg, var(--gold), #ffdfa0, var(--gold-bright)); transform: scaleY(var(--progress)); transform-origin: center top; }

.path__closing { max-width: 1230px; margin-inline: auto; }

/* Contact and footer share one centered, fluid container. */
.contact { background: radial-gradient(ellipse at 50% 35%, #f8eadf, var(--cream) 85%); }
.contact__inner { padding-top: 46px; text-align: center; }
.contact h2 { max-width: 980px; margin: 34px auto 48px; font-size: 32px; line-height: 1.12; }
.contact__cta { width: min(100%, 342px); }
.contact__links { display: grid; justify-content: center; gap: 12px; margin-top: 42px; font-style: normal; }
.contact__links a { min-height: 44px; display: flex; justify-content: center; align-items: center; gap: 14px; font-size: 16px; white-space: nowrap; }
.contact__icon { width: 21px; height: 21px; object-fit: contain; flex: 0 0 auto; }
.site-footer { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; column-gap: 18px; padding-block: 38px max(36px, env(safe-area-inset-bottom)); }
.site-footer__rule { flex: 0 0 100%; height: 1px; background: var(--green); opacity: .6; margin-bottom: 28px; }
.site-footer__name { width: 164px; }
.site-footer__legal { display: flex; flex: 0 0 100%; justify-content: center; align-items: center; gap: 12px; margin-top: 16px; font-size: 12px; line-height: 1.6; white-space: nowrap; }
.site-footer__legal span:first-child { text-transform: uppercase; letter-spacing: 1.2px; }
.site-footer__legal i { position: relative; width: 3px; height: 3px; flex: 0 0 3px; border-radius: 50%; background: var(--gold-text); }
.site-footer__legal i::after { content: ""; position: absolute; inset: -2px; border-radius: 50%; background: #fff0c9; opacity: var(--shimmer-glint, 0); box-shadow: 0 0 8px #fff0c9a0; pointer-events: none; }
.intro { display: none; position: fixed; inset: 0; z-index: 50; pointer-events: none; background: var(--cream); }
.intro.is-running { display: grid; place-items: center; }
.intro__panel { display: none; }
.intro__brand { display: flex; flex-direction: column; align-items: center; width: min(70vw, 320px); }
.intro__symbol { width: 90px; margin-bottom: 16px; }
.intro__name { color: var(--green); }
.intro__role { margin-top: 14px; font-size: 10px; letter-spacing: 5px; text-transform: uppercase; }

/* Velora's borderless 110deg light sweep, confined to existing gold materials. */
.gold-contour { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.gold-contour-shimmer { pointer-events: none; }
.site-header__rule::after, .eyebrow > span::after, .service:not(:last-child)::after,
main > section + section::before, .timeline__dot::after {
  content: "";
  position: absolute;
  pointer-events: none;
  background: var(--gold-shimmer);
  background-size: 250% 100%; background-repeat: no-repeat;
  background-position: var(--shimmer-position, 200%) center;
}
.site-header__rule::after, .eyebrow > span::after { inset: 0; }
.service:not(:last-child)::after { inset: auto 0 -1px; height: 1.5px; filter: drop-shadow(0 0 2px rgba(235, 188, 101, .55)); }
main > section + section::before { inset: -2px 0 auto; height: 2px; }
.timeline__dot::after { inset: 0; border-radius: inherit; }
.site-header__mark::after, .hero__logo-wrap::after {

  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: var(--gold-shimmer);
  background-size: 250% 100%; background-repeat: no-repeat;
  background-position: var(--shimmer-position, 200%) center;
  -webkit-mask: url("assets/marca/aline-quiteria-simbolo-vetorial.svg") center / contain no-repeat;
  mask: url("assets/marca/aline-quiteria-simbolo-vetorial.svg") center / contain no-repeat;
}
/* Endpoints have no residual light, including after the automatic hero pass. */
.site-header__mark::after, .hero__logo-wrap::after { opacity: var(--shimmer-glint, 0); }
.hero__logo-wrap::after {
  -webkit-mask-image: url("assets/marca/aline-quiteria-logo-vetorial.svg");
  mask-image: url("assets/marca/aline-quiteria-logo-vetorial.svg");
  clip-path: inset(0 0 37% 0);
}
@media (max-width: 359px) {
  :root { --gutter: 20px; }
  h1 { font-size: 38px; }
  h2 { font-size: 32px; }
  .eyebrow { gap: 14px; }
  .eyebrow > span { flex-basis: 28px; }
  .path .eyebrow { letter-spacing: 1.6px; gap: 8px; }
  .path .eyebrow > span { flex-basis: 16px; }
  .contact__links a { font-size: 14px; gap: 10px; }
  .timeline__step { font-size: 22px; }
}
@media (min-width: 600px) {
  :root { --gutter: 40px; }
  .hero__logo-wrap { width: 260px; }
  .hero__inner { padding-block: 52px; }
  .hero__practice { max-width: 700px; font-size: 12px; }
  h1 { font-size: 58px; }
  h2 { font-size: 48px; }
  .hero__lead { font-size: 18px; max-width: 740px; }
  .about__portrait-wrap { width: 400px; }
  .about__inner { padding-block: 56px; }
  .about__copy { font-size: 18px; }
  .about__statement { font-size: 28px; }
  .practice__inner { padding-block: 60px; }
  .service { grid-template-columns: 42% 1fr; gap: 32px; text-align: left; min-height: 130px; }
  .practice__intro { font-size: 18px; }
  .path__inner { padding-block: 56px; }
  .path__intro, .path__closing { font-size: 18px; }
  .contact h2 { font-size: 48px; }
  .contact__links a { font-size: 18px; }
}
@media (min-width: 1000px) {
  :root { --gutter: clamp(40px, 4.86vw, 70px); }
  .desktop-only { display: initial; }
  .mobile-only { display: none; }
  .site-header__inner { max-width: 1260px; height: 120px; }
  .site-header__mark { width: 54px; }
  .site-header__mark img { max-height: 92px; }
  .menu-toggle, .mobile-menu { display: none !important; }
  .desktop-nav { display: flex; align-items: center; gap: 30px; font-size: 15px; transform: translateY(5.5px); }
  .desktop-nav > a { display: flex; align-items: center; min-height: 44px; }
  .button { --cta-radius: 14px; font-size: 20px; }
  .button--compact { min-height: 44px; width: 212px; margin-left: 2px; padding: 10px 18px; font-size: 14px; }
  .hero__inner { min-height: 1004px; padding-block: 44px 42px; }
  .hero__logo-wrap { width: 410px; margin-bottom: 35px; }
  .hero__practice { font-size: 14px; letter-spacing: 3px; line-height: 26px; margin-bottom: 50px; max-width: 760px; }
  .hero h1 { width: 100%; max-width: 1120px; font-size: clamp(60px, 5.278vw, 76px); line-height: 1.14; min-height: 190px; margin-bottom: 38px; }
  .hero__lead { max-width: 920px; font-size: 18px; line-height: 1.55; margin-bottom: 52px; }
  .hero__cta { width: 330px; min-height: 70px; }
  .hero__signature { margin-top: 42px; font-size: 20px; line-height: 1.25; }
  .eyebrow { font-size: 14px; letter-spacing: 4px; gap: 28px; min-height: 28px; }
  .eyebrow > span { flex-basis: 46px; }
  .about__inner { width: min(100% - 9.167%, 1308px); grid-template-columns: minmax(0, 530fr) minmax(0, 719fr); gap: 59px; align-items: start; justify-items: stretch; min-height: 898px; padding-block: 58px 80px; }
  .about__portrait-wrap { grid-row: auto; width: 100%; max-width: 530px; aspect-ratio: 530/750; margin: 0; }
  .about__portrait { width: 88.6792%; left: 4.1509%; top: 2.6667%; border-radius: 32px; }
  .about__content { display: block; width: min(100%, 620px); padding-top: 45px; }
  .about .eyebrow { justify-content: flex-start; margin-bottom: 34px; }
  .about .brand-name { width: min(100%, 390px); margin-bottom: 52px; }
  .about__copy { width: 100%; font-size: 18px; gap: 24px; line-height: 1.55; text-align: left; max-width: 620px; }
  .about__copy p { min-height: 66px; }
  .about__copy p:last-child { min-height: 92px; }
  .about__statement { width: 100%; margin-top: 34px; padding-top: 34px; font-size: 28px; line-height: 1.25; text-align: left; max-width: 615px; }
  .practice__inner { padding-block: 68px 0; min-height: 1078px; }
  .practice .eyebrow { color: var(--gold-text); text-shadow: 0 0 9px rgb(255 240 201 / var(--shimmer-glint, 0)); }
  .practice h2, .path h2 { font-size: 62px; line-height: 1.1; }
  .practice h2 { margin-block: 22px 35px; }
  .practice__intro { line-height: 1.6; margin-bottom: 59px; }
  .service { grid-template-columns: 45.63% 1fr; min-height: 125px; padding: 26px 32px; gap: 34px; }
  .service:first-child { min-height: 150px; }
  .service:last-child { min-height: 147px; }
  .service h3 { font-size: 28px; }
  .service p { font-size: 18px; line-height: 1.55; }
  .path__inner { min-height: 808px; padding-block: 108px 62px; }
  .path .eyebrow { font-size: 14px; letter-spacing: 4px; gap: 24px; }
  .path .eyebrow > span { flex-basis: 43px; }
  .path h2 { margin: 32px auto 44px; }
  .path__intro { line-height: 1.6; }
  .timeline { width: 100%; max-width: 1280px; margin-block: 56px; }
  .timeline__track { left: 0; right: 0; top: 11px; bottom: auto; width: auto; height: 5px; }
  .timeline__progress { transform: scaleX(var(--progress)); transform-origin: left center; background: linear-gradient(180deg, #e3c68e, var(--gold)); }

  .timeline.is-scroll-driven .timeline__progress::after { background-image: var(--gold-shimmer); background-size: 250% 100%; background-repeat: no-repeat; background-position: var(--shimmer-position, 200%) center; }
  .timeline__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .timeline__step { min-height: 70px; padding: 0; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; font-size: 28px; }
  .timeline__dot { flex-basis: 22px; width: 22px; height: 22px; margin-top: 2.5px; }
  .path__closing { line-height: 1.6; }
  .contact__inner { padding-top: 88px; }
  .contact h2 { font-size: 68px; line-height: 1.12; min-height: 250px; margin: 32px auto 35px; }
  .contact__cta { width: 370px; max-width: none; min-height: 76px; }
  .contact__links { margin-top: 68px; gap: 14px; }
  .contact__links a { font-size: 20px; }
  .contact__icon { width: 26px; height: 26px; }
  .site-footer { max-width: 1280px; justify-content: flex-start; padding-top: 92px; padding-bottom: 55px; }
  .site-footer__rule { margin-bottom: 44px; }
  .site-footer__name { width: 165px; }
  .site-footer__legal { flex: 1; justify-content: space-between; margin: 0; font-size: 14px; }
  .site-footer__legal i { display: none; }
}
@media (min-width: 1440px) {
  .page-shell { width: min(100% - var(--gutter) * 2, clamp(1300px, calc(62.5vw + 400px), 1600px)); }
  .site-header__inner { max-width: clamp(1260px, calc(70.833vw + 240px), 1600px); }
  .hero h1 { max-width: clamp(1120px, calc(25vw + 760px), 1240px); font-size: clamp(76px, 4.4vw, 86px); }
  .hero__lead { max-width: clamp(920px, calc(25vw + 560px), 1040px); }
  .about__inner { width: min(100% - 9.167%, clamp(1308px, calc(60.833vw + 432px), 1600px)); gap: clamp(59px, calc(8.542vw - 64px), 100px); min-height: clamp(898px, calc(18.75vw + 628px), 988px); }
  .about__portrait-wrap { max-width: clamp(530px, calc(14.583vw + 320px), 600px); }
  .about__content { width: min(100%, clamp(620px, calc(25vw + 260px), 740px)); padding-top: clamp(45px, calc(5.208vw - 30px), 70px); }
  .about .brand-name { width: min(100%, clamp(390px, calc(8.333vw + 270px), 430px)); margin-bottom: clamp(52px, calc(.833vw + 40px), 56px); }
  .about__copy { max-width: clamp(620px, calc(25vw + 260px), 740px); font-size: clamp(18px, calc(.208vw + 15px), 19px); gap: clamp(24px, calc(.833vw + 12px), 28px); }
  .about__statement { max-width: clamp(615px, calc(26.042vw + 240px), 740px); margin-top: clamp(34px, calc(1.667vw + 10px), 42px); font-size: clamp(28px, calc(.417vw + 22px), 30px); }
  .practice__intro { max-width: clamp(950px, calc(31.25vw + 500px), 1100px); }
  .service h3 { font-size: clamp(28px, calc(.417vw + 22px), 30px); }
  .service p { max-width: 780px; font-size: clamp(18px, calc(.208vw + 15px), 19px); }
  .path h2 { max-width: clamp(840px, calc(33.333vw + 360px), 1000px); font-size: clamp(62px, calc(1.25vw + 44px), 68px); }
  .path__intro { max-width: clamp(1060px, calc(29.167vw + 640px), 1200px); }
  .timeline { max-width: clamp(1280px, calc(45.833vw + 620px), 1500px); }
  .path__closing { max-width: clamp(1230px, calc(45.833vw + 570px), 1450px); }
  .contact h2 { max-width: clamp(980px, calc(25vw + 620px), 1100px); font-size: clamp(68px, calc(.833vw + 56px), 72px); }
  .site-footer { max-width: clamp(1280px, calc(66.667vw + 320px), 1600px); }
}
/* One wide-screen unit keeps typography, spacing and gold materials in proportion. */
@media (min-width: 1920px) {
  :root { --wide-unit: calc(100vw / 1920); --ui-unit: var(--wide-unit); --gutter: calc(160 * var(--wide-unit)); }
  .page-shell, .site-header__inner, .site-footer { width: calc(100% - var(--gutter) * 2); max-width: none; }
  .site-header__inner { height: calc(120 * var(--ui-unit)); }
  .site-header__mark { width: calc(54 * var(--ui-unit)); min-height: calc(66 * var(--ui-unit)); }
  .site-header__mark img { max-height: calc(92 * var(--ui-unit)); }
  .desktop-nav { gap: calc(30 * var(--ui-unit)); font-size: calc(15 * var(--ui-unit)); transform: translateY(calc(5.5 * var(--ui-unit))); }
  .desktop-nav > a { min-height: calc(44 * var(--ui-unit)); }
  .button { --cta-radius: calc(14 * var(--ui-unit)); gap: calc(26 * var(--ui-unit)); padding: calc(15 * var(--ui-unit)) calc(22 * var(--ui-unit)); border-width: var(--ui-unit); font-size: calc(20 * var(--ui-unit)); }
  .button > span { font-size: calc(25 * var(--ui-unit)); flex: 0 0 auto; }
  .button--compact { width: calc(212 * var(--ui-unit)); min-height: calc(44 * var(--ui-unit)); margin-left: calc(2 * var(--ui-unit)); padding: calc(10 * var(--ui-unit)) calc(18 * var(--ui-unit)); font-size: calc(14 * var(--ui-unit)); }
  .cta-orbit { inset: var(--ui-unit); padding: var(--ui-unit); border-radius: calc(var(--cta-radius) - 2 * var(--ui-unit)); }
  .cta-orbit__halo { filter: blur(calc(13 * var(--ui-unit))); }
  .hero__inner { min-height: 0; padding-block: calc(44 * var(--ui-unit)) calc(42 * var(--ui-unit)); }
  .hero__logo-wrap { width: calc(410 * var(--ui-unit)); margin-bottom: calc(35 * var(--ui-unit)); flex: 0 0 auto; }
  .hero__practice { max-width: calc(760 * var(--ui-unit)); font-size: calc(14 * var(--ui-unit)); line-height: 1.85; letter-spacing: calc(3 * var(--ui-unit)); margin-bottom: calc(50 * var(--ui-unit)); }
  .hero h1 { max-width: calc(1240 * var(--ui-unit)); min-height: 0; font-size: calc(86 * var(--ui-unit)); margin-bottom: calc(38 * var(--ui-unit)); }
  .hero__lead { max-width: min(100%, 58em); font-size: calc(18 * var(--ui-unit)); margin-bottom: calc(52 * var(--ui-unit)); }
  .hero__cta { width: calc(330 * var(--ui-unit)); max-width: 100%; min-height: calc(70 * var(--ui-unit)); }
  .hero__signature { margin-top: calc(42 * var(--ui-unit)); font-size: calc(20 * var(--ui-unit)); }
  .eyebrow, .path .eyebrow { font-size: calc(14 * var(--ui-unit)); letter-spacing: calc(4 * var(--ui-unit)); gap: calc(28 * var(--ui-unit)); min-height: calc(28 * var(--ui-unit)); }
  .eyebrow > span, .path .eyebrow > span { flex-basis: calc(46 * var(--ui-unit)); height: var(--ui-unit); }
  .about__inner { grid-template-columns: minmax(0, 600fr) minmax(0, 740fr); gap: calc(100 * var(--ui-unit)); align-items: center; min-height: 0; padding-block: calc(80 * var(--ui-unit)); }
  .about__portrait-wrap { max-width: calc(600 * var(--ui-unit)); justify-self: center; }
  .about__portrait { border-radius: calc(32 * var(--ui-unit)); }
  .about__content { width: min(100%, calc(740 * var(--ui-unit))); justify-self: center; padding-top: 0; }
  .about .eyebrow { margin-bottom: calc(34 * var(--ui-unit)); }
  .about .brand-name { width: min(100%, calc(430 * var(--ui-unit))); margin-bottom: calc(56 * var(--ui-unit)); }
  .about__copy { max-width: none; font-size: calc(19 * var(--ui-unit)); gap: calc(28 * var(--ui-unit)); }
  .about__copy p { min-height: calc(66 * var(--ui-unit)); }
  .about__copy p:last-child { min-height: calc(92 * var(--ui-unit)); }
  .about__statement { max-width: none; font-size: calc(30 * var(--ui-unit)); margin-top: calc(42 * var(--ui-unit)); padding-top: calc(34 * var(--ui-unit)); border-top-width: calc(1.5 * var(--ui-unit)); }
  .about__statement::before { top: calc(-1.5 * var(--ui-unit)); height: calc(1.5 * var(--ui-unit)); }
  .practice__inner { min-height: 0; padding-block: calc(68 * var(--ui-unit)) calc(48 * var(--ui-unit)); }
  .practice h2 { max-width: calc(1100 * var(--ui-unit)); font-size: calc(62 * var(--ui-unit)); margin-block: calc(22 * var(--ui-unit)) calc(35 * var(--ui-unit)); }
  .practice__intro { max-width: min(100%, 61em); font-size: calc(18 * var(--ui-unit)); margin-bottom: calc(59 * var(--ui-unit)); }
  .service { min-height: calc(125 * var(--ui-unit)); padding: calc(26 * var(--ui-unit)) calc(32 * var(--ui-unit)); gap: calc(34 * var(--ui-unit)); border-bottom-width: var(--ui-unit); }
  .service:first-child { min-height: calc(150 * var(--ui-unit)); }
  .service:last-child { min-height: calc(147 * var(--ui-unit)); }
  .service h3 { font-size: calc(30 * var(--ui-unit)); }
  .service p { max-width: min(100%, 42em); font-size: calc(19 * var(--ui-unit)); }
  .service:not(:last-child)::after { bottom: calc(-1 * var(--ui-unit)); height: calc(1.5 * var(--ui-unit)); filter: drop-shadow(0 0 calc(2 * var(--ui-unit)) rgba(235,188,101,.55)); }
  .site-header__rule { height: var(--ui-unit); }
  main > section + section { border-top-width: calc(2 * var(--wide-unit)); }
  main > section + section::before { top: calc(-2 * var(--wide-unit)); height: calc(2 * var(--wide-unit)); }
  .path__pin { min-height: 85svh; }
  .path__inner { min-height: calc(808 * var(--ui-unit)); padding-block: calc(108 * var(--ui-unit)) calc(62 * var(--ui-unit)); }
  .path h2 { max-width: calc(1000 * var(--ui-unit)); font-size: calc(68 * var(--ui-unit)); margin-block: calc(32 * var(--ui-unit)) calc(44 * var(--ui-unit)); }
  .path__intro { max-width: min(100%, 66.66em); font-size: calc(18 * var(--ui-unit)); }
  .timeline { max-width: none; margin-block: calc(56 * var(--ui-unit)); }
  .timeline__step { min-height: calc(70 * var(--ui-unit)); gap: calc(8 * var(--ui-unit)); font-size: calc(28 * var(--ui-unit)); }
  .timeline__dot { flex-basis: calc(22 * var(--ui-unit)); width: calc(22 * var(--ui-unit)); height: calc(22 * var(--ui-unit)); margin-top: calc(2.5 * var(--ui-unit)); }
  .timeline__track { top: calc(11 * var(--ui-unit)); height: calc(5 * var(--ui-unit)); }
  .path__closing { max-width: min(100%, 80em); font-size: calc(18 * var(--ui-unit)); }
  .contact__inner { padding-top: calc(88 * var(--ui-unit)); }
  .contact h2 { max-width: calc(1100 * var(--ui-unit)); min-height: 0; font-size: calc(72 * var(--ui-unit)); margin-block: calc(32 * var(--ui-unit)) calc(35 * var(--ui-unit)); }
  .contact__cta { width: calc(370 * var(--ui-unit)); max-width: 100%; min-height: calc(76 * var(--ui-unit)); }
  .contact__links { margin-top: calc(68 * var(--ui-unit)); gap: calc(14 * var(--ui-unit)); }
  .contact__links a { font-size: calc(20 * var(--ui-unit)); min-height: calc(44 * var(--ui-unit)); gap: calc(14 * var(--ui-unit)); }
  .contact__icon { width: calc(26 * var(--ui-unit)); height: calc(26 * var(--ui-unit)); }
  .site-footer { column-gap: calc(18 * var(--ui-unit)); padding-block: calc(92 * var(--ui-unit)) calc(55 * var(--ui-unit)); }
  .site-footer__rule { height: var(--ui-unit); margin-bottom: calc(44 * var(--ui-unit)); }
  .site-footer__name { width: calc(165 * var(--ui-unit)); }
  .site-footer__legal { font-size: calc(14 * var(--ui-unit)); gap: calc(12 * var(--ui-unit)); }
  .site-footer__legal span:first-child { letter-spacing: calc(1.2 * var(--ui-unit)); }
}
@media (min-width: 1920px) and (min-aspect-ratio: 12/5) {
  .path__inner { min-height: 0; padding-block: calc(44 * var(--ui-unit)); }
  .path h2 { margin-block: calc(20 * var(--ui-unit)) calc(24 * var(--ui-unit)); font-size: calc(54 * var(--ui-unit)); }
  .timeline { margin-block: calc(40 * var(--ui-unit)); }
}

/* Mobile browser chrome does not change the pinned scene's height mid-swipe. */
@media (max-width: 999px) {
  .path__pin { min-height: calc(var(--scene-height, 100svh) * .85); }
}
/* Fit the whole narrative on ordinary short screens before enabling its pin. */
@media (min-width: 1000px) and (max-width: 1919px) and (max-height: 820px) {
  .path__inner { min-height: 0; padding-block: 44px; }
  .path h2 { margin-block: 20px 24px; font-size: 54px; }
  .timeline { margin-block: 40px; }
}
@media (min-width: 1000px) and (max-width: 1919px) and (max-height: 600px) {
  .path__inner { padding-block: 22px; }
  .path h2 { margin-block: 12px 16px; }
  .timeline { margin-block: 28px; }
}
@media (max-width: 599px) {
  html.mobile-path-regular .path__inner { padding-block: 28px; }
  html.mobile-path-regular .path h2 { margin-block: 20px; font-size: 32px; }
  html.mobile-path-regular .path__intro, html.mobile-path-regular .path__closing { font-size: 14px; line-height: 1.5; }
  html.mobile-path-regular .timeline { margin-block: 26px; }
  html.mobile-path-regular .timeline__step { min-height: 76px; font-size: 22px; }
  html.mobile-path-regular .timeline__step:last-child { min-height: 32px; }
}
/* The opening composition follows available height as well as width.
   The same unit keeps typography, spacing and decoration coherent at browser zoom. */
@media (min-width: 1000px) {
  .site-header__inner { height: clamp(72px, 12.5svh, 120px); }
  .hero {
    --hero-ui: 1px;
    --hero-gap: clamp(calc(8 * var(--hero-ui)), calc((100svh - 600 * var(--hero-ui)) * .065), calc(24 * var(--hero-ui)));
  }
  .hero__inner { min-height: 0; padding-block: var(--hero-gap); }
  .hero__logo-wrap { width: clamp(calc(160 * var(--hero-ui)), calc((100svh - 420 * var(--hero-ui)) * .6), calc(340 * var(--hero-ui))); margin-bottom: var(--hero-gap); }
  .hero__practice { line-height: 1.85; margin-bottom: var(--hero-gap); }
  .hero h1 { min-height: 0; font-size: clamp(calc(46 * var(--hero-ui)), 8svh, calc(76 * var(--hero-ui))); margin-bottom: var(--hero-gap); }
  .hero__lead { margin-bottom: var(--hero-gap); }
  .hero__signature { margin-top: var(--hero-gap); font-size: calc(18 * var(--hero-ui)); }
}
@media (min-width: 1920px) {
  .site-header__inner { height: clamp(calc(72 * var(--ui-unit)), 12.5svh, calc(120 * var(--ui-unit))); }
  .hero { --hero-ui: var(--ui-unit); }
}
/* Give the mobile brand presence without changing its intrinsic proportions. */
@media (max-width: 599px) {
  .hero__logo-wrap { width: clamp(190px, 56vw, 228px); max-width: 100%; }
}
@media (max-width: 599px) {
  html.mobile-height-regular .site-header__inner { height: 78px; }
  html.mobile-height-regular .hero__inner { padding-block: 28px; }
  html.mobile-height-regular .hero__logo-wrap { margin-bottom: 24px; }
  html.mobile-height-regular .hero__practice, html.mobile-height-regular .hero h1, html.mobile-height-regular .hero__lead { margin-bottom: 24px; }
  html.mobile-height-regular .hero__signature { margin-top: 20px; }
}
@media (max-width: 599px) {
  html.mobile-height-short .site-header__inner { height: 60px; }
  html.mobile-height-short .site-header__mark { width: 28px; min-height: 44px; }
  html.mobile-height-short .site-header__mark img { max-height: 48px; }
  html.mobile-height-short .hero__inner { padding-block: 12px 14px; }
  html.mobile-height-short .hero__logo-wrap { width: clamp(160px, 46vw, 190px); margin-bottom: 12px; }
  html.mobile-height-short .hero__practice { font-size: 10px; letter-spacing: 1.4px; margin-bottom: 12px; }
  html.mobile-height-short .hero h1 { font-size: 30px; margin-bottom: 14px; }
  html.mobile-height-short .hero__lead { font-size: 14px; line-height: 1.5; margin-bottom: 16px; }
  html.mobile-height-short .hero__cta { min-height: 48px; padding-block: 10px; font-size: 14px; }
  html.mobile-height-short .hero__signature { margin-top: 14px; font-size: 13px; }
}
/* Recover vertical space on shorter phones before reducing the brand. */
@media (max-width: 599px) {
  html.mobile-height-medium .hero__inner { padding-block: 12px; }
  html.mobile-height-medium .hero__logo-wrap { width: clamp(190px, min(56vw, calc(190px + (var(--scene-height, 100svh) - 700px) * .7)), 228px); margin-bottom: 12px; }
  html.mobile-height-medium .hero__practice, html.mobile-height-medium .hero h1, html.mobile-height-medium .hero__lead { margin-bottom: 12px; }
  html.mobile-height-medium .hero h1 { font-size: clamp(38px, calc(38px + (var(--scene-height, 100svh) - 700px) * .15), 44px); }
  html.mobile-height-medium .hero__signature { margin-top: 14px; }
}
@media (max-width: 359px) {
  html.mobile-height-medium .hero__inner { padding-block: 10px; }
  html.mobile-height-medium .hero__practice { font-size: 10px; letter-spacing: 1.4px; }
  html.mobile-height-medium .hero h1 { font-size: 34px; }
  html.mobile-height-medium .hero__signature { font-size: 14px; }
}
@media (max-width: 599px) {
  html.mobile-height-small .hero__inner { padding-block: 8px 10px; }
  html.mobile-height-small .hero__practice, html.mobile-height-small .hero__logo-wrap { margin-bottom: 8px; }
  html.mobile-height-small .hero h1 { margin-bottom: 10px; }
  html.mobile-height-small .hero__lead { margin-bottom: 12px; }
  html.mobile-height-small .hero__signature { margin-top: 10px; }
}
@media (min-width: 600px) and (max-width: 999px) and (min-height: 600px) {
  .hero__inner { padding-block: 28px; }
  .hero__logo-wrap { width: 230px; margin-bottom: 24px; }
  .hero__practice, .hero h1, .hero__lead { margin-bottom: 24px; }
  .hero h1 { font-size: 52px; }
  .hero__signature { margin-top: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0s !important; animation-duration: 0s !important; }
  .cta-orbit__comet { animation: none !important; }
  .intro { display: none !important; }
  .scroll-reveal { opacity: 1 !important; transform: none !important; }
}