/* Paulo Moretti Engenharia — design tokens (gerado do design system) */

/* ===== fonts.css ===== */
/* Webfonts. All from Google Fonts — no custom type budget.
   Roboto: neo-grotesque with a genuine 100–900 range. Used for UI and headings.
   Mulish (formerly "Muli"): used at Light for body copy/paragraphs.
   Bodoni Moda: high-contrast Didone with optical sizes. Carries the aspirational register
     without the "romana" cliché. Display only — never UI, never below 24px. */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100..900&family=Mulish:wght@200..900&family=Bodoni+Moda:opsz,wght@6..96,400..700&display=swap');


/* ===== palette.css ===== */
/* Paulo Moretti Engenharia — base palette (raw ramps).
   Locked base values: --navy-800 #252853 (13.93:1 on white), --gold-500 #B6865B (3.21:1 on white).
   Ramps generated in OKLCH so lightness steps are perceptually even and hue never drifts. */
:root{
  /* Navy — brand primary. Base sits at 800: the brand colour IS a dark colour. */
  --navy-50:#f4f6ff;   /* 1.08 on white */
  --navy-100:#e9ecfc;  /* 1.18 */
  --navy-200:#d4d9f5;  /* 1.40 */
  --navy-300:#b4bbe3;  /* 1.88 — 7.40 on navy-800 */
  --navy-400:#8d94c5;  /* 2.93 — 4.76 on navy-800 */
  --navy-500:#686fa8;  /* 4.74 */
  --navy-600:#464c88;  /* 7.93 */
  --navy-700:#34386d;  /* 10.87 */
  --navy-800:#252853;  /* 13.93 — LOCKED BRAND VALUE */
  --navy-900:#17193c;  /* 16.93 */
  --navy-950:#0c0d27;  /* 19.05 */

  /* Gold / bronze — brand secondary. Base sits at 500 and FAILS AA for body text (3.21:1).
     600 and 700 are the accessible text variants. */
  --gold-50:#fff5ed;   /* 1.07 */
  --gold-100:#fcebdd;  /* 1.16 */
  --gold-200:#f5d8c0;  /* 1.36 — 10.26 on navy-800 */
  --gold-300:#e6bf9c;  /* 1.71 — 8.16 on navy-800 */
  --gold-400:#d1a278;  /* 2.29 — 6.07 on navy-800 */
  --gold-500:#B6865B;  /* 3.21 — LOCKED BRAND VALUE. Large text 24px+, surfaces, icons only. */
  --gold-600:#97683c;  /* 4.82 — minimum AA text gold */
  --gold-700:#83572d;  /* 6.24 — default text/link gold */
  --gold-800:#68421d;  /* 8.80 */
  --gold-900:#4d2f10;  /* 12.14 */
  --gold-950:#361f08;  /* 15.48 */

  /* Stone — the project's own neutral ramp. Warm bias (same hue family as the gold, chroma 0.004–0.013)
     so neutrals sit under the bronze instead of arguing with it. Replaces the site's ad-hoc greys. */
  --stone-0:#ffffff;
  --stone-50:#fcf9f7;  /* 1.05 */
  --stone-100:#f6f6f6; /* 1.11 */
  --stone-200:#eae5e1; /* 1.25 */
  --stone-300:#d8d1cc; /* 1.51 */
  --stone-400:#bcb4ae; /* 2.04 */
  --stone-500:#9a928c; /* 3.06 */
  --stone-600:#79716b; /* 4.79 — minimum AA secondary text */
  --stone-700:#5c5550; /* 7.32 */
  --stone-800:#433d38; /* 10.70 */
  --stone-900:#2b2723; /* 14.82 */
  --stone-950:#191512; /* 18.15 */

  /* Semantics — desaturated to sit inside the palette. Each is paired with an icon and a label:
     colour is never the only carrier. */
  --success-50:#f1f6f0; --success-100:#dfeadd; --success-300:#a3c29c;
  --success-500:#66945d; --success-600:#517e48; /* 4.74 */ --success-700:#3a6232; --success-900:#1a3614;

  --danger-50:#fef1ef; --danger-100:#fbdfda; --danger-300:#eea095;
  --danger-500:#cf5f52; --danger-600:#b5473c; /* 5.34 */ --danger-700:#923128; --danger-900:#56110c;

  /* Warning sits nearest the brand gold — it MUST always ship with its icon + label. */
  --warning-50:#f8f4e9; --warning-100:#efe6ce; --warning-300:#d1b46b;
  --warning-500:#ab7f00; --warning-600:#936800; /* 4.98 */ --warning-700:#764f00; --warning-900:#432800;

  --info-50:#eff5fb; --info-100:#dbe8f5; --info-300:#96bbe2;
  --info-500:#528ac3; --info-600:#3b74ab; /* 4.92 */ --info-700:#26598a; --info-900:#0a2f51;
}


