
    500;600;700;800&display=swap');

    

    :root {
      --paper: #f4edde;
      --paper-2: #ece2cf;
      --ink: #161616;
      --muted: #60584c;
      --line: rgba(20,20,20,.10);
      --line-2: rgba(20,20,20,.14);
      --line-strong: rgba(20,20,20,.18);
      --red: #8f2d1f;
      --gold: #b58a00;
      --content-width: 1200px;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html,
    body {
      background: var(--paper);
    }

    body {
      font-family: 'Inter', Arial, sans-serif;
      color: var(--ink);
      overflow-x: hidden;
      background:
        radial-gradient(circle at 20% 10%, rgba(255,255,255,.28), transparent 22%),
        radial-gradient(circle at 80% 20%, rgba(0,0,0,.03), transparent 18%),
        radial-gradient(circle at 30% 70%, rgba(0,0,0,.025), transparent 24%),
        linear-gradient(180deg, var(--paper) 0%, var(--paper-2) 100%);
      position: relative;
    }

    body::before {
      content: '';
      position: fixed;
      inset: 0;
      pointer-events: none;
      opacity: .16;
      mix-blend-mode: multiply;
      background:
        radial-gradient(circle at 12% 18%, rgba(255,255,255,.22), transparent 18%),
        radial-gradient(circle at 82% 26%, rgba(0,0,0,.03), transparent 20%),
        radial-gradient(circle at 35% 78%, rgba(0,0,0,.025), transparent 22%);
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    img {
      display: block;
      max-width: 100%;
    }

    .container {
      width: min(calc(100% - 40px), var(--content-width));
      margin: 0 auto;
    }

    .topbar {
      position: relative;
      border-top: 1px solid var(--line);
      border-bottom: 1px solid rgba(20,20,20,.16);
      background: linear-gradient(180deg, rgba(226,219,199,.72) 0%, rgba(218,210,191,.82) 100%);
    }

    .topbar-inner {
      min-height: 84px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      position: relative;
    }

    .topbar-inner::before,
    .topbar-inner::after {
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      height: 1px;
      background: rgba(20,20,20,.08);
      pointer-events: none;
    }

    .topbar-inner::before {
      top: 8px;
    }

    .topbar-inner::after {
      bottom: 8px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 14px;
      min-width: 0;
    }

    .brand-mark {
      position: relative;
      width: 40px;
      height: 16px;
      flex: 0 0 auto;
    }

    .brand-mark::before,
    .brand-mark::after {
      content: '';
      position: absolute;
      top: 0;
      width: 16px;
      height: 16px;
    }

    .brand-mark::before {
      left: 0;
      background: var(--red);
    }

    .brand-mark::after {
      left: 22px;
      background: #e2b300;
    }

    .brand-text {
      font-family: 'Ustroke', 'Inter', Arial, sans-serif;
      font-size: 34px;
      line-height: 1;
      letter-spacing: .05em;
      text-transform: uppercase;
      color: var(--ink);
      white-space: nowrap;
    }

    .nav {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 0;
      flex-wrap: wrap;
    }

    .nav a {
      position: relative;
      padding: 0 18px;
      font-size: 14px;
      line-height: 1;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .04em;
      color: rgba(20,20,20,.92);
    }

    .nav a + a::before {
      content: '';
      position: absolute;
      left: 0;
      top: 50%;
      width: 1px;
      height: 14px;
      background: rgba(20,20,20,.10);
      transform: translateY(-50%);
    }

    .hero {
      padding: 28px 0 20px;
    }

    .edition-line {
      display: grid;
      grid-template-columns: 1fr auto auto;
      gap: 18px;
      align-items: center;
      padding-bottom: 14px;
      border-bottom: 1px solid rgba(20,20,20,.16);
      color: var(--muted);
      font-size: 12px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: .12em;
    }

    .hero-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.3fr) minmax(340px, 0.7fr);
      gap: 34px;
      align-items: start;
      padding-top: 18px;
    }

    .hero-copy {
      min-width: 0;
      position: relative;
      padding-left: 22px;
    }

    .hero-copy::before {
      content: '';
      position: absolute;
      left: 0;
      top: 6px;
      width: 1px;
      height: calc(100% - 12px);
      background: linear-gradient(180deg, rgba(20,20,20,.22) 0%, rgba(20,20,20,.08) 100%);
    }

    .kicker {
      display: inline-flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 18px;
      font-size: 12px;
      line-height: 1.3;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .08em;
      color: var(--red);
    }

    .kicker::before {
      content: '';
      width: 40px;
      height: 1px;
      background: rgba(20,20,20,.75);
      flex: 0 0 auto;
    }

    .headline {
      max-width: 680px;
      font-size: clamp(40px, 4.4vw, 64px);
      line-height: .95;
      font-weight: 700;
      letter-spacing: -.02em;
      text-transform: uppercase;
      color: var(--ink);
    }

    .subhead {
      margin-top: 24px;
      max-width: 760px;
      padding-top: 18px;
      border-top: 1px solid var(--line-2);
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 0;
      position: relative;
    }

    .subhead::before {
      content: '';
      position: absolute;
      left: 50%;
      top: 0;
      bottom: 0;
      width: 1px;
      background: rgba(20,20,20,.12);
      transform: translateX(-50%);
      pointer-events: none;
    }

    .subhead::after {
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      top: 50%;
      height: 1px;
      background: rgba(20,20,20,.12);
      transform: translateY(-50%);
      pointer-events: none;
    }

    .sub-col {
      display: grid;
      grid-template-rows: 1fr 1fr;
      min-width: 0;
    }

    .sub-item {
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 12px;
      align-items: start;
      min-width: 0;
      min-height: 170px;
      padding: 18px 18px 18px 0;
    }

    .sub-no {
      position: relative;
      font-size: 10px;
      line-height: 1;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: #9a3b2d;
      padding-top: 3px;
    }

    .sub-no::after {
      content: '';
      position: absolute;
      left: 0;
      top: 20px;
      width: 1px;
      height: 18px;
      background: rgba(20,20,20,.14);
    }

    .sub-body {
      min-width: 0;
      padding-left: 2px;
    }

    .sub-title {
      font-size: clamp(20px, 1.8vw, 26px);
      line-height: 1.08;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 4px;
    }

    .sub-rule {
      width: 34px;
      height: 1px;
      background: rgba(20,20,20,.14);
      margin-bottom: 10px;
    }

    .sub-desc {
      max-width: 92%;
      font-size: 15px;
      line-height: 1.5;
      font-weight: 400;
      color: var(--muted);
    }

    .hero-note {
      margin-top: 18px;
      padding: 10px 0 8px;
      border-top: 1px solid rgba(20,20,20,.14);
      border-bottom: 1px solid rgba(20,20,20,.10);
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 10px;
      align-items: start;
      max-width: 760px;
      margin-left: 0;
      font-size: 12px;
      line-height: 1.5;
      color: var(--muted);
    }

    .hero-note-tag {
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .08em;
      color: var(--red);
      white-space: nowrap;
    }

    .hero-photo {
      min-width: 0;
      width: 100%;
      max-width: 520px;
      justify-self: end;
    }

    .photo-note {
      margin-bottom: 8px;
      display: flex;
      justify-content: space-between;
      gap: 12px;
      padding-bottom: 8px;
      border-bottom: 1px solid rgba(20,20,20,.10);
      font-size: 11px;
      line-height: 1.2;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .08em;
      color: var(--muted);
    }

    .photo-note strong {
      color: var(--red);
      font-weight: 700;
    }

    .photo-frame {
      border: 1px solid rgba(20,20,20,.16);
      background: rgba(255,255,255,.16);
      padding: 8px;
      box-shadow: 0 2px 10px rgba(20,20,20,.04);
    }

    .photo-frame img {
      width: 100%;
      height: auto;
      object-fit: cover;
    }

    .important {
      padding: 18px 0 34px;
    }

    .important-card {
      width: 100%;
      max-width: 920px;
      margin: 0 auto;
      border: 1px solid rgba(20,20,20,.18);
      padding: 22px 26px 24px;
      background: rgba(255,255,255,.12);
      text-align: left;
      position: relative;
    }

    .important-card::before {
      content: '';
      position: absolute;
      inset: 8px;
      border: 1px solid rgba(20,20,20,.08);
      pointer-events: none;
    }

    .important-title {
      margin-bottom: 16px;
      font-size: 17px;
      line-height: 1.2;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .08em;
      color: var(--red);
      text-align: center;
    }

    .important-text {
      max-width: 820px;
      margin: 0 auto;
      font-size: 20px;
      line-height: 1.55;
      font-weight: 400;
      color: #1b1b1b;
    }

    .services {
      padding: 18px 0 40px;
      position: relative;
    }

    .services::before {
      content: '';
      position: absolute;
      left: 50%;
      top: 0;
      transform: translateX(-50%);
      width: min(calc(100% - 40px), var(--content-width));
      height: 1px;
      background: var(--line-strong);
    }

    .services-head {
      padding: 0 0 18px;
      border-bottom: 1px solid var(--line-strong);
      margin-bottom: 22px;
    }

    .services-kicker {
      display: inline-flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 14px;
      font-size: 12px;
      line-height: 1.3;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .08em;
      color: var(--red);
    }

    .services-kicker::before {
      content: '';
      width: 40px;
      height: 1px;
      background: rgba(20,20,20,.75);
      flex: 0 0 auto;
    }

    .services-title {
      max-width: 760px;
      font-size: clamp(34px, 3.6vw, 52px);
      line-height: .98;
      font-weight: 700;
      letter-spacing: -.02em;
      text-transform: uppercase;
      color: var(--ink);
    }

    .services-subtitle {
      margin-top: 14px;
      max-width: 760px;
      font-size: 18px;
      line-height: 1.5;
      font-weight: 400;
      color: var(--muted);
    }

    .services-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 20px;
    }

    .service-card {
      position: relative;
      display: block;
      min-height: 230px;
      border: 1px solid rgba(20,20,20,.16);
      background: rgba(255,255,255,.10);
      padding: 20px 22px 22px;
      transition: background .2s ease, border-color .2s ease;
    }

    .service-card:hover {
      background: rgba(20,20,20,.06);
      border-color: rgba(20,20,20,.24);
    }

    .service-card::before {
      content: '';
      position: absolute;
      inset: 8px;
      border: 1px solid rgba(20,20,20,.07);
      pointer-events: none;
    }

    .service-no {
      margin-bottom: 18px;
      font-size: 11px;
      line-height: 1;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--red);
    }

    .service-name {
      max-width: 420px;
      font-size: clamp(24px, 2.2vw, 30px);
      line-height: 1.05;
      font-weight: 500;
      color: var(--ink);
    }

    .service-rule {
      width: 42px;
      height: 1px;
      background: rgba(20,20,20,.14);
      margin: 12px 0 14px;
    }

    .service-text {
      max-width: 420px;
      font-size: 16px;
      line-height: 1.5;
      font-weight: 400;
      color: var(--muted);
    }

    @media (max-width: 980px) {
      .topbar-inner {
        min-height: auto;
        padding: 14px 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
      }

      .brand-text {
        font-size: 26px;
      }

      .nav {
        gap: 14px;
      }

      .nav a {
        padding: 0;
        font-size: 12px;
      }

      .nav a + a::before {
        display: none;
      }

      .edition-line {
        grid-template-columns: 1fr;
        gap: 8px;
      }

      .hero-grid {
        grid-template-columns: 1fr;
        gap: 22px;
      }

      .headline {
        font-size: clamp(40px, 12vw, 64px);
      }

      .subhead {
        grid-template-columns: 1fr;
        gap: 0;
      }

      .subhead::before,
      .subhead::after {
        display: none;
      }

      .sub-col {
        grid-template-rows: none;
      }

      .sub-item {
        min-height: auto;
        padding: 16px 0;
        border-bottom: 1px solid rgba(20,20,20,.10);
      }

      .sub-title {
        font-size: clamp(22px, 6vw, 28px);
      }

      .sub-desc {
        font-size: 16px;
      }

      .hero-note {
        grid-template-columns: 1fr;
        gap: 6px;
        margin-left: 0;
      }

      .hero-photo {
        max-width: 520px;
        justify-self: start;
      }

      .important-text {
        font-size: 18px;
      }
    }
  
