:root{color-scheme:light;--navy:#002840;--blue:#286880;--sea:#70a0a8;--sand:#e0b078;--paper:#f3f0e9;--muted:#465d67;--line:#b5c5cb;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--navy);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:20px}
body{margin:0;min-width:320px}
a{color:inherit}
:focus-visible{outline:3px solid var(--sand);outline-offset:4px}
.skip-link{position:absolute;z-index:20;top:10px;left:10px;padding:12px 16px;background:#fff;color:var(--navy);transform:translateY(-160%)}
.skip-link:focus{transform:none}
.site-header{height:78px;padding:0 clamp(22px,5.5vw,84px);display:flex;justify-content:space-between;align-items:center;background:var(--navy);position:relative;z-index:5;border-bottom:1px solid #ffffff24}
.brand img{width:244px;height:auto;display:block}
.header-privacy{min-height:44px;display:inline-flex;align-items:center;padding:0 4px;color:#f8f8f6;text-decoration:none;font-size:12px;letter-spacing:.06em}
.header-privacy:hover{text-decoration:underline;text-underline-offset:5px;color:#b7d1d5}
.hero{height:clamp(650px,calc(100svh - 78px),790px);position:relative;display:flex;align-items:center;overflow:hidden;isolation:isolate;background:var(--paper)}
.hero-art{position:absolute;z-index:-1;inset:0;overflow:hidden;background:var(--paper)}
.hero-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--paper) 0%,#f3f0e9f8 26%,#f3f0e9dd 37%,#f3f0e96e 48%,transparent 64%),linear-gradient(0deg,#f3f0e9b5,transparent 18%);pointer-events:none}
.hero-art>img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center;animation:blueprint-resolve 900ms cubic-bezier(.2,.65,.25,1) both}
@keyframes blueprint-resolve{from{opacity:.62;clip-path:inset(0 0 0 9%)}to{opacity:1;clip-path:inset(0)}}
.hero-content{width:min(610px,47vw);margin-left:clamp(28px,8.3vw,128px);padding:72px 0 82px;position:relative;z-index:2}
.eyebrow{font-size:10px;letter-spacing:.19em;font-weight:800;color:#705524;margin:0;text-transform:uppercase}
h1,h2{font-family:Georgia,"Times New Roman",serif;font-weight:400}
.hero h1{font-size:clamp(68px,7.1vw,104px);line-height:.94;letter-spacing:-.069em;margin:25px 0 27px}
.hero h1 em,.place h2 em{font-weight:400;color:var(--blue)}
.hero-copy{max-width:445px;font-size:17px;line-height:1.6;color:#344e59;margin:0}
.text-link{display:inline-flex;min-height:44px;align-items:center;gap:19px;margin-top:22px;padding:4px 0 7px;border-bottom:1px solid var(--navy);text-decoration:none;font-size:12px;font-weight:750}
.text-link span{font-size:18px;transition:transform 180ms ease}
.text-link:hover span{transform:translate(3px,3px)}
.map-label{position:absolute;z-index:1;font-size:9px;letter-spacing:.15em;font-weight:800;color:var(--navy);text-shadow:0 1px 3px var(--paper),0 0 7px var(--paper)}
.map-label:after{content:"";display:block;width:43px;height:1px;margin-top:8px;background:var(--sand)}
.map-label small{display:block;margin-top:5px;font-size:8px;letter-spacing:.13em;font-weight:600}
.map-castillo{top:12%;left:59%}.map-bay{top:37%;right:4%}.map-bridge{bottom:18%;right:3%}
.map-disclosure{position:absolute;z-index:1;right:3%;bottom:4%;font-size:8px;letter-spacing:.15em;font-weight:800;color:#345768;text-shadow:0 1px 4px var(--paper)}
.map-mobile-legend{display:none}
.place{min-height:455px;display:grid;grid-template-columns:minmax(0,46%) minmax(0,54%);position:relative;overflow:hidden;border-top:1px solid var(--sea)}
.place-photo{min-height:455px;position:relative;overflow:hidden;background:var(--navy)}
.place-photo picture,.place-photo img{position:absolute;inset:0;width:100%;height:100%;display:block}
.place-photo img{object-fit:cover;object-position:38% 72%;filter:saturate(.68) sepia(.1) contrast(1.08) brightness(.79)}
.place-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#002840b0,transparent 45%),linear-gradient(90deg,#00284024,transparent 70%);pointer-events:none}
.photo-credit{position:absolute;z-index:2;left:clamp(22px,5.2vw,80px);bottom:30px;color:#f5f1e8;font-size:9px;line-height:1.65;font-weight:800;letter-spacing:.15em}
.place-copy{min-height:455px;padding:68px clamp(30px,6.1vw,92px);background:#dfe9e7;position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start}
.place-copy:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#28688016 1px,transparent 1px),linear-gradient(90deg,#28688016 1px,transparent 1px);background-size:48px 48px;pointer-events:none}
.section-index{position:relative;font-size:9px;letter-spacing:.16em;font-weight:800;color:var(--blue)}
.place h2{position:relative;font-size:clamp(46px,5.2vw,72px);line-height:1.01;letter-spacing:-.06em;margin:25px 0}
.place-copy>p{position:relative;max-width:510px;color:#314d5b;font-size:16px;line-height:1.62;margin:0}
.place-rule{position:relative;display:block;width:58px;height:2px;background:var(--sand);margin-top:auto}
.place-trace{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;opacity:.55}
.place-trace path{fill:none;stroke:#8caeb1;stroke-width:1;stroke-dasharray:6 8}
.place-trace circle{fill:var(--sand);stroke:none}
.work{min-height:640px;position:relative;overflow:hidden;border-top:2px solid var(--sea);background:var(--navy);color:#fff;display:grid;grid-template-columns:180px minmax(0,1fr);gap:4vw;padding:88px clamp(26px,7.2vw,110px) 82px}
.work:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.95%,#70a0a821 50%,transparent 50.05%),linear-gradient(transparent 49.95%,#70a0a821 50%,transparent 50.05%);background-size:42px 42px;opacity:.45;pointer-events:none}
.work-drawing{position:absolute;inset:0;width:100%;height:100%;opacity:.42;pointer-events:none}
.work-number,.work-content{position:relative;z-index:1}
.work-number{font-family:Georgia,"Times New Roman",serif;font-size:68px;line-height:1;color:var(--sea)}
.work-number span{display:block;margin-top:18px;font-family:Arial,sans-serif;font-size:29px;color:var(--sand)}
.work .eyebrow{color:var(--sand)}
.work h2{max-width:940px;font-size:clamp(46px,5.8vw,82px);line-height:1.06;letter-spacing:-.052em;margin:24px 0 18px}
.work-intro{font-size:16px;line-height:1.6;color:#c9dcdf;max-width:650px;margin:0}
.continuum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:62px;position:relative}
.continuum:before{content:"";position:absolute;left:0;right:0;top:1px;height:1px;background:linear-gradient(90deg,var(--sand),var(--sea))}
.continuum>div{position:relative;padding:20px 6px 0 0;border-top:1px solid #70a0a85c}
.continuum>div:before{content:"";position:absolute;top:-4px;left:0;width:8px;height:8px;background:var(--sand)}
.continuum small{display:block;color:var(--sand);font-size:9px;letter-spacing:.16em;font-weight:800}
.continuum strong{display:block;margin-top:18px;font-size:18px;line-height:1.25;letter-spacing:-.025em}
.continuum span{display:block;margin-top:10px;color:#c9dcdf;line-height:1.5;font-size:12px;max-width:260px}
.site-footer{min-height:120px;padding:24px clamp(22px,5.5vw,84px);display:flex;justify-content:space-between;align-items:center;gap:24px;background:var(--paper)}
.footer-brand img{width:190px;height:auto;display:block}
.site-footer p,.footer-end{font-size:10px;line-height:1.65;color:var(--muted)}
.site-footer p{margin:0}
.footer-end{display:flex;align-items:center;gap:24px}
.footer-end a{min-height:24px;display:inline-flex;align-items:center;text-underline-offset:3px}

@media(max-width:900px){
  .hero{height:clamp(650px,calc(92svh - 78px),740px)}
  .hero-content{width:min(560px,54vw);margin-left:6vw}
  .hero h1{font-size:clamp(63px,8vw,82px)}
  .hero-art>img{object-position:58% center}
  .hero-art:after{background:linear-gradient(90deg,var(--paper) 0%,#f3f0e9f5 33%,#f3f0e9b8 49%,transparent 71%),linear-gradient(0deg,#f3f0e9a8,transparent 17%)}
  .place{grid-template-columns:minmax(0,43%) minmax(0,57%)}
  .place-copy{padding:55px 36px}
  .place h2{font-size:clamp(42px,5.5vw,59px)}
  .work{grid-template-columns:120px minmax(0,1fr);gap:3vw;padding:72px 6vw}
}
@media(max-width:640px){
  .site-header{height:70px;padding:0 20px}
  .brand img{width:210px}
  .header-privacy{font-size:11px}
  .hero{display:flex;flex-direction:column;align-items:stretch;height:auto;min-height:0;padding:0 0 0;overflow:hidden}
  .hero-content{order:1;width:auto;margin:0;padding:41px 24px 0}
  .eyebrow{font-size:9px;letter-spacing:.17em}
  .hero h1{font-size:clamp(53px,12.4vw,72px);line-height:.94;margin:20px 0 20px;letter-spacing:-.065em}
  .hero-copy{max-width:480px;font-size:15px;line-height:1.55}
  .text-link{margin-top:15px;font-size:11px}
  .hero-art{order:2;position:relative;inset:auto;z-index:0;display:block;width:100%;height:clamp(390px,112vw,500px);margin-top:16px}
  .hero-art:after{background:linear-gradient(180deg,var(--paper) 0%,#f3f0e9c9 6%,transparent 24%),linear-gradient(0deg,#f3f0e9f2 0%,transparent 16%)}
  .hero-art>img{object-position:62% center;object-fit:cover}
  .map-label{display:none}
  .map-disclosure{right:18px;bottom:57px;font-size:7px}
  .map-mobile-legend{position:absolute;z-index:2;bottom:0;left:0;right:0;min-height:43px;padding:0 14px;background:#f3f0e9ed;border-top:1px solid #70a0a88a;display:flex;align-items:center;justify-content:space-between;gap:7px;color:var(--navy);font-size:7px;font-weight:800;letter-spacing:.07em;white-space:nowrap}
  .map-mobile-legend i{width:17px;height:1px;background:var(--sand);flex:none}
  .place{display:block}
  .place-photo{height:clamp(280px,82vw,350px);min-height:0}
  .place-photo img{object-position:36% 70%}
  .photo-credit{left:22px;bottom:22px;font-size:8px}
  .place-copy{min-height:0;padding:42px 24px 48px}
  .place h2{font-size:clamp(46px,10vw,64px);margin:19px 0}
  .place-copy>p{font-size:15px;max-width:520px}
  .place-rule{margin-top:29px}
  .place-trace{opacity:.28}
  .work{display:block;min-height:0;padding:52px 24px 58px}
  .work-number{font-size:46px;line-height:.8;margin-bottom:31px}
  .work-number span{display:none}
  .work h2{font-size:clamp(42px,9.2vw,61px);line-height:1.06;margin:20px 0 17px}
  .work-intro{font-size:15px}
  .continuum{grid-template-columns:1fr;gap:18px;margin-top:40px}
  .continuum:before{display:none}
  .continuum>div{padding-top:14px}
  .continuum strong{margin-top:12px}
  .continuum span{max-width:420px}
  .work-drawing{opacity:.24;object-fit:cover;object-position:65% center}
  .site-footer{padding:22px 22px;display:grid;grid-template-columns:1fr auto;gap:15px}
  .footer-brand img{width:156px}
  .site-footer p{grid-column:1/-1;grid-row:2}
  .footer-end{grid-column:2;grid-row:1;display:grid;gap:5px;text-align:right;font-size:9px}
}
@media(max-width:360px){
  .site-header{padding:0 16px}.brand img{width:185px}
  .hero-content{padding-left:20px;padding-right:20px}
  .hero h1{font-size:51px}
  .hero-copy{font-size:14px}
  .map-mobile-legend{font-size:6px;padding:0 10px}
  .map-mobile-legend i{width:11px}
  .footer-brand img{width:142px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  .hero-art>img{animation:none;clip-path:none;opacity:1}
}