/* ===== semantic-color.css ===== */
/* Semantic colour aliases. Consume THESE, never the raw ramps, in product UI.
   Every pair below is annotated with its measured contrast ratio. */
:root{
  /* ---- Surfaces ---- */
  --surface-page:var(--stone-50);        /* app/page background */
  --surface-raised:var(--stone-0);       /* cards, panels */
  --surface-sunken:var(--stone-100);     /* wells, table headers */
  --surface-inverse:var(--navy-800);     /* navy sections, footers */
  --surface-inverse-deep:var(--navy-950);/* full-bleed dark, story backgrounds */
  --surface-accent-soft:var(--gold-50);  /* quiet gold wash — banners, quotes */
  --surface-accent:var(--gold-500);      /* solid bronze plate: LARGE text only */
  --surface-overlay:rgba(12,13,39,.72);  /* modal / lightbox scrim */

  /* ---- Text ---- */
  --text-primary:var(--navy-800);        /* 13.93 on surface-raised, 13.29 on surface-page */
  --text-secondary:var(--stone-700);     /* 7.32 on white */
  --text-tertiary:var(--stone-600);      /* 4.79 on white — AA floor, never below 16px */
  --text-disabled:var(--stone-500);      /* 3.06 — non-informational only */
  --text-accent:var(--gold-700);         /* 6.24 on white — links, gold body copy */
  --text-accent-min:var(--gold-600);     /* 4.82 on white — AA minimum gold */
  --text-on-inverse:var(--stone-0);      /* 13.93 on navy-800 */
  --text-on-inverse-muted:var(--navy-300);/* 7.40 on navy-800 */
  --text-accent-on-inverse:var(--gold-300);/* 8.16 on navy-800 */
  --text-on-accent:var(--navy-900);      /* 5.28 on gold-500 — navy on bronze, never white */

  /* ---- Borders ---- */
  --border-subtle:var(--stone-200);      /* hairline dividers */
  --border-default:var(--stone-300);     /* input rest, card edge */
  --border-strong:var(--stone-500);      /* 3.06 — UI boundary AA */
  --border-inverse:rgba(255,255,255,.22);
  --border-inverse-strong:rgba(255,255,255,.45);
  --border-accent:var(--gold-500);       /* 4.35 on navy-800, 3.21 on white */
  --border-focus:var(--navy-600);
  --border-focus-inverse:var(--gold-300);

  /* ---- Interactive: primary (navy solid) ---- */
  --action-primary-bg:var(--navy-800);
  --action-primary-bg-hover:var(--navy-700);
  --action-primary-bg-active:var(--navy-900);
  --action-primary-fg:var(--stone-0);            /* 13.93 rest / 10.87 hover */
  --action-primary-bg-disabled:var(--stone-300);
  --action-primary-fg-disabled:var(--stone-600);

  /* ---- Interactive: secondary (outline) ---- */
  --action-secondary-fg:var(--navy-800);
  --action-secondary-border:var(--navy-800);
  --action-secondary-bg-hover:var(--navy-50);
  --action-secondary-bg-active:var(--navy-100);

  /* ---- Interactive: tertiary (text) ---- */
  --action-tertiary-fg:var(--gold-700);          /* 6.24 on white */
  --action-tertiary-fg-hover:var(--gold-800);
  --action-tertiary-bg-hover:var(--gold-50);

  /* ---- Interactive: on photography / inverse ---- */
  --action-inverse-border:rgba(255,255,255,.55);
  --action-inverse-fg:var(--stone-0);
  --action-inverse-bg-hover:rgba(255,255,255,.14);

  /* ---- Form fields ---- */
  --field-bg:var(--stone-0);
  --field-bg-disabled:var(--stone-100);
  --field-border:var(--stone-300);
  --field-border-hover:var(--stone-500);
  --field-border-focus:var(--navy-600);
  --field-border-error:var(--danger-600);
  --field-border-success:var(--success-600);
  --field-placeholder:var(--stone-500);
  --field-label:var(--stone-700);
  --field-help:var(--stone-600);

  /* Fields over photography: an opaque plate is the only reliable answer.
     Frosted glass is used ONLY as the resting state and always over a scrim. */
  --field-photo-bg:rgba(12,13,39,.55);
  --field-photo-bg-focus:rgba(255,255,255,.96);
  --field-photo-border:rgba(255,255,255,.45);
  --field-photo-fg:var(--stone-0);
  --field-photo-fg-focus:var(--navy-800);
  --field-photo-label:var(--stone-0);
  --field-photo-scrim:rgba(12,13,39,.42);

  /* ---- Feedback ---- */
  --feedback-success-bg:var(--success-50); --feedback-success-fg:var(--success-700); --feedback-success-border:var(--success-300);
  --feedback-danger-bg:var(--danger-50);  --feedback-danger-fg:var(--danger-700);  --feedback-danger-border:var(--danger-300);
  --feedback-warning-bg:var(--warning-50);--feedback-warning-fg:var(--warning-700);--feedback-warning-border:var(--warning-300);
  --feedback-info-bg:var(--info-50);      --feedback-info-fg:var(--info-700);      --feedback-info-border:var(--info-300);

  /* ---- Focus ring: one ring, everywhere ---- */
  --focus-ring-color:var(--navy-600);
  --focus-ring-color-inverse:var(--gold-300);
  --focus-ring-width:2px;
  --focus-ring-offset:2px;
}


