/* Natural Architect — style.css */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; }
img { max-width: 100%; height: auto; display: block; }
/* 案A Blueprint — cool white / navy ink / signal blue */
.siteA {
  --ink: #18223a;
  --ink2: #4a5468;
  --mute: #8a92a3;
  --line: #dfe3ea;
  --bg: #fbfcfd;
  --tint: #f2f4f7;
  --acc: oklch(0.56 0.17 255);
  --acc2: oklch(0.74 0.15 145);
  container-type: inline-size;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  color: var(--ink);
  background: var(--bg);
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: 0.02em;
}
.siteA * { box-sizing: border-box; }
.siteA a { cursor: pointer; color: inherit; text-decoration: none; }
.siteA h1, .siteA h2, .siteA h3, .siteA h4 { margin: 0; font-weight: 700; text-wrap: pretty; }
.siteA p { margin: 0; text-wrap: pretty; }
.a-wrap { max-width: 1180px; margin: 0 auto; padding: 0 48px; }

/* logo */
.a-logo { display: flex; align-items: center; gap: 12px; }
.a-mark { position: relative; width: 26px; height: 28px; display: block; }
.a-mark i { position: absolute; left: 0; width: 18px; height: 14px; background: var(--acc); }
.a-mark i:first-child { top: 0; clip-path: polygon(0 0, 45% 0, 100% 100%, 55% 100%); }
.a-mark i:last-child { top: 14px; left: 0; background: var(--acc2); clip-path: polygon(55% 0, 100% 0, 45% 100%, 0 100%); }
.a-mark::after { content: ''; position: absolute; left: 14px; top: 0; width: 2px; height: 28px; background: var(--ink); opacity: .9; }
.a-word { font-family: 'IBM Plex Sans', sans-serif; font-size: 17px; font-weight: 400; letter-spacing: 0.01em; line-height: 1; }
.a-word b { font-weight: 600; margin-left: 4px; }
.a-logo.inv .a-word { color: #fff; }
.a-logo.inv .a-mark::after { background: #fff; }

/* nav */
.a-nav { position: sticky; top: 0; z-index: 20; background: color-mix(in oklab, var(--bg) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.a-nav-in { display: flex; align-items: center; justify-content: space-between; height: 72px; }
.a-links { display: flex; align-items: center; gap: 36px; font-size: 14px; }
.a-links > a:not(.a-btn) { position: relative; color: var(--ink2); }
.a-links > a:not(.a-btn):hover, .a-links > a.on { color: var(--ink); }
.a-links > a.on::after { content: ''; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: var(--acc); }
.a-burger { display: none; width: 44px; height: 44px; border: 0; background: none; position: relative; cursor: pointer; }
.a-burger i { position: absolute; left: 11px; right: 11px; height: 1.5px; background: var(--ink); transition: .25s; }
.a-burger i:first-child { top: 18px; } .a-burger i:last-child { top: 25px; }
.a-burger.x i:first-child { top: 21px; transform: rotate(45deg); }
.a-burger.x i:last-child { top: 21px; transform: rotate(-45deg); }
.a-drawer { border-top: 1px solid var(--line); background: var(--bg); padding: 8px 24px 24px; }
.a-drawer a { display: flex; justify-content: space-between; padding: 16px 0; border-bottom: 1px solid var(--line); font-size: 16px; }

/* buttons */
.a-btn { display: inline-flex; align-items: center; gap: 14px; background: var(--ink); color: #fff !important; padding: 0 22px; height: 48px; font-weight: 700; font-size: 14px; transition: background .2s; }
.a-btn:hover { background: var(--acc); }
.a-btn.sm { height: 40px; padding: 0 18px; font-size: 13px; }
.a-btn.lg { height: 60px; padding: 0 30px; font-size: 15px; }
.a-btn span { font-family: 'IBM Plex Mono', monospace; transition: transform .2s; }
.a-btn:hover span { transform: translateX(4px); }
.a-btn.inv { background: #fff; color: var(--ink) !important; }
.a-btn.inv:hover { background: var(--acc2); }
.a-link { font-size: 14px; font-weight: 700; border-bottom: 1px solid var(--ink); padding-bottom: 2px; }
.a-link::after { content: ' →'; font-family: 'IBM Plex Mono', monospace; }
.a-link:hover { color: var(--acc); border-color: var(--acc); }

/* label */
.a-label { font-family: 'IBM Plex Mono', monospace; font-size: 12px; letter-spacing: 0.08em; color: var(--ink2); display: flex; gap: 12px; align-items: center; text-transform: uppercase; }
.a-label span { color: var(--acc); }
.a-label.light { color: rgba(255,255,255,.7); }
.a-label.light span { color: var(--acc2); }

/* hero */
.a-hero { border-bottom: 1px solid var(--line); background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 48px 48px; background-position: -1px -1px; }
.a-hero-in { display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: center; min-height: 640px; padding-top: 72px; padding-bottom: 72px; }
.a-hero-copy { background: var(--bg); padding: 40px 40px 40px 0; margin-left: -1px; }
.a-hero h1 { font-size: 52px; line-height: 1.42; letter-spacing: 0.01em; margin: 24px 0 28px; }
.a-hero-copy > p { color: var(--ink2); font-size: 16px; max-width: 30em; }
.a-hero-actions { display: flex; gap: 32px; align-items: center; margin-top: 44px; flex-wrap: wrap; }
.a-hero-fig { background: var(--bg); border: 1px solid var(--ink); padding: 28px; position: relative; }
.a-fig-cap { font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: var(--mute); margin-bottom: 20px; letter-spacing: .05em; }
.a-fig-row { display: grid; grid-template-columns: 76px 1fr; align-items: center; gap: 12px; margin-bottom: 10px; animation: aFade .8s both; }
.a-fig-row > span { font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: var(--ink2); }
.a-fig-bar { border: 1px solid var(--line); background: var(--tint); font-family: 'IBM Plex Mono', monospace; font-size: 12px; padding: 10px 14px; width: 88%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.a-fig-row:nth-child(3) .a-fig-bar, .a-fig-row:nth-child(4) .a-fig-bar { border-color: var(--acc); background: color-mix(in oklab, var(--acc) 8%, white); }
.a-fig-bracket { margin-top: 18px; border-top: 1px dashed var(--ink); padding-top: 10px; font-size: 12px; text-align: right; position: relative; }
.a-fig-bracket::before, .a-fig-bracket::after { content: ''; position: absolute; top: -6px; width: 1px; height: 11px; background: var(--ink); }
.a-fig-bracket::before { left: 0; } .a-fig-bracket::after { right: 0; }
.a-fig-bracket span { font-weight: 700; }

/* sections */
.a-sec { padding: 120px 0; }
.a-sec.tint { background: var(--tint); }
.a-sechead { margin-bottom: 56px; }
.a-sechead h2 { font-size: 34px; line-height: 1.5; margin-top: 16px; }
.a-sublead { color: var(--ink2); margin-top: 20px; max-width: 28em; }
.a-split { display: grid; grid-template-columns: 1fr 1.4fr; gap: 80px; align-items: start; }
.a-split .a-sechead { position: sticky; top: 120px; margin-bottom: 0; }

.a-principles { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.a-pr { padding: 36px 36px 8px 0; border-right: 1px solid var(--line); }
.a-pr + .a-pr { padding-left: 36px; }
.a-pr:last-child { border-right: 0; }
.a-pr-no { font-family: 'IBM Plex Mono', monospace; font-size: 13px; color: var(--acc); }
.a-pr h3 { font-size: 21px; margin: 18px 0 14px; }
.a-pr p { color: var(--ink2); font-size: 14px; }

.a-svc-list { border-top: 1px solid var(--ink); }
.a-svc { display: grid; grid-template-columns: 80px 1fr 40px; align-items: center; padding: 36px 0; border-bottom: 1px solid var(--line); transition: padding .3s, background .3s; }
.a-svc:hover { padding-left: 16px; padding-right: 16px; background: var(--bg); }
.a-svc-no { font-family: 'IBM Plex Mono', monospace; font-size: 13px; color: var(--acc); }
.a-svc-t { display: flex; align-items: baseline; gap: 32px; flex-wrap: wrap; }
.a-svc h3 { font-size: 26px; }
.a-svc p { color: var(--ink2); }
.a-svc-arrow { font-family: 'IBM Plex Mono', monospace; font-size: 20px; text-align: right; }

.a-sys { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.a-sys-c h3 { font-size: 18px; margin: 20px 0 8px; }
.a-sys-c p { font-size: 13.5px; color: var(--ink2); line-height: 1.8; }

.a-stack { border-top: 1px solid var(--ink); }
.a-stack-row { display: grid; grid-template-columns: 200px 1fr; padding: 24px 0; border-bottom: 1px solid var(--line); gap: 16px; align-items: center; }
.a-stack-l { font-weight: 700; display: flex; align-items: baseline; gap: 12px; }
.a-stack-l span { font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: var(--acc); font-weight: 400; }
.a-stack-l em { font-style: normal; font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: var(--mute); font-weight: 400; }
.a-stack-items { display: flex; flex-wrap: wrap; gap: 8px; }
.a-stack-items span { font-family: 'IBM Plex Mono', monospace; font-size: 13px; border: 1px solid var(--line); background: var(--bg); padding: 6px 12px; }

.a-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, 1fr); border-top: 1px solid var(--ink); counter-reset: none; }
.a-flow li { padding: 24px 16px 0 0; position: relative; }
.a-flow li::before { content: ''; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; background: var(--bg); border: 1px solid var(--ink); border-radius: 50%; }
.a-sec.tint .a-flow li::before { background: var(--tint); }
.a-flow li:first-child::before { background: var(--acc); border-color: var(--acc); }
.a-flow-no { font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: var(--acc); }
.a-flow h4 { font-size: 16px; margin: 8px 0 10px; }
.a-flow p { font-size: 13px; color: var(--ink2); line-height: 1.8; }
.a-more { margin-top: 48px; }

/* cta */
.a-cta { background: var(--ink); color: #fff; padding: 110px 0; }
.a-cta-in { display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: end; }
.a-cta h2 { font-size: 38px; line-height: 1.5; margin: 20px 0 24px; }
.a-cta p { color: rgba(255,255,255,.72); max-width: 32em; }
.a-cta-side { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.a-cta-side small { color: rgba(255,255,255,.6); font-size: 12px; }

/* footer */
.a-foot { background: #0f1729; color: rgba(255,255,255,.7); padding: 64px 0 28px; font-size: 13px; }
.a-foot-in { display: flex; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.a-foot-addr { margin-top: 24px; line-height: 1.9; }
.a-foot nav { display: flex; gap: 28px; flex-wrap: wrap; }
.a-foot nav a:hover { color: #fff; }
.a-copy { margin-top: 56px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.12); font-family: 'IBM Plex Mono', monospace; font-size: 11px; }

/* sub pages */
.a-phead { padding: 110px 0 80px; border-bottom: 1px solid var(--line); background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 48px 48px; }
.a-phead h1 { font-size: 48px; margin-top: 20px; display: inline-block; background: var(--bg); padding-right: 16px; }
.a-phead p { margin-top: 20px; color: var(--ink2); max-width: 34em; background: var(--bg); display: inline-block; padding: 4px 16px 4px 0; display: block; width: fit-content; }
.a-svd { display: grid; grid-template-columns: 1fr 1.1fr; gap: 80px; align-items: center; }
.a-svd.rev > :first-child { order: 2; }
.a-svd h2 { font-size: 32px; line-height: 1.5; margin: 16px 0 24px; }
.a-body { color: var(--ink2); }
.a-small { font-size: 13px; color: var(--mute); margin-top: 16px; }
.a-ticks { list-style: none; padding: 0; margin: 32px 0 0; border-top: 1px solid var(--line); }
.a-ticks li { padding: 14px 0 14px 28px; border-bottom: 1px solid var(--line); position: relative; font-weight: 500; }
.a-ticks li::before { content: ''; position: absolute; left: 0; top: 50%; width: 12px; height: 1px; background: var(--acc); }

.a-table { margin: 0; border-top: 1px solid var(--ink); }
.a-table > div { display: grid; grid-template-columns: 200px 1fr; padding: 24px 0; border-bottom: 1px solid var(--line); }
.a-table dt { font-weight: 700; }
.a-table dd { margin: 0; color: var(--ink2); }
.todo { font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: #b5651d; background: #fff4e6; padding: 3px 8px; }
.a-access { display: grid; grid-template-columns: 1.6fr 1fr; gap: 48px; align-items: start; }

.a-contact { display: grid; grid-template-columns: 1fr 1.8fr; gap: 80px; align-items: start; }
.a-contact aside { position: sticky; top: 120px; }
.a-mini-flow { list-style: none; padding: 0; margin: 24px 0; border-top: 1px solid var(--ink); }
.a-mini-flow li { padding: 18px 0; border-bottom: 1px solid var(--line); font-size: 13px; color: var(--ink2); display: grid; grid-template-columns: 36px 1fr; }
.a-mini-flow li span { font-family: 'IBM Plex Mono', monospace; color: var(--acc); grid-row: span 2; }
.a-mini-flow li b { color: var(--ink); font-size: 15px; }
.a-formbox { background: #fff; border: 1px solid var(--line); padding: 48px; }

/* placeholder */
.siteA .ph { background: repeating-linear-gradient(135deg, #eef1f5 0 10px, #e6eaf0 10px 20px); display: flex; align-items: flex-end; padding: 12px; aspect-ratio: 4/3; }
.siteA .ph span { font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: var(--ink2); background: rgba(255,255,255,.8); padding: 3px 8px; }
.siteA .ph.tall { aspect-ratio: 4/5; }
.siteA .ph.map { aspect-ratio: 16/9; }

/* form */
.siteA .cf { display: flex; flex-direction: column; gap: 24px; }
.siteA .cf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.siteA .cf-field { display: flex; flex-direction: column; gap: 8px; }
.siteA .cf-field label { font-weight: 700; font-size: 13px; display: flex; gap: 8px; align-items: center; }
.siteA .cf-field label em { font-style: normal; font-size: 10px; color: #fff; background: var(--acc); padding: 1px 6px; font-weight: 500; }
.siteA .cf input:not([type=checkbox]), .siteA .cf select, .siteA .cf textarea { font: inherit; font-size: 15px; border: 1px solid var(--line); background: var(--bg); padding: 13px 14px; border-radius: 0; color: var(--ink); outline: none; transition: border .2s; width: 100%; }
.siteA .cf input:focus, .siteA .cf select:focus, .siteA .cf textarea:focus { border-color: var(--ink); background: #fff; }
.siteA .cf .bad { border-color: #c2412d !important; }
.siteA .cf small { color: #c2412d; font-size: 12px; }
.siteA .cf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.siteA .cf-chip { font: inherit; font-size: 13px; border: 1px solid var(--line); background: var(--bg); padding: 9px 16px; cursor: pointer; color: var(--ink2); }
.siteA .cf-chip.on { border-color: var(--ink); background: var(--ink); color: #fff; }
.siteA .cf-agree { display: flex; gap: 10px; align-items: center; font-size: 13px; cursor: pointer; }
.siteA .cf-agree.bad { color: #c2412d; }
.siteA .cf-agree input { width: 18px; height: 18px; accent-color: var(--ink); }
.siteA .cf-submit { font: inherit; font-weight: 700; background: var(--ink); color: #fff; border: 0; height: 60px; cursor: pointer; transition: background .2s; }
.siteA .cf-submit:hover { background: var(--acc); }
.siteA .cf-done { text-align: center; padding: 48px 0; }
.siteA .cf-done-mark { width: 48px; height: 48px; border: 1.5px solid var(--acc); border-radius: 50%; margin: 0 auto 24px; position: relative; }
.siteA .cf-done-mark::after { content: ''; position: absolute; left: 16px; top: 12px; width: 10px; height: 18px; border-right: 2px solid var(--acc); border-bottom: 2px solid var(--acc); transform: rotate(45deg); }
.siteA .cf-done h3 { font-size: 22px; margin-bottom: 12px; }
.siteA .cf-done p { color: var(--ink2); }
.siteA .cf-reset { font: inherit; margin-top: 28px; background: none; border: 0; border-bottom: 1px solid var(--ink); cursor: pointer; padding: 0 0 2px; }

/* ---- 1ページ版 追加 ---- */
.a2-l { display: block; white-space: nowrap; }
.a2-hero .a-hero-in { grid-template-columns: 1.15fr 1fr; gap: 56px; }
.a2-hero h1 { font-size: clamp(30px, 4.1cqi, 48px); }
.a2-hero .a-fig-bar { white-space: normal; line-height: 1.6; }
.siteA [id^="a2-"] { scroll-margin-top: 72px; }
.a2-svcs { display: flex; flex-direction: column; gap: 96px; }
.a2-svd { grid-template-columns: 1fr 1.25fr; gap: 72px; }
.a2-h3 { font-size: 28px; line-height: 1.5; margin: 16px 0 20px; }
.a2-cta-h { font-size: 40px; line-height: 1.5; margin: 20px 0 24px; }
.a2-cta-p { color: rgba(255,255,255,.72); max-width: 36em; }
.a2-mail { margin-top: 56px; padding: 40px 0; border-top: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); display: flex; justify-content: space-between; align-items: center; gap: 32px; flex-wrap: wrap; }
.a2-mail-addr { font-family: 'IBM Plex Mono', monospace; font-size: clamp(20px, 3.4cqi, 40px); color: #fff !important; letter-spacing: 0; border-bottom: 1px solid rgba(255,255,255,.4); padding-bottom: 4px; word-break: break-all; transition: border-color .2s, color .2s; }
.a2-mail-addr:hover { color: var(--acc2) !important; border-color: var(--acc2); }
.a2-mail-act { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.a2-copy { font: inherit; font-size: 13px; color: #fff; background: none; border: 1px solid rgba(255,255,255,.35); height: 60px; padding: 0 22px; cursor: pointer; transition: border-color .2s; min-width: 150px; }
.a2-copy:hover { border-color: #fff; }
.a2-mail-hints { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin-top: 40px; font-size: 13.5px; color: rgba(255,255,255,.72); }
.a2-mail-hints b { color: #fff; font-size: 14px; display: block; margin-bottom: 10px; }
.a2-mail-hints ul { margin: 0; padding: 0; list-style: none; }
.a2-mail-hints li { padding-left: 22px; position: relative; line-height: 2; }
.a2-mail-hints li::before { content: ''; position: absolute; left: 0; top: 1em; width: 10px; height: 1px; background: var(--acc2); }

/* motion */
@keyframes aFade { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.a-main { animation: aFade .5s both; }

/* responsive (container) */
@container (max-width: 980px) {
  .a-hero-in, .a-split, .a-svd, .a-cta-in, .a-contact, .a-access { grid-template-columns: 1fr; gap: 48px; }
  .a-split .a-sechead, .a-contact aside { position: static; }
  .a-sys { grid-template-columns: repeat(2, 1fr); }
  .a-flow { grid-template-columns: repeat(4, 1fr); row-gap: 40px; }
  .a-svd.rev > :first-child { order: 0; }
}
@container (max-width: 720px) {
  .a-wrap { padding: 0 22px; }
  .a-links { display: none; }
  .a-burger { display: block; }
  .a-nav-in { height: 60px; }
  .a-hero-in { min-height: 0; padding-top: 40px; padding-bottom: 48px; gap: 32px; }
  .a-hero-copy { padding: 24px 0; }
  .a-hero h1 { font-size: 31px; margin: 16px 0 20px; }
  .a-hero-copy > p { font-size: 14.5px; }
  .a-hero-actions { margin-top: 32px; gap: 24px; }
  .a-hero-actions .a-btn { width: 100%; justify-content: space-between; }
  .a-hero-fig { padding: 20px; }
  .a-fig-row { grid-template-columns: 60px 1fr; }
  .a-fig-bar { width: 100%; margin-left: 0 !important; font-size: 11px; }
  .a-sec { padding: 72px 0; }
  .a-sechead { margin-bottom: 36px; }
  .a-sechead h2 { font-size: 25px; }
  .a-principles { grid-template-columns: 1fr; }
  .a-pr, .a-pr + .a-pr { padding: 28px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .a-svc { grid-template-columns: 44px 1fr 24px; padding: 26px 0; }
  .a-svc-t { flex-direction: column; gap: 4px; }
  .a-svc h3 { font-size: 20px; }
  .a-svc p { font-size: 13px; }
  .a-sys { grid-template-columns: 1fr 1fr; gap: 20px; }
  .a-sys-c p { font-size: 12.5px; }
  .a-stack-row { grid-template-columns: 1fr; gap: 12px; }
  .a-flow { grid-template-columns: 1fr; border-top: 0; border-left: 1px solid var(--ink); row-gap: 0; margin-left: 4px; }
  .a-flow li { padding: 0 0 28px 24px; }
  .a-flow li::before { top: 4px; left: -5px; }
  .a-flow.compact li { padding-bottom: 18px; }
  .a-flow h4 { margin: 2px 0 6px; }
  .a-cta { padding: 72px 0; }
  .a-cta h2 { font-size: 26px; }
  .a-cta-side .a-btn { width: 100%; justify-content: space-between; }
  .a-phead { padding: 64px 0 48px; }
  .a-phead h1 { font-size: 32px; }
  .a-svd h2 { font-size: 23px; }
  .a-table > div { grid-template-columns: 1fr; gap: 4px; padding: 18px 0; }
  .a-formbox { padding: 24px 18px; }
  .siteA .cf-row { grid-template-columns: 1fr; }
  .a-foot-in { flex-direction: column; }
  .a2-hero h1 { font-size: 29px; }
  .a2-svcs { gap: 56px; }
  .a2-svd { gap: 24px; }
  .a2-h3 { font-size: 22px; }
  .a2-cta-h { font-size: 26px; }
  .a2-mail { margin-top: 36px; padding: 28px 0; }
  .a2-mail-act { width: 100%; }
  .a2-mail-act .a-btn { flex: 1; justify-content: space-between; }
  .a2-copy { width: 100%; height: 52px; }
  .a2-mail-hints { grid-template-columns: 1fr; gap: 28px; }
}
@container (max-width: 980px) {
  .a2-hero .a-hero-in, .a2-svd { grid-template-columns: 1fr; }
  .a2-hero h1 { font-size: 38px; }
}
@container (max-width: 720px) {
  .a2-hero h1 { font-size: 29px; }
}

/* static build */
.siteA section[id] { scroll-margin-top: 72px; }
@media (max-width: 720px) { .siteA section[id] { scroll-margin-top: 60px; } }
.a-drawer[hidden] { display: none; }
.siteA .ph:has(img) { padding: 0; background: #eef1f5; overflow: hidden; }
.siteA .ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.a-skip { position: absolute; left: -9999px; }
.a-skip:focus { left: 16px; top: 16px; z-index: 50; background: #fff; padding: 8px 12px; }