@font-face{font-family:Inter;src:url('/fonts/Inter-Regular.woff2');font-weight:400;font-display:swap}@font-face{font-family:Inter;src:url('/fonts/Inter-Medium.woff2');font-weight:500 600;font-display:swap}@font-face{font-family:Inter;src:url('/fonts/Inter-Bold.woff2');font-weight:700 900;font-display:swap}
:root{--paper:#f1f4f6;--paper-2:#dce2e6;--ink:#333d49;--muted:#657281;--red:#9a7d42;--line:rgba(51,61,73,.12);--line-strong:rgba(51,61,73,.25)}.topbar{background:linear-gradient(110deg,#293540,#364651);color:#edf0f3}.brand-text{color:inherit}.nav a{color:#edf0f3}.nav{flex-wrap:wrap}.nav a[aria-current]{color:#d4bc8b}.headline{font-family:Inter,Arial,sans-serif}.photo-frame{background:#f8f9fa}.important-text{color:var(--ink)}.service-card{background:rgba(250,251,252,.65)}.footer21{border-top:1px solid #bac5ce;padding:30px 0;background:#34434d;color:white}.footer21 .container{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}a:focus-visible{outline:3px solid #a88b52;outline-offset:4px}@media(max-width:700px){.topbar-inner{flex-direction:column;align-items:flex-start;padding:20px 0;gap:18px}.nav{display:flex;gap:14px;font-size:11px}.nav a{padding:0;border:0}.hero-grid{grid-template-columns:1fr}.hero-photo{justify-self:center}.subhead{grid-template-columns:1fr}.services-grid{grid-template-columns:1fr}.headline{font-size:clamp(32px,9vw,48px)}.edition-line{flex-wrap:wrap;gap:10px}.hero-note{grid-template-columns:1fr}}

/* Version 22: shared 1200px boundary and uncropped portrait. */
main .container{width:calc(100% - 40px);max-width:1200px;margin:0 auto}.hero-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}.hero-copy,.hero-photo,.sub-col,.sub-body{min-width:0}.hero-photo{width:100%;max-width:none}.photo-frame img{width:100%;height:auto;object-fit:contain}.important-card{max-width:none}.edition-line,.edition-line>div{min-width:0}.headline{font-size:clamp(36px,4.2vw,60px);line-height:1.04}.services-grid,.service-card{min-width:0}.hero-note{max-width:100%}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr}.hero-photo{max-width:520px;justify-self:center}.edition-line{grid-template-columns:1fr;gap:10px}.headline{font-size:clamp(36px,6vw,56px)}}@media(max-width:600px){main .container{width:calc(100% - 32px)}.hero-copy{padding-left:14px}.hero-grid{gap:28px}.headline{font-size:clamp(32px,9vw,46px)}.important-card{padding:24px 20px}.services-title{font-size:32px}.services-subtitle{font-size:16px}.service-name{font-size:24px}}