/* ===== typography.css ===== */
/* Type system.
   Three families, three registers:
     --font-sans (Roboto)     = UI and headings.
     --font-body (Mulish)     = paragraph copy, set Light.
     --font-display (Bodoni) = the aspirational voice. Hero statements, pull quotes, deck covers.
   Rule: one display moment per surface. Never two.
   Fluid sizes use clamp() against a 375→1440px viewport; no per-breakpoint overrides needed. */
:root{
  --font-sans:'Roboto','Helvetica Neue',Arial,sans-serif; /* @kind font */
  --font-body:'Mulish','Helvetica Neue',Arial,sans-serif; /* @kind font */
  --font-display:'Bodoni Moda',Georgia,'Times New Roman',serif; /* @kind font */
  --font-mono:ui-monospace,'SF Mono',Menlo,monospace; /* @kind font */

  /* Weights — Roboto. 200/300 for quiet UI copy; titles use Bold. */
  --fw-extralight:200; /* @kind other */
  --fw-light:300; /* @kind other */
  --fw-regular:400; /* @kind other */
  --fw-medium:500; /* @kind other */
  --fw-semibold:600; /* @kind other */
  --fw-bold:700; /* @kind other */

  /* ---------- Display (Bodoni Moda) ---------- */
  --display-1-size:clamp(3rem,1.2rem + 7.5vw,6.5rem); /* @kind other */
  --display-1-lh:0.94; /* @kind other */
  --display-2-size:clamp(2.25rem,1.2rem + 4.4vw,4.25rem); /* @kind other */
  --display-2-lh:1.02; /* @kind other */

  /* ---------- Headings (Archivo) ---------- */
  --h1-size:clamp(2.125rem,1.35rem + 3.2vw,3.5rem); /* @kind other */
  --h1-lh:1.06; /* @kind other */
  --h2-size:clamp(2.0125rem,1.4375rem + 2.415vw,3.019rem); /* @kind other */
  --h2-lh:1.12; /* @kind other */
  --h3-size:clamp(1.581rem,1.265rem + 1.3225vw,2.156rem); /* @kind other */
  --h3-lh:1.2; /* @kind other */
  --h4-size:1.4375rem; /* @kind font */
  --h5-size:1.222rem; /* @kind font */
  --h6-size:1.006rem; /* @kind font */

  /* ---------- Body ---------- */
  --body-lg-size:1.1875rem; /* @kind font */
  --body-size:1.0625rem; /* @kind font */
  --body-sm-size:0.9375rem; /* @kind font */

  /* ---------- Utility ---------- */
  --caption-size:0.8125rem; /* @kind font */
  --overline-size:0.75rem; /* @kind font */
  --button-size:0.875rem; /* @kind font */
  /* The logo register: light, uppercase, very wide. Section labels and obra signatures only. */
  --lockup-ls:0.32em; /* @kind other */

  /* Reading measures */
  --measure-prose:38rem; /* @kind spacing */
  --measure-narrow:28rem; /* @kind spacing */
  --measure-lede:46rem; /* @kind spacing */
}


