#about{container:about / inline-size;--sand:var(--paper);--sand-deep:var(--surface);--milk:var(--paper);--white:#fff;--serif:var(--font-display);--sans:var(--font-body);--latin:var(--font-display)}
#about .variant{display:block;background:var(--sand);min-height:630px}
#about .variant.active{display:block}
#about .eyebrow{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
#about .eyebrow.light{color:#ded6ca}
#about .h2{font:400 clamp(36px,4.05vw,64px)/1.11 var(--serif);letter-spacing:-.035em;margin:0}
#about .copy{font-size:13.5px;line-height:1.9;color:var(--muted);max-width:480px}
#about .thin-rule{height:1px;background:var(--line)}
#about .visual{position:relative;overflow:hidden;background:linear-gradient(115deg,#cdc2b1,#e8e1d6 35%,#b0a89b)}
#about .visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}
#about .visual:hover img{transform:scale(1.025)}
#about .image-tag{position:absolute;background:rgba(247,245,241,.95);bottom:18px;left:18px;padding:11px 14px;color:#524b43;font-size:10px;letter-spacing:.05em}
#about .linkish{display:inline-flex;align-items:center;gap:14px;text-transform:uppercase;font-size:10px;font-weight:700;letter-spacing:.13em;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:9px}
#about .linkish .arrow{font-size:19px;line-height:0;font-weight:400}
#about .roman{font-family:var(--latin)}
#about .v1{padding:48px clamp(28px,5.4vw,78px) 58px;background:var(--sand)}
#about .v1-head{border-top:1px solid var(--line);padding-top:17px;display:flex;justify-content:space-between;margin-bottom:34px}
#about .v1-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(20px,5.6vw,80px)}
#about .v1-copy{display:flex;flex-direction:column;align-items:start;min-width:0}
#about .v1 h2{max-width:550px;margin:22px 0 16px}
#about .v1 .copy{margin:0 0 27px}
#about .v1-benefits{width:100%;margin:0 0 32px}
#about .v1-feature{display:flex;align-items:flex-start;gap:22px;border-top:1px solid var(--line);padding:14px 0}
#about .v1-feature:last-child{border-bottom:1px solid var(--line)}
#about .v1-feature em{font:400 13px var(--latin);color:var(--muted)}
#about .v1-feature span{font-size:12px;color:var(--ink)}
#about .v1-photo{min-height:500px}
#about .v1-photo img{object-position:center}
#about .v1-photo::after{content:attr(data-project-label);position:absolute;z-index:1;top:21px;left:23px;color:white;font:600 9px var(--sans);letter-spacing:.16em;text-shadow:0 1px 8px #0008}
#about .v2{background:var(--milk);padding-top:36px}
#about .v2-inner{padding:0 clamp(24px,4.4vw,64px)}
#about .v2-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}
#about .v2-main{height:430px;position:relative}
#about .v2-main:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,17,16,.5),transparent 68%),linear-gradient(0deg,rgba(15,14,13,.35),transparent 50%)}
#about .v2-overlay{position:absolute;z-index:2;left:clamp(24px,5vw,64px);bottom:49px;color:white;max-width:630px}
#about .v2-overlay h2{font:400 clamp(38px,4.6vw,66px)/1.1 var(--serif);max-width:600px;margin:14px 0}
#about .v2-overlay .eyebrow{color:#eee6dc}
#about .v2-bottom{display:grid;grid-template-columns:1.3fr repeat(3,1fr);border:1px solid var(--line);border-top:0;min-height:163px}
#about .v2-intro{padding:28px 30px}
#about .v2-intro p{margin:12px 0 0;line-height:1.65;font-size:12px;color:var(--muted)}
#about .v2-stat{padding:28px 22px;border-left:1px solid var(--line)}
#about .v2-stat .n{font:400 18px var(--serif);margin-bottom:14px}
#about .v2-stat p{font-size:11.2px;line-height:1.65;color:var(--muted);margin:0}
#about .v2-foot{padding:23px 0 36px;display:flex;justify-content:space-between;align-items:center;gap:15px}
#about .v3{padding:50px clamp(24px,5.4vw,76px);background:var(--paper)}
#about .v3-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(25px,6.2vw,90px)}
#about .v3-art{display:grid;grid-template-columns:1.15fr .72fr;grid-template-rows:225px 225px;gap:11px}
#about .v3-art .large{grid-row:1 / span 2}
#about .v3-art .small1 img{object-position:25% center}
#about .v3-art .small2 img{object-position:55% center}
#about .v3 h2{margin:27px 0 18px}
#about .v3-copy{padding:21px 0 0}
#about .v3-quote{font:400 22px/1.42 var(--serif);margin:31px 0;color:var(--accent);border-left:1px solid var(--line);padding-left:20px}
#about .v3-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-top:24px;border-top:1px solid var(--line);margin-top:24px}
#about .v3-pillar h3{margin:0 0 10px;font:400 17px var(--serif)}
#about .v3-pillar p{font-size:11.5px;line-height:1.75;color:var(--muted);margin:0}
#about .v3 .linkish{margin-top:28px}
#about .v4{padding:45px clamp(24px,5.6vw,80px) 45px;background:var(--ink);color:#f7f5f1}
#about .v4-top{display:flex;justify-content:space-between;border-top:1px solid #736e68;padding-top:14px}
#about .v4-content{display:grid;grid-template-columns:1.5fr .5fr;align-items:end;gap:36px;padding:36px 0 37px}
#about .v4-content h2{font:400 clamp(42px,6vw,70px)/1.11 var(--serif);letter-spacing:-.04em;margin:0;max-width:870px}
#about .v4-content p{font-size:12px;line-height:2.03;color:#c8c0b6;max-width:270px}
#about .v4-photo{height:240px}
#about .v4-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,20,19,.2),transparent)}
#about .v4-bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:20px}
#about .v4-item{display:grid;grid-template-columns:40px 1fr;gap:12px;border-top:1px solid #756f69;padding:23px 18px 0 0}
#about .v4-item + .v4-item{padding-left:19px;border-left:1px solid #756f69}
#about .v4-item em{font:400 15px var(--latin);color:#aa9d8e}
#about .v4-item h3{font:400 17px var(--serif);margin:0 0 9px}
#about .v4-item p{font-size:11px;line-height:1.7;color:#c3b9ac;margin:0}
#about .v5{padding:48px clamp(24px,5.1vw,75px);background:var(--sand)}
#about .v5-top{display:flex;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid var(--line)}
#about .v5-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(25px,7.5vw,110px);padding-top:32px}
#about .v5-photos{display:grid;grid-template-columns:1fr .52fr;gap:12px;align-items:stretch;height:520px}
#about .v5-photos .big{height:475px}
#about .v5-photos .slim{height:315px;align-self:end}
#about .v5-body h2{font:400 clamp(36px,4.1vw,63px)/1.11 var(--serif);margin:17px 0 15px}
#about .v5-body .copy{margin:0 0 25px}
#about .v5-index{margin:28px 0 23px}
#about .v5-entry{display:grid;grid-template-columns:47px 1fr 23px;gap:10px;border-top:1px solid var(--line);padding:19px 0;align-items:center}
#about .v5-entry:last-child{border-bottom:1px solid var(--line)}
#about .v5-entry .num{font:400 17px var(--latin);color:var(--muted)}
#about .v5-entry h3{font:400 17px var(--serif);margin:0 0 6px}
#about .v5-entry p{font-size:11px;line-height:1.6;color:var(--muted);margin:0}
#about .v5-entry .plus{font:300 25px var(--sans);color:var(--muted)}
@container about (max-width:700px){#about .variant{min-height:0}
#about .h2{font-size:35px;line-height:1.15}
#about .copy{font-size:12.5px;line-height:1.85}
#about .eyebrow{font-size:9px}
#about .v1,#about .v3,#about .v4,#about .v5{padding:25px 22px 28px}
#about .v1-head{margin-bottom:20px}
#about .v1-grid,#about .v3-grid,#about .v5-grid{grid-template-columns:1fr;gap:25px}
#about .v1 h2{margin:8px 0 12px}
#about .v1 .copy{margin-bottom:17px}
#about .v1-benefits{margin:0 0 22px}
#about .v1-feature{padding:11px 0}
#about .v1-photo{min-height:280px;height:330px}
#about .v2{padding-top:20px}
#about .v2-inner{padding:0 16px}
#about .v2-main{height:340px}
#about .v2-overlay{left:20px;bottom:22px;max-width:90%}
#about .v2-overlay h2{font-size:37px;line-height:1.15}
#about .v2-bottom{grid-template-columns:1fr 1fr}
#about .v2-intro{grid-column:1 / span 2;padding:19px 17px 21px}
#about .v2-stat{padding:17px;border-top:1px solid var(--line)}
#about .v2-stat:nth-of-type(2){border-left:none}
#about .v2-stat:nth-of-type(4){grid-column:span 2}
#about .v2-stat .n{font-size:16px;margin-bottom:7px}
#about .v2-foot{padding-bottom:23px;align-items:start}
#about .v2-foot .eyebrow{display:none}
#about .v3-art{grid-template-rows:190px 140px;gap:7px}
#about .v3-copy{padding:0}
#about .v3 h2{margin:15px 0}
#about .v3-quote{font-size:19px;margin:20px 0}
#about .v3-row{gap:14px}
#about .v4-content{grid-template-columns:1fr;gap:13px;padding:27px 0 21px}
#about .v4-content h2{font-size:43px}
#about .v4-content p{margin:0;max-width:340px}
#about .v4-photo{height:190px}
#about .v4-bottom{grid-template-columns:1fr;margin-top:10px}
#about .v4-item,#about .v4-item + .v4-item{border-left:0;padding:14px 0 16px;grid-template-columns:31px 1fr}
#about .v5-photos{grid-row:2;height:270px;gap:8px}
#about .v5-photos .big{height:260px}
#about .v5-photos .slim{height:195px}
#about .v5-body h2{margin-top:8px}
#about .v5-index{margin:17px 0}
#about .v5-entry{padding:14px 0;grid-template-columns:37px 1fr 16px}
#about .v5-entry h3{font-size:16px}
#about .v5 .linkish{margin:5px 0}
}
@container about (max-width:430px){#about .v1 h2,#about .v3 h2,#about .v5 h2{font-size:33px}
#about .v2-overlay h2{font-size:32px}
#about .v4-content h2{font-size:39px}
#about .v2-stat p,#about .v3-pillar p{font-size:10.5px}
#about .v3-art{grid-template-rows:155px 128px}
#about .v1-photo{height:275px;min-height:0}
#about .v4-photo{height:160px}
}

#about .variant{font-family:var(--font-body);color:var(--ink)}#about .v4{color:var(--paper)}#about h2{font-weight:400;overflow-wrap:anywhere}#about .copy{font-size:14px}#about .v2-stat p,#about .v3-pillar p,#about .v4-item p,#about .v5-entry p{font-size:12px}#about .linkish{cursor:pointer;background:transparent;border:0;border-bottom:1px solid currentColor;padding:0 0 9px;text-align:left;min-height:44px}#about .linkish:focus-visible{outline:2px solid var(--accent);outline-offset:5px}#about .v4 .linkish:focus-visible{outline-color:var(--paper)}#about .image-tag{font-size:11px}#about .v1-photo::after{max-width:calc(100% - 40px);line-height:1.6}#about .visual img{max-width:100%}
@container about (max-width:700px){#about .copy{font-size:13px}#about .v2-stat p,#about .v3-pillar p,#about .v4-item p,#about .v5-entry p{font-size:12px}#about .v4-content p{font-size:13px}#about .v1-head,#about .v5-top,#about .v4-top{gap:16px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){#about .visual:hover img{transform:none}}
#about .eyebrow,#about .copy,#about .linkish{overflow-wrap:anywhere;min-width:0;max-width:100%}
