/* About-page composition only. Shared/homepage styles remain untouched. */
.about-page { background:var(--paper); }
.about-page .breadcrumb { color:var(--muted); }
.about-company { padding:146px 0 88px; }
.about-intro { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(40px,7vw,108px); padding:44px 0 58px; align-items:start; }
.about-heading h1 { margin:24px 0; font:400 clamp(4rem,6.4vw,6.4rem)/1.04 "Times New Roman",Georgia,serif; letter-spacing:-.045em; }
.about-heading h1 em { color:var(--blue-700); font-weight:400; }
.about-company-name { font-size:1rem; line-height:1.65; color:var(--muted); margin:0 0 22px; }
.about-text-link { display:inline-flex; align-items:center; gap:24px; min-height:44px; color:var(--blue-700); font-weight:600; text-decoration:underline; text-underline-offset:6px; text-decoration-color:transparent; transition:text-decoration-color .2s; }
.about-text-link:hover { text-decoration-color:currentColor; }
.about-intro-copy { padding-top:24px; }
.about-intro-copy p, .about-prose p { color:var(--muted); line-height:1.85; margin:0 0 20px; }
.about-intro-copy .about-lead { color:var(--ink); font-size:clamp(1.35rem,2.1vw,1.7rem); line-height:1.55; margin-bottom:26px; text-wrap:pretty; }
.about-intro-copy strong { color:var(--ink); font-weight:600; }
.about-panorama { position:relative; margin:0; isolation:isolate; background:var(--navy-900); border-radius:3px 38px 3px 3px; overflow:hidden; }
.about-panorama picture { display:block; }
.about-panorama img { width:100%; height:clamp(380px,41vw,570px); display:block; object-fit:cover; object-position:center 55%; }
.about-panorama::after { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(0deg,rgba(5,12,20,.9),rgba(5,12,20,.3) 26%,transparent 58%); }
.about-panorama figcaption { position:absolute; z-index:1; bottom:32px; left:36px; right:36px; color:var(--white); display:grid; grid-template-columns:1fr auto; align-items:end; gap:8px 28px; }
.about-panorama figcaption > span:first-child { font-size:.75rem; letter-spacing:.12em; }
.about-panorama figcaption strong { grid-column:2; grid-row:1/3; font:400 clamp(2.7rem,5vw,4.4rem)/1 "Times New Roman",Georgia,serif; letter-spacing:-.04em; white-space:nowrap; }
.about-panorama figcaption small { font-size:.45em; letter-spacing:0; }
.about-panorama figcaption > span:last-child { font-size:1rem; }
.about-milestones { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin:0; padding:38px 0 52px; list-style:none; border-bottom:1px solid var(--border); }
.about-milestones li { border-top:1px solid var(--border); padding-top:18px; }
.about-milestones li > span { color:var(--blue-700); font:400 2.4rem/1.2 "Times New Roman",Georgia,serif; }
.about-milestones h2 { font-size:1rem; font-weight:600; margin:16px 0 7px; }
.about-milestones p { color:var(--muted); font-size:1rem; line-height:1.7; margin:0; }
.about-foundation { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(40px,7vw,108px); padding-top:52px; }
.about-foundation h2 { font:400 clamp(2rem,3.2vw,2.8rem)/1.2 "Times New Roman",Georgia,serif; letter-spacing:-.025em; margin:20px 0 0; }
.about-working { padding:84px 0; color:var(--white); background:radial-gradient(ellipse at 8% 30%,rgba(49,88,162,.2),transparent 55%),var(--navy-900); }
.about-working .section-kicker { color:#abc2e1; }
.about-working-head { max-width:850px; margin-bottom:50px; }
.about-working h2 { font:400 clamp(2.6rem,4.6vw,4.3rem)/1.12 "Times New Roman",Georgia,serif; letter-spacing:-.035em; margin:22px 0; text-wrap:balance; }
.about-working h2 em { color:#b3c4d3; font-weight:400; }
.about-working-head > p { color:#bdcad6; font-size:1.08rem; line-height:1.8; max-width:610px; }
.about-working-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:clamp(36px,6vw,90px); align-items:start; }
.about-work-photo { position:sticky; top:115px; margin:0; min-width:0; overflow:hidden; background:transparent; }
.about-work-photo img { width:100%; height:570px; display:block; object-fit:cover; object-position:58% center; mask-image:linear-gradient(90deg,transparent,#000 26px,#000 calc(100% - 26px),transparent),linear-gradient(180deg,transparent,#000 36px,#000 58%,transparent); mask-composite:intersect; }
.about-work-photo::after { content:none; }
.about-work-photo figcaption { position:absolute; z-index:1; bottom:32px; left:28px; right:28px; }
.about-work-photo figcaption > span { font-size:.75rem; letter-spacing:.13em; }
.about-work-photo figcaption p { font:400 2.3rem/1.2 "Times New Roman",Georgia,serif; margin:18px 0 0; }
.about-principles article { display:grid; grid-template-columns:30px 1fr; gap:20px; padding:28px 0; border-top:1px solid rgba(255,255,255,.2); }
.about-principles article:first-child { padding-top:24px; }
.about-step { color:#acc7e8; padding-top:7px; }
.about-work-icon { display:block; width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.about-principles h3 { font:400 clamp(1.8rem,2.8vw,2.55rem)/1.2 "Times New Roman",Georgia,serif; margin:0 0 22px; letter-spacing:-.02em; }
.about-principles p { color:#bdcad6; line-height:1.85; margin:0 0 16px; }
.about-principles p:last-child { margin-bottom:0; }
.about-agreement { margin-top:32px; padding-top:28px; border-top:1px solid rgba(255,255,255,.2); }
.about-agreement h3 { margin:0 0 24px; font-size:1.08rem; font-weight:500; }
.about-agreement ul { list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; padding:0; margin:0; }
.about-agreement li { display:flex; gap:14px; align-items:flex-start; font-size:1rem; line-height:1.6; }
.about-agreement li span { color:#acc7e8; flex:0 0 20px; padding-top:3px; }
.about-agreement .about-work-icon { width:20px; height:20px; }
.about-location { padding:84px 0 92px; }
.about-location h2 { font:400 clamp(2.3rem,4vw,3.7rem)/1.15 "Times New Roman",Georgia,serif; letter-spacing:-.035em; margin:20px 0 42px; text-wrap:balance; }
.about-location-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(32px,6vw,88px); align-items:start; }
.about-contact-intro { line-height:1.75; color:var(--muted); max-width:340px; margin:0 0 20px; }
.about-contact dl { margin:0 0 28px; }
.about-contact dl > div { padding:18px 0; border-bottom:1px solid var(--border); }
.about-contact dt { color:var(--muted); font-size:.8rem; margin-bottom:9px; }
.about-contact dd { margin:0; line-height:1.7; }
.about-contact dd a { display:inline-flex; align-items:center; gap:12px; min-height:44px; max-width:100%; overflow-wrap:anywhere; }
.about-contact dd a:hover { color:var(--blue-700); }
.about-contact .about-hotline { font:400 clamp(1.65rem,2.7vw,2.35rem)/1.3 "Times New Roman",Georgia,serif; white-space:nowrap; }
.about-contact address { font-style:normal; font-size:1rem; }
.about-map { border:1px solid var(--border); border-radius:3px 30px 3px 3px; overflow:hidden; background:var(--steel-100); }
.about-map-placeholder { min-height:420px; display:flex; align-items:center; justify-content:center; flex-direction:column; padding:36px 24px; text-align:center; background:radial-gradient(ellipse at 50% 40%,rgba(49,88,162,.12),transparent 65%),linear-gradient(rgba(36,70,140,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(36,70,140,.04) 1px,transparent 1px); background-size:auto,36px 36px,36px 36px; }
.about-map-pin { width:44px; height:44px; color:var(--red-600); margin-bottom:22px; }
.about-map-placeholder h3 { font:400 clamp(1.75rem,3vw,2.5rem)/1.2 "Times New Roman",Georgia,serif; margin:20px 0 24px; }
.about-map-placeholder p { font-size:.8rem; color:var(--muted); margin:16px 0 0; }
.about-map-frame, .about-map-frame iframe { width:100%; height:420px; display:block; border:0; }
.about-map [hidden] { display:none; }
.about-map-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 20px; padding:10px 20px; background:var(--paper); font-size:.8rem; border-top:1px solid var(--border); }
.about-map-footer a { display:inline-flex; align-items:center; min-height:44px; gap:12px; color:var(--blue-700); }
.about-map-status:empty { display:none; }
.about-map-status { margin:0; padding:0 20px 16px; background:var(--paper); color:var(--muted); font-size:.85rem; line-height:1.6; }
.about-page a:focus-visible { outline:2px solid var(--red-600); outline-offset:5px; }
@media(max-width:1000px) {
  .about-intro, .about-foundation { grid-template-columns:.8fr 1.2fr; gap:40px; }
  .about-working-grid { grid-template-columns:.7fr 1.3fr; gap:32px; }
  .about-location-grid { gap:32px; }
  .about-work-photo img { height:500px; }
}
@media(max-width:760px) {
  .about-company { padding:116px 0 56px; }
  .about-intro, .about-foundation, .about-working-grid, .about-location-grid { grid-template-columns:1fr; gap:28px; }
  .about-intro { padding:30px 0 36px; }
  .about-heading h1 { font-size:clamp(3.5rem,13vw,5.4rem); }
  .about-intro-copy { padding:0; }
  .about-panorama { border-radius:3px 24px 3px 3px; }
  .about-panorama img { height:390px; object-position:42% center; }
  .about-panorama figcaption { left:20px; right:20px; bottom:24px; grid-template-columns:1fr; gap:10px; }
  .about-panorama figcaption strong { grid-column:auto; grid-row:auto; font-size:3rem; }
  .about-panorama figcaption > span:first-child { font-size:.7rem; }
  .about-milestones { grid-template-columns:1fr; gap:22px; padding:28px 0 36px; }
  .about-milestones li { display:grid; grid-template-columns:76px 1fr; gap:16px; }
  .about-milestones li > span { font-size:2rem; }
  .about-milestones h2 { margin:2px 0 6px; }
  .about-foundation { padding-top:36px; }
  .about-working, .about-location { padding:56px 0; }
  .about-working-head { margin-bottom:30px; }
  .about-work-photo { position:relative; top:auto; }
  .about-work-photo img { height:320px; object-position:center 40%; }
  .about-work-photo figcaption { left:24px; bottom:24px; }
  .about-work-photo figcaption p { font-size:2rem; }
  .about-principles article { gap:12px; grid-template-columns:24px 1fr; }
  .about-agreement { margin-top:18px; }
  .about-agreement ul { grid-template-columns:1fr 1fr; gap:18px 22px; }
  .about-agreement li { gap:10px; }
  .about-location h2 { margin-bottom:28px; }
  .about-map-placeholder { min-height:340px; }
  .about-map-frame, .about-map-frame iframe { height:340px; }
}
@media(prefers-reduced-motion:reduce) { .about-text-link { transition:none; } }