/* ===== foundations.css ===== */
/* Space, grid, radius, elevation, borders, motion.
   Space: 4px base. The scale skips the middle so density decisions stay coarse —
   generous space is the cheapest signal of value this brand has. */
:root{
  --space-0:0; /* @kind spacing */
  --space-1:4px; /* @kind spacing */
  --space-2:8px; /* @kind spacing */
  --space-3:12px; /* @kind spacing */
  --space-4:16px; /* @kind spacing */
  --space-5:24px; /* @kind spacing */
  --space-6:32px; /* @kind spacing */
  --space-7:40px; /* @kind spacing */
  --space-8:48px; /* @kind spacing */
  --space-9:64px; /* @kind spacing */
  --space-10:80px; /* @kind spacing */
  --space-11:96px; /* @kind spacing */
  --space-12:128px; /* @kind spacing */
  --space-13:160px; /* @kind spacing */
  --space-14:200px; /* @kind spacing */

  /* Named rhythm — use these in layout, not raw steps. */
  --gap-inline:var(--space-2); /* @kind spacing */
  --gap-stack:var(--space-3); /* @kind spacing */
  --gap-group:var(--space-5); /* @kind spacing */
  --gap-block:var(--space-8); /* @kind spacing */
  --section-y:var(--space-12); /* @kind spacing */
  --section-y-compact:var(--space-10); /* @kind spacing */
  --section-y-mobile:var(--space-9); /* @kind spacing */

  /* ---------- Grid & layout ---------- */
  --grid-columns:12; /* @kind other */
  --grid-gutter:24px; /* @kind spacing */
  --grid-gutter-lg:32px; /* @kind spacing */
  --container-max:1280px; /* @kind spacing */
  --container-wide:1440px; /* @kind spacing */
  --container-pad:24px; /* @kind spacing */
  --container-pad-lg:48px; /* @kind spacing */

  /* ---------- Breakpoints (mobile-first; documented for JS/media queries) ---------- */
  --bp-sm:480px; /* @kind other */
  --bp-md:768px; /* @kind other */
  --bp-lg:1024px; /* @kind other */
  --bp-xl:1280px; /* @kind other */
  --bp-2xl:1536px; /* @kind other */

  /* ---------- Radius ---------- */
  /* Low radius reads as engineering tolerance. 2px is the house default; nothing exceeds 6px
     except the pill, which is reserved for chips and status dots. */
  --radius-none:0; /* @kind radius */
  --radius-sm:2px; /* @kind radius */
  --radius-md:3px; /* @kind radius */
  --radius-lg:4px; /* @kind radius */
  --radius-xl:6px; /* @kind radius */
  --radius-pill:999px; /* @kind radius */

  /* ---------- Borders ---------- */
  --border-hairline:1px; /* @kind spacing */
  --border-thick:1.5px; /* @kind spacing */
  --border-emphasis:2px; /* @kind spacing */
  --rule-accent:3px; /* @kind spacing */

  /* ---------- Elevation ---------- */
  /* Navy-tinted, low-opacity, tight. Nothing floats; things rest. */
  --shadow-0:none; /* @kind shadow */
  --shadow-1:0 1px 2px rgba(23,25,60,.06), 0 1px 1px rgba(23,25,60,.04); /* @kind shadow */
  --shadow-2:0 2px 4px rgba(23,25,60,.06), 0 4px 12px rgba(23,25,60,.05); /* @kind shadow */
  --shadow-3:0 4px 8px rgba(23,25,60,.07), 0 12px 28px rgba(23,25,60,.07); /* @kind shadow */
  --shadow-4:0 8px 16px rgba(23,25,60,.08), 0 28px 64px rgba(23,25,60,.10); /* @kind shadow */
  --shadow-inset:inset 0 1px 2px rgba(23,25,60,.07); /* @kind shadow */

  /* ---------- Motion ---------- */
  --dur-instant:80ms; /* @kind other */
  --dur-fast:140ms; /* @kind other */
  --dur-base:220ms; /* @kind other */
  --dur-slow:340ms; /* @kind other */
  --dur-entrance:560ms; /* @kind other */
  --ease-standard:cubic-bezier(.2,0,.2,1); /* @kind other */
  --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
  --ease-in:cubic-bezier(.4,0,1,1); /* @kind other */
  --ease-inout:cubic-bezier(.5,0,.2,1); /* @kind other */
  --lift-hover:-1px; /* @kind other */
  --press-scale:0.985; /* @kind other */

  /* ---------- Icons ---------- */
  /* Lucide ships a 2px stroke on a 24px grid — the token states what the family delivers. */
  --icon-stroke:2px; /* @kind spacing */
  --icon-xs:14px; /* @kind spacing */
  --icon-grid:24px; /* @kind spacing */

  /* ---------- Touch ---------- */
  --touch-min:44px; /* @kind spacing */
  --control-h-sm:36px; /* @kind spacing */
  --control-h-md:44px; /* @kind spacing */
  --control-h-lg:52px; /* @kind spacing */

  /* ---------- Z ---------- */
  --z-base:0; /* @kind other */
}
@media (prefers-reduced-motion:reduce){
  :root{--dur-fast:0ms; /* @kind other */ --dur-base:0ms; /* @kind other */ --dur-slow:0ms; /* @kind other */ --dur-entrance:0ms; /* @kind other */ --lift-hover:0; /* @kind other */ --press-scale:1; /* @kind other */}
}


/* ===== photography.css ===== */
/* Photography treatment tokens.
   Photography is the strongest asset the brand owns; these values are what make text on it legible
   and what keep two photographers' work looking like one company. */
:root{
  /* ---- Aspect ratios by context ---- */
  --ratio-hero:16/9; /* @kind other */
  --ratio-hero-tall:4/5; /* @kind other */
  --ratio-project:3/2; /* @kind other */
  --ratio-detail:1/1; /* @kind other */
  --ratio-portrait:4/5; /* @kind other */
  --ratio-story:9/16; /* @kind other */
  --ratio-slide:16/9; /* @kind other */
  --ratio-band:21/9; /* @kind other */

  /* ---- Scrims: tokenised opacity, never eyeballed ---- */
  --scrim-none:0; /* @kind other */
  --scrim-light:0.24; /* @kind other */
  --scrim-base:0.42; /* @kind other */
  --scrim-heavy:0.62; /* @kind other */
  --scrim-solid:0.82; /* @kind other */

  /* ---- Gradient protections. Directional, so the photo survives. ---- */
  --protect-bottom:linear-gradient(to top,rgba(12,13,39,.86) 0%,rgba(12,13,39,.62) 26%,rgba(12,13,39,.12) 58%,transparent 100%); /* @kind other */
  --protect-top:linear-gradient(to bottom,rgba(12,13,39,.72) 0%,rgba(12,13,39,.28) 42%,transparent 100%); /* @kind other */
  --protect-left:linear-gradient(to right,rgba(12,13,39,.80) 0%,rgba(12,13,39,.44) 38%,transparent 78%); /* @kind other */
  --protect-flat:linear-gradient(rgba(12,13,39,.42),rgba(12,13,39,.42)); /* @kind other */
  /* Bronze-tinted protection — reserved for the obra signature band. */
  --protect-brand:linear-gradient(to top,rgba(37,40,83,.92) 0%,rgba(37,40,83,.55) 45%,transparent 100%); /* @kind other */

  /* ---- Grade. Applied on top of professional colour work, not instead of it. ---- */
  --grade-delivered:saturate(0.94) contrast(1.04) brightness(1.01); /* @kind other */
  --grade-process:saturate(0.78) contrast(1.08); /* @kind other */
  --grade-archive:grayscale(1) contrast(1.06); /* @kind other */

  /* Caption plate for photo credits and obra signatures */
  --photo-caption-bg:rgba(12,13,39,.62); /* @kind color */
  --photo-caption-fg:var(--stone-0); /* @kind color */
}


/* ===== base.css ===== */
/* Element defaults + the type utility classes that make the scale usable.
   Everything here reads from tokens; no literal colours or sizes. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-page);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--body-size);line-height:var(--body-lh);font-weight:var(--fw-regular);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,video{display:block;max-width:100%}
h1,h2,h3,h4,h5,h6,p,figure,blockquote{margin:0}
:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset);border-radius:var(--radius-sm)}
::selection{background:var(--gold-200);color:var(--navy-900)}
a{color:var(--text-accent);text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:.18em;text-decoration-color:color-mix(in srgb,var(--text-accent) 42%,transparent);transition:color var(--dur-fast) var(--ease-standard),text-decoration-color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--gold-800);text-decoration-color:currentColor}
a:active{color:var(--gold-900)}

/* ---- Type utilities ---- */
.pm-display-1{font-family:var(--font-display);font-size:var(--display-1-size);line-height:var(--display-1-lh);letter-spacing:var(--display-1-ls);font-weight:var(--display-1-weight)}
.pm-display-2{font-family:var(--font-display);font-size:var(--display-2-size);line-height:var(--display-2-lh);letter-spacing:var(--display-2-ls);font-weight:var(--display-2-weight)}
.pm-h1{font-size:var(--h1-size);line-height:var(--h1-lh);letter-spacing:var(--h1-ls);font-weight:var(--h1-weight)}
.pm-h2{font-size:var(--h2-size);line-height:var(--h2-lh);letter-spacing:var(--h2-ls);font-weight:var(--h2-weight)}
.pm-h3{font-size:var(--h3-size);line-height:var(--h3-lh);letter-spacing:var(--h3-ls);font-weight:var(--h3-weight)}
.pm-h4{font-size:var(--h4-size);line-height:var(--h4-lh);letter-spacing:var(--h4-ls);font-weight:var(--h4-weight)}
.pm-h5{font-size:var(--h5-size);line-height:var(--h5-lh);letter-spacing:var(--h5-ls);font-weight:var(--h5-weight)}
.pm-h6{font-size:var(--h6-size);line-height:var(--h6-lh);letter-spacing:var(--h6-ls);font-weight:var(--h6-weight);text-transform:uppercase}
.pm-body-lg{font-size:var(--body-lg-size);line-height:var(--body-lg-lh)}
.pm-body{font-size:var(--body-size);line-height:var(--body-lh)}
.pm-body-sm{font-size:var(--body-sm-size);line-height:var(--body-sm-lh)}
.pm-caption{font-size:var(--caption-size);line-height:var(--caption-lh);letter-spacing:var(--caption-ls);color:var(--text-tertiary)}
.pm-overline{font-size:var(--overline-size);line-height:var(--overline-lh);letter-spacing:var(--overline-ls);font-weight:var(--overline-weight);text-transform:uppercase}
.pm-lockup{font-weight:var(--fw-light);letter-spacing:var(--lockup-ls);text-transform:uppercase}
.pm-mono{font-family:var(--font-mono);font-size:var(--body-sm-size);letter-spacing:.01em}
.pm-prose{max-width:var(--measure-prose);text-wrap:pretty}
.pm-lede{max-width:var(--measure-lede);font-size:var(--body-lg-size);line-height:var(--body-lg-lh);color:var(--text-secondary);text-wrap:pretty}

/* ---- Layout helpers ---- */
.pm-container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-pad)}
@media (min-width:1024px){.pm-container{padding-inline:var(--container-pad-lg)}}
.pm-grid{display:grid;grid-template-columns:repeat(var(--grid-columns),minmax(0,1fr));gap:var(--grid-gutter)}
.pm-section{padding-block:var(--section-y-mobile)}
@media (min-width:1024px){.pm-section{padding-block:var(--section-y)}}
.pm-visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}