/*
Theme Name: Oak Studio Stable Theme Before Content - Mobile Design Highlights HAS Fix
Theme URI: https://oak-studio.net/
Author: Oak Studio
Description: Hard-stable Oak Studio portfolio theme with rebuilt project patterns, clean CSS layers, and safer Gutenberg output.
Version: 4.8.6
Text Domain: oakstudio-dev
*/

:root{
  color-scheme: light;
  --os-bg:#eee9df;
  --os-bg-soft:#f6f2ea;
  --os-ink:#12110f;
  --os-muted:#68635c;
  --os-line:rgba(18,17,15,.13);
  --os-gold:#b7a06a;
  --os-dark:#11110f;
  --os-white:#fff;
  --os-max:1680px;
  --os-pad:clamp(22px,4vw,72px);
  --oak-project-content:min(1280px,calc(100vw - clamp(44px,8vw,144px)));
  --oak-project-wide:min(1480px,calc(100vw - clamp(28px,5vw,88px)));
  --oak-project-gap:clamp(8px,1.05vw,16px);
  --oak-project-block-space:clamp(38px,5.5vw,84px);
  --oak-project-divider-space:clamp(4px,.8vw,8px);
  --oak-project-divider-adjacent-space:clamp(14px,1.8vw,26px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--os-bg);color-scheme:light}
body{margin:0;background:var(--os-bg);color:var(--os-ink);font-family:Montserrat,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img,video,iframe{max-width:100%;display:block}
button,input,textarea{font:inherit}
body.darkreader,html[data-darkreader-mode]{color-scheme:light!important}

/* Header */
.os-site-header{position:fixed;z-index:1000;top:0;left:0;width:100%;height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,3vw,44px);color:#11110f;pointer-events:none;mix-blend-mode:normal;background:rgba(238,233,223,var(--os-header-glass-alpha,.16));backdrop-filter:blur(var(--os-header-glass-blur,10px));-webkit-backdrop-filter:blur(var(--os-header-glass-blur,10px));transition:color .25s ease,background .25s ease}
.os-logo,.os-nav{pointer-events:auto}.os-logo{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;white-space:nowrap}.os-nav{display:flex;align-items:center;gap:clamp(16px,2vw,34px);font-size:11px;letter-spacing:.16em;text-transform:uppercase}.os-nav a{opacity:.9;transition:opacity .25s ease}.os-nav a:hover{opacity:1}
body.os-header-light .os-site-header,.os-site-header.os-header-on-dark{color:#fff;background:rgba(10,10,10,.12)}body.os-header-dark .os-site-header,.os-site-header.os-header-on-light{color:#11110f;background:rgba(238,233,223,var(--os-header-glass-alpha,.16))}.os-site-header.is-over-dark,.os-site-header[data-tone="light"]{color:#fff;background:rgba(10,10,10,.12)}.os-site-header.is-over-light,.os-site-header[data-tone="dark"]{color:#11110f;background:rgba(238,233,223,var(--os-header-glass-alpha,.16))}

/* Base sections */
.os-main{overflow:hidden}.os-section{padding:clamp(82px,10vw,150px) var(--os-pad)}.os-section-inner{max-width:var(--os-max);margin:0 auto}.os-label{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--os-label-color,var(--os-gold));display:inline-block;margin-bottom:20px;font-family:var(--os-label-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-label-font-weight,600)}.os-title{font-size:clamp(34px,4vw,74px);line-height:1.02;font-family:var(--os-section-title-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-section-title-font-weight,400);letter-spacing:-.045em;margin:0;color:var(--os-section-title-color,inherit)}.os-text{font-size:clamp(15px,1.25vw,20px);line-height:1.75;color:var(--os-body-text-color,var(--os-muted));margin:0;font-family:var(--os-body-text-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-body-text-font-weight,400)}

/* Home hero */
.os-hero{position:relative;min-height:100svh;color:#fff;background-image:var(--hero-desktop);background-size:cover;background-position:center;background-repeat:no-repeat;overflow:hidden;isolation:isolate}.os-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.14),rgba(0,0,0,.32));z-index:1;pointer-events:none}.os-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}.os-hero-video--mobile{display:none}.os-hero--empty{background-color:var(--os-bg);color:var(--os-ink)}.os-hero--empty::before{display:none}.os-hero--empty .os-hero-center,.os-hero--empty .os-hero-left,.os-hero--empty .os-hero-desc,.os-hero--empty .os-hero-tags{color:var(--os-ink);text-shadow:none}.os-hero-grid{position:absolute;z-index:2;inset:44px var(--os-pad) clamp(22px,4vw,54px);display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr auto;gap:20px;align-items:end;max-width:var(--os-max);margin:0 auto;left:var(--os-pad);right:var(--os-pad)}.os-hero-center{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(24px,3vw,var(--hero-center-size,44px));letter-spacing:.24em;text-transform:uppercase;text-align:center;white-space:nowrap;font-family:var(--os-hero-center-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-hero-center-font-weight,400);color:var(--os-hero-center-color,#fff);text-shadow:0 12px 34px rgba(0,0,0,.22)}.os-hero-left{grid-column:1;grid-row:2;font-size:clamp(38px,5.2vw,92px);line-height:.94;letter-spacing:-.055em;font-family:var(--os-hero-left-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-hero-left-font-weight,400);color:var(--os-hero-left-color,#fff);max-width:520px;text-shadow:0 14px 38px rgba(0,0,0,.24)}.os-hero-bottom{grid-column:2 / 4;grid-row:2;display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,80px);align-items:end}.os-hero-bottom-item{border-top:1px solid rgba(255,255,255,.48);padding-top:16px;min-height:72px;display:flex;align-items:flex-start}.os-hero-desc{font-size:clamp(12px,1vw,15px);line-height:1.65;color:var(--os-hero-desc-color,#fff);max-width:520px;margin:0;font-family:var(--os-hero-desc-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-hero-desc-font-weight,400)}.os-hero-tags{font-size:clamp(10px,.8vw,12px);line-height:1.9;letter-spacing:.18em;text-transform:uppercase;color:var(--os-hero-tags-color,#fff);margin:0;text-align:left;font-family:var(--os-hero-tags-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-hero-tags-font-weight,400)}

/* Home sections */
.os-intro{background:var(--os-bg);padding-top:clamp(92px,10vw,165px);padding-bottom:clamp(96px,11vw,180px)}.os-intro-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:clamp(44px,8vw,145px);align-items:center}.os-intro .os-title{font-size:clamp(44px,5.7vw,108px);line-height:.98;letter-spacing:-.062em;max-width:980px}.os-intro .os-text{font-size:clamp(17px,1.25vw,22px);line-height:1.75;max-width:720px;margin:0;color:var(--os-body-text-color,#4f4b45)}.os-intro-tags{margin-top:46px;border-top:1px solid rgba(0,0,0,.14);padding-top:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#7d766d}
.os-projects{background:#11110f;color:#fff;padding-top:clamp(80px,8vw,120px);padding-bottom:clamp(76px,8vw,120px)}.os-projects-head{max-width:var(--os-max);margin:0 auto clamp(32px,4vw,54px);display:flex;align-items:end;justify-content:space-between;gap:28px;padding:0 var(--os-pad)}.os-projects-head .os-title{font-size:clamp(32px,4.4vw,78px)}.os-projects-note{max-width:390px;color:rgba(255,255,255,.58);font-size:14px;line-height:1.7;margin:0}.os-slider-wrap{max-width:min(1460px,calc(100vw - (var(--os-pad) * 2)));margin:0 auto;position:relative;overflow:visible}.os-project-slider{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;overscroll-behavior-x:contain;gap:0;padding:0;cursor:grab}.os-project-slider::-webkit-scrollbar{display:none}.os-project-slider.is-dragging{cursor:grabbing}.os-project-card{position:relative;flex:0 0 clamp(210px,20vw,340px);height:clamp(420px,52vh,620px);overflow:hidden;background:#242424;scroll-snap-align:center;cursor:pointer;transition:flex-basis .42s cubic-bezier(.2,.7,.2,1),filter .35s ease,opacity .35s ease;isolation:isolate}.os-project-card *{pointer-events:none}.os-project-card img{width:100%;height:100%;object-fit:cover;transition:transform .65s ease,filter .35s ease}.os-project-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.58));z-index:1}.os-project-card:hover{flex-basis:clamp(250px,25vw,430px)}.os-project-slider:hover .os-project-card:not(:hover) img{filter:grayscale(1);opacity:.42}.os-project-card:hover img{transform:scale(1.045)}.os-card-meta{position:absolute;left:20px;right:20px;bottom:20px;z-index:2}.os-card-meta h3{margin:0 0 8px;font-size:clamp(18px,1.5vw,26px);font-weight:400;letter-spacing:-.03em}.os-card-meta p{margin:0;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.72)}.os-slider-controls{display:flex;justify-content:center;gap:10px;margin:26px 0 0}.os-arrow{width:42px;height:42px;border:1px solid rgba(255,255,255,.22);background:transparent;color:#fff;border-radius:50%;cursor:pointer;transition:background .25s ease}.os-arrow:hover{background:rgba(255,255,255,.1)}.os-full-projects{text-align:center;margin-top:34px}.os-btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 26px;border:1px solid currentColor;background:transparent;letter-spacing:.16em;text-transform:uppercase;font-size:11px;transition:all .25s ease}.os-btn:hover{background:currentColor}.os-btn:hover span{color:#111}.os-btn span{transition:color .25s ease}.os-btn-dark:hover{background:#111;color:#fff}.os-btn-dark:hover span{color:#fff}
.os-motion{background:var(--os-bg-soft)}.os-motion-grid{display:grid;grid-template-columns:minmax(420px,1.35fr) minmax(280px,.65fr);gap:clamp(30px,5vw,86px);align-items:center}.os-motion-media{background:#111;min-height:420px;overflow:hidden}.os-motion-media img,.os-motion-media video{width:100%;height:100%;object-fit:cover}.os-motion-placeholder{min-height:420px;display:grid;place-items:center;color:rgba(255,255,255,.45);letter-spacing:.16em;text-transform:uppercase;font-size:11px}.os-contact{background:var(--os-bg);color:var(--os-ink);min-height:calc(100svh - 72px);display:flex;align-items:center}.os-contact .os-label{color:var(--os-gold);margin-bottom:22px}.os-contact .os-title{font-size:clamp(58px,8.2vw,142px);line-height:.82;letter-spacing:-.075em;font-weight:800;text-transform:uppercase;max-width:700px}.os-contact .os-text{color:var(--os-body-text-color,#3f454a);font-size:clamp(16px,1.1vw,21px);line-height:1.65;max-width:560px;margin-top:clamp(28px,3vw,44px)}.os-contact-grid{width:100%;display:grid;grid-template-columns:minmax(420px,.95fr) minmax(420px,.95fr);gap:clamp(54px,8vw,150px);align-items:center}.os-form{display:grid;gap:0}.os-field{width:100%;border:0;border-bottom:1px solid rgba(17,17,15,.24);background:transparent;color:#11110f;padding:18px 0 20px;outline:none;border-radius:0;letter-spacing:.16em;text-transform:uppercase;font-size:11px;font-weight:600}.os-field::placeholder{color:#3f454a;opacity:1}.os-field:focus{border-bottom-color:rgba(17,17,15,.72)}textarea.os-field{min-height:150px;resize:vertical;line-height:1.7}.os-submit{width:max-content;margin-top:30px;border:1px solid #11110f;background:#11110f;color:#fff;padding:20px 38px;letter-spacing:.18em;text-transform:uppercase;font-size:12px;font-weight:700;cursor:pointer}.os-submit:hover{background:transparent;color:#11110f}.os-form-message{margin-top:18px;padding:13px 15px;background:rgba(17,17,15,.05);border:1px solid rgba(17,17,15,.16);color:#11110f}

/* Archive */
.os-index-hero{padding:150px var(--os-pad) 80px;background:#11110f;color:#fff}.os-index-hero-inner,.os-archive-grid{max-width:var(--os-max);margin:0 auto}.os-index-hero-inner{display:grid;grid-template-columns:1fr minmax(240px,.45fr);gap:60px;align-items:end}.os-page-note{max-width:520px;color:rgba(255,255,255,.6);line-height:1.7}.os-back{display:inline-block;margin-bottom:28px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.7)}.os-back-light{margin:20px 0 0}.os-index-hero-visual{min-height:360px;background:linear-gradient(135deg,#24231f,#5a5144);opacity:.8}.os-archive-section{background:var(--os-bg)}.os-archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,34px)}.os-archive-card{display:block;background:#e0dbd1;padding-bottom:22px;overflow:hidden}.os-archive-card img{width:100%;aspect-ratio:4/5;object-fit:cover}.os-archive-card h2{font-weight:400;font-size:24px;letter-spacing:-.03em;margin:20px 20px 8px}.os-archive-card p{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--os-muted);margin:0 20px}

/* Single Project */
body.single-project{background:var(--os-project-page-outer-bg,#fff)}body.single-project .os-project-frame{max-width:1600px;margin:0 auto;background:var(--os-project-page-bg,#ebe7dd);padding:0 clamp(12px,2vw,28px) clamp(32px,4vw,70px);--os-project-stage:var(--os-project-page-bg,#ebe7dd);--os-project-paper:var(--os-project-page-bg,#ebe7dd);--os-project-line:var(--os-project-line-color,rgba(17,17,15,.16))}.os-single-hero{position:relative;display:grid;place-items:center;min-height:clamp(520px,72vh,820px);max-height:880px;margin-left:calc(clamp(12px,2vw,28px) * -1);margin-right:calc(clamp(12px,2vw,28px) * -1);padding:0;overflow:hidden;background-color:var(--os-project-stage);background-image:var(--project-hero-desktop);background-size:cover;background-position:center;color:#fff;isolation:isolate}.os-single-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.16),rgba(0,0,0,.58));opacity:var(--os-project-hero-overlay-opacity,1);z-index:2}.os-single-hero-picture,.os-single-hero-picture img,.os-single-hero .os-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.os-single-hero-picture{z-index:0}.os-single-hero .os-hero-video{z-index:1}.os-single-hero-inner{position:relative;z-index:3;width:min(1040px,calc(100vw - 72px));margin:0 auto;text-align:center;align-self:end;padding:0 clamp(18px,3vw,48px) clamp(86px,13vh,150px)}.os-single-label{color:rgba(255,255,255,.82);text-align:center}.os-single-hero h1{font-size:clamp(30px,4.2vw,80px);line-height:.98;letter-spacing:-.045em;font-weight:400;margin:0 auto;text-align:center;max-width:980px}.os-project-block-layout{background:var(--os-project-paper);border-top:1px solid var(--os-project-line);border-bottom:1px solid var(--os-project-line);padding:clamp(56px,7vw,110px) clamp(22px,4vw,72px)}.os-project-block-layout-inner{width:100%;max-width:none;margin:0 auto;display:block}.os-project-nav-section{max-width:1600px;margin:0 auto;background:var(--os-project-stage);border-top:1px solid var(--os-project-line);padding:clamp(42px,5vw,82px) clamp(44px,5vw,86px);display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,80px);align-items:center}.os-project-nav-section .os-nextprev{margin:0;padding:0;border:0;display:flex;justify-content:flex-end;gap:clamp(20px,4vw,70px)}.os-project-nav-section .os-nextprev span:empty{display:none}.os-project-nav-section .os-nextprev span,.os-project-nav-section .os-nextprev a{font-size:11px;line-height:1.2;letter-spacing:.18em;text-transform:uppercase;color:#11110f}

/* Project block patterns: clean direct model + legacy tolerance */
.os-project-block-layout :where(.os-pb-section,.oak-360-viewer){margin-block:var(--oak-project-block-space)}.os-project-block-layout :where(.os-pb-section:first-child,.oak-360-viewer:first-child){margin-top:0}.os-project-block-layout :where(.os-pb-section:last-child,.oak-360-viewer:last-child){margin-bottom:0}.os-project-block-layout :where(.os-pb-section,.oak-360-viewer,.os-pb-divider-block){width:var(--oak-project-content);max-width:100%;margin-left:auto;margin-right:auto;background:transparent;border:0;box-shadow:none;padding:0}.os-project-block-layout :where(.os-pb-wide,.os-pb-wide-image,.os-pb-full-image,.os-pb-media-video,.os-pb-external-video){width:var(--oak-project-content);max-width:100%}.os-project-block-layout :where(.wp-block-image,figure,.wp-block-video,.wp-block-embed){margin:0;width:100%;max-width:none}.os-project-block-layout :where(.wp-block-image img,figure img){display:block;width:100%;height:auto;max-width:100%;object-fit:contain;background:transparent}.os-project-block-layout :where(.wp-block-image a,.os-auto-lightbox-link){display:block;color:inherit}.os-project-block-layout :where(.wp-block-image img[data-os-lightbox-image],.wp-block-image a[data-lightbox] img){cursor:zoom-in}.os-project-block-layout :where(.wp-block-image img){transition:transform .45s ease,filter .3s ease,opacity .3s ease}.os-project-block-layout :where(.wp-block-image a[data-lightbox]:hover img,img[data-os-lightbox-image]:hover){transform:scale(1.012)}.os-project-block-layout :where(.os-pb-full-image,.os-pb-wide-image,.os-pb-media-video,.os-pb-external-video) > :where(.wp-block-image,.wp-block-video,.wp-block-embed,figure,.wp-block-embed__wrapper){width:100%;max-width:none!important;margin-left:0!important;margin-right:0!important}
.os-project-block-layout .os-pb-grid{display:grid;gap:var(--oak-project-gap);align-items:start}.os-project-block-layout .os-pb-two-images{grid-template-columns:repeat(2,minmax(0,1fr))}.os-project-block-layout .os-pb-two-mixed{grid-template-columns:minmax(0,1.45fr) minmax(0,.85fr)}.os-project-block-layout .os-pb-three-images{grid-template-columns:repeat(3,minmax(0,1fr))}.os-project-block-layout .os-pb-four-images{grid-template-columns:repeat(4,minmax(0,1fr))}.os-project-block-layout .os-pb-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);gap:clamp(22px,4vw,68px);align-items:center}.os-project-block-layout .os-pb-text-image{grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr)}.os-project-block-layout .os-pb-copy{display:flex;flex-direction:column;gap:18px}.os-project-block-layout .os-pb-copy p{margin:0;color:inherit}.os-project-block-layout .os-pb-note{text-align:center}.os-project-block-layout .os-pb-note p{margin:0 auto 18px;max-width:980px}.os-project-block-layout .os-pb-note p:last-child{margin-bottom:0}.os-project-block-layout .os-pb-tall-image{max-width:min(780px,100%)}.os-project-block-layout .os-pb-transparent-image,.os-project-block-layout .os-pb-fisheye-stack,.os-project-block-layout .oak-no-hover{background:transparent;box-shadow:none}.os-project-block-layout :where(.oak-no-hover img,.oak-no-hover:hover img,.os-pb-transparent-image img,.os-pb-fisheye-stack img){transform:none!important;filter:none!important;box-shadow:none!important}.os-project-block-layout .os-pb-fisheye-stack{display:grid;gap:var(--oak-project-gap)}.os-project-block-layout .os-pb-four-images.os-pb-cropped :where(.wp-block-image,figure){aspect-ratio:4/3;overflow:hidden;background:#ddd}.os-project-block-layout .os-pb-four-images.os-pb-cropped :where(.wp-block-image>a,.wp-block-image>span){display:block;width:100%;height:100%}.os-project-block-layout .os-pb-four-images.os-pb-cropped img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}.os-project-block-layout :where(.os-pb-media-video,.os-pb-external-video,.os-pb-video-embed,.oak-360-viewer){aspect-ratio:16/9;overflow:hidden}.os-project-block-layout :where(.os-pb-media-video video,.oak-360-viewer iframe,.os-pb-external-video iframe,.os-pb-video-embed iframe){width:100%;height:100%;border:0;display:block;background:#111;object-fit:cover}.os-project-block-layout :where(.wp-block-embed__wrapper){position:relative;width:100%;aspect-ratio:16/9;background:#111;overflow:hidden}.os-project-block-layout :where(.wp-block-embed__wrapper iframe){position:absolute;inset:0}.os-project-block-layout :where(.os-pb-divider-block,.os-pb-divider,.os-pb-dots,.os-pb-soft-spacer){margin-block:var(--oak-project-divider-space);background:transparent}.os-project-block-layout :where(.os-pb-divider-block > *, .os-pb-divider-line, .os-pb-dots-mark){margin-top:0!important;margin-bottom:0!important}.os-project-block-layout .os-pb-divider-line{display:block;width:100%;height:1px;background:var(--os-project-line);border:0;opacity:1}.os-project-block-layout .os-pb-dots-mark{display:block;text-align:center;color:var(--os-project-line);letter-spacing:.65em;font-size:13px;line-height:1}.os-project-block-layout .os-pb-soft-spacer{height:clamp(16px,2vw,30px);min-height:0}.os-project-block-layout :where(.os-pb-section,.oak-360-viewer):has(+ .os-pb-divider-block){margin-bottom:var(--oak-project-divider-adjacent-space)}.os-project-block-layout .os-pb-divider-block + :where(.os-pb-section,.oak-360-viewer){margin-top:var(--oak-project-divider-adjacent-space)}.os-project-block-layout .os-pb-divider-block + .os-pb-divider-block{margin-top:var(--oak-project-divider-space)}
/* Legacy column pattern support */
.os-project-block-layout :where(.os-pb-two-images,.os-pb-two-mixed) > :where(.wp-block-columns,.os-pb-columns,.wp-block-group__inner-container){display:grid;grid-template-columns:inherit;gap:var(--oak-project-gap);align-items:start}.os-project-block-layout :where(.os-pb-image-text,.os-pb-text-image) > :where(.wp-block-columns,.os-pb-columns,.wp-block-group__inner-container){display:grid;grid-template-columns:inherit;gap:clamp(22px,4vw,68px);align-items:center}.os-project-block-layout :where(.wp-block-column){min-width:0}.os-project-block-layout :where(.wp-block-group__inner-container){max-width:none}

/* Footer + Lightbox */
.os-footer{background:var(--os-bg);color:#11110f;border-top:1px solid rgba(17,17,15,.18);padding:28px var(--os-pad)}.os-footer-inner{max-width:var(--os-max);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(17,17,15,.58)}.os-footer-socials{display:flex;align-items:center;justify-content:center;gap:12px}.os-social-link{width:32px;height:32px;border:1px solid rgba(17,17,15,.22);border-radius:50%;display:grid;place-items:center;color:#11110f;opacity:.72}.os-social-link svg{width:16px;height:16px;fill:currentColor}.os-social-link.is-disabled{opacity:.18}.os-lightbox{position:fixed;z-index:4000;inset:0;background:rgba(0,0,0,.88);display:none;align-items:center;justify-content:center;padding:42px}.os-lightbox.is-open{display:flex}.os-lightbox img{max-width:92vw;max-height:86vh;object-fit:contain;transition:transform .08s linear;will-change:transform}.os-lightbox-close,.os-lightbox-nav{position:absolute;border:0;background:rgba(255,255,255,.08);color:#fff;cursor:pointer}.os-lightbox-close{top:20px;right:24px;width:44px;height:44px;border-radius:50%;font-size:30px;line-height:1}.os-lightbox-nav{top:50%;transform:translateY(-50%);width:54px;height:72px;border-radius:999px;font-size:46px;line-height:1}.os-lightbox-prev{left:22px}.os-lightbox-next{right:22px}.os-lightbox.is-zoomed .os-lightbox-nav{opacity:.35}.os-lightbox.is-panning img{cursor:grabbing}

/* Intro animation */
html.os-intro-lock,html.os-intro-lock body{overflow:hidden}.os-studio-intro{position:fixed;z-index:5000;inset:0;display:grid;place-items:center;background:rgba(238,233,223,var(--os-intro-glass-alpha,.82));backdrop-filter:blur(var(--os-intro-glass-blur,18px));-webkit-backdrop-filter:blur(var(--os-intro-glass-blur,18px));transition:opacity .7s ease,visibility .7s ease}.os-studio-intro.is-finishing{opacity:0;visibility:hidden}.os-studio-intro-inner{display:grid;place-items:center;gap:24px}.os-studio-intro-logo{width:var(--os-intro-logo-width,180px);height:auto}.os-studio-intro-text{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--os-ink)}.os-studio-intro-dot{position:relative;width:64px;height:8px}.os-studio-intro-dot span{position:absolute;top:50%;left:0;display:block;width:5px;height:5px;border-radius:50%;background:var(--os-gold);animation:osIntroTravel 1.25s infinite ease-in-out}@keyframes osIntroTravel{0%{opacity:.15;transform:translate(0,-50%) scale(.85)}20%{opacity:1}80%{opacity:1}100%{opacity:.15;transform:translate(59px,-50%) scale(.85)}}

/* Mobile */
@media (max-width:900px){
  :root{--oak-project-content:calc(100vw - 44px);--oak-project-wide:calc(100vw - 32px);--oak-project-gap:clamp(8px,2.5vw,14px);--oak-project-block-space:clamp(32px,8vw,62px)}
  .os-site-header{height:44px}.os-nav{gap:16px;font-size:10px}.os-hero{min-height:100svh;background-image:var(--hero-mobile,var(--hero-desktop));background-position:center}.os-hero-video--desktop{display:none}.os-hero-video--mobile{display:block}.os-hero-grid{inset:44px 22px 26px;left:22px;right:22px;grid-template-columns:1fr;grid-template-rows:1fr auto auto;gap:18px}.os-hero-center{font-size:clamp(18px,5vw,30px);letter-spacing:.18em;white-space:normal;width:calc(100vw - 44px)}.os-hero-left{grid-column:1;grid-row:2;font-size:clamp(36px,14vw,68px);max-width:360px}.os-hero-bottom{grid-column:1;grid-row:3;grid-template-columns:1fr;gap:12px}.os-hero-bottom-item{min-height:auto;padding-top:12px}.os-hero-tags{font-size:10px}.os-intro-grid,.os-motion-grid,.os-contact-grid,.os-index-hero-inner{grid-template-columns:1fr}.os-contact{min-height:auto}.os-contact .os-title{font-size:clamp(48px,16vw,86px)}.os-intro .os-title{font-size:clamp(38px,12vw,66px)}.os-intro-tags{grid-template-columns:1fr;gap:12px;margin-top:30px}.os-projects-head{display:block}.os-projects-note{margin-top:18px}.os-slider-wrap{max-width:calc(100vw - 36px)}.os-project-card{flex-basis:72vw;height:58vh}.os-project-card:hover{flex-basis:78vw}.os-motion-media{min-height:300px;order:2}.os-archive-grid{grid-template-columns:1fr}.os-single-hero{background-image:var(--project-hero-mobile,var(--project-hero-desktop));min-height:86svh}.os-single-hero-inner{width:calc(100vw - 44px)}.os-single-hero h1{font-size:clamp(42px,14vw,76px)}body.single-project .os-project-frame{padding-inline:12px;padding-bottom:28px}.os-project-block-layout{padding:clamp(38px,9vw,70px) clamp(14px,4vw,24px) clamp(54px,10vw,86px)}.os-project-block-layout .os-pb-two-images,.os-project-block-layout .os-pb-two-mixed,.os-project-block-layout .os-pb-split{display:flex;flex-direction:column;gap:clamp(16px,5vw,30px)}.os-project-block-layout .os-pb-image-text .wp-block-image{order:2}.os-project-block-layout .os-pb-image-text .os-pb-copy{order:1}.os-project-block-layout .os-pb-three-images{grid-template-columns:repeat(3,minmax(0,1fr))}.os-project-block-layout .os-pb-four-images{grid-template-columns:repeat(2,minmax(0,1fr))}.os-project-block-layout :where(.os-pb-two-images,.os-pb-two-mixed,.os-pb-image-text,.os-pb-text-image) > :where(.wp-block-columns,.os-pb-columns,.wp-block-group__inner-container){display:flex;flex-direction:column;gap:clamp(16px,5vw,30px)}.os-project-nav-section{grid-template-columns:1fr;padding:34px 22px;gap:20px}.os-project-nav-section .os-btn{width:100%;min-width:0;text-align:center}.os-project-nav-section .os-nextprev{justify-content:space-between;gap:16px}.os-footer-inner{display:block;text-align:center}.os-footer-inner>*{margin:10px 0}.os-footer-socials{margin:14px 0}.os-lightbox{padding:18px 14px 72px}.os-lightbox img{max-width:94vw;max-height:82svh}.os-lightbox-close{top:14px;right:16px}.os-lightbox-nav{width:48px;height:58px;font-size:34px}.os-lightbox-prev{left:10px}.os-lightbox-next{right:10px}
}
@media (hover:none),(pointer:coarse){.os-project-slider:hover .os-project-card:not(:hover) img{filter:grayscale(1);opacity:.46}.os-project-slider .os-project-card img{filter:grayscale(1);opacity:.46;transition:filter .28s ease,opacity .28s ease,transform .28s ease}.os-project-slider .os-project-card.is-mobile-focus img{filter:none;opacity:1;transform:scale(1.018)}}

/* DEV031 fine tuning */
@media (max-width:900px){
  .os-single-hero{margin-left:-12px;margin-right:-12px}
  .os-single-hero-inner{width:calc(100vw - 44px);text-align:center;align-self:end;padding:0 0 clamp(70px,14vh,120px)}
  .os-single-label{text-align:center}
  .os-single-hero h1{font-size:clamp(30px,11vw,58px);text-align:center}
  .os-contact-grid{gap:38px}
  .os-contact .os-text{margin-top:22px}
  .os-field{padding:16px 0 18px}
  .os-submit{width:100%;justify-content:center}
}


/* DEV032: text styles and header tone fixes */
.is-style-oak-justify,
.is-style-justified-text,
.os-project-block-layout .is-style-oak-justify,
.os-project-block-layout .is-style-justified-text,
.editor-styles-wrapper .is-style-oak-justify,
.editor-styles-wrapper .is-style-justified-text{
  text-align:justify!important;
  text-align-last:start;
  -webkit-hyphens:auto;
  hyphens:auto;
}
.os-site-header.os-header-on-dark,
body.os-header-light .os-site-header{
  color:#fff!important;
  background:rgba(10,10,10,.12);
}
.os-site-header.os-header-on-light,
body.os-header-dark .os-site-header{
  color:#11110f!important;
  background:rgba(238,233,223,var(--os-header-glass-alpha,.16));
}


/* DEV033: lightbox cursor hint */
.os-project-block-layout :where(.wp-block-image img[data-os-lightbox-image],.wp-block-image a[data-lightbox] img,.os-auto-lightbox-link img){
  cursor:zoom-in!important;
}
.os-lightbox img{
  cursor:zoom-in;
}
.os-lightbox.is-zoomed img{
  cursor:grab;
}
.os-lightbox.is-panning img{
  cursor:grabbing;
}


/* DEV035: individual home text controls */
.os-home-page .os-intro .os-label{font-family:var(--os-intro-label-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-intro-label-font-weight,600);color:var(--os-intro-label-color,var(--os-gold));}
.os-home-page .os-intro .os-title{font-family:var(--os-intro-title-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-intro-title-font-weight,400);color:var(--os-intro-title-color,var(--os-ink));}
.os-home-page .os-intro .os-text{font-family:var(--os-intro-text-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-intro-text-font-weight,400);color:var(--os-intro-text-color,#4f4b45);}
.os-home-page .os-projects .os-label{font-family:var(--os-projects-label-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-projects-label-font-weight,600);color:var(--os-projects-label-color,var(--os-gold));}
.os-home-page .os-projects .os-title{font-family:var(--os-projects-title-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-projects-title-font-weight,400);color:var(--os-projects-title-color,#fff);}
.os-home-page .os-projects-note{font-family:var(--os-projects-note-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-projects-note-font-weight,400);color:var(--os-projects-note-color,rgba(255,255,255,.58));}
.os-home-page .os-motion .os-label{font-family:var(--os-motion-label-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-motion-label-font-weight,600);color:var(--os-motion-label-color,var(--os-gold));}
.os-home-page .os-motion .os-title{font-family:var(--os-motion-title-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-motion-title-font-weight,400);color:var(--os-motion-title-color,var(--os-ink));}
.os-home-page .os-motion .os-text{font-family:var(--os-motion-text-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-motion-text-font-weight,400);color:var(--os-motion-text-color,var(--os-muted));}
.os-home-page .os-contact .os-label{font-family:var(--os-contact-label-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-contact-label-font-weight,600);color:var(--os-contact-label-color,var(--os-gold));}
.os-home-page .os-contact .os-title{font-family:var(--os-contact-title-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-contact-title-font-weight,800);color:var(--os-contact-title-color,var(--os-ink));}
.os-home-page .os-contact .os-text{font-family:var(--os-contact-text-font-family,Montserrat,Arial,sans-serif);font-weight:var(--os-contact-text-font-weight,400);color:var(--os-contact-text-color,#3f454a);}

/* DEV036: larger motion media area */
.os-motion-grid{
  grid-template-columns:minmax(420px,1.35fr) minmax(280px,.65fr);
  gap:clamp(30px,5vw,86px);
}
.os-motion-media{
  min-height:clamp(440px,56vw,760px);
}
.os-motion .os-title{
  max-width:560px;
}
.os-motion .os-text{
  max-width:520px;
}
@media (max-width:900px){
  .os-motion-grid{
    grid-template-columns:1fr;
  }
  .os-motion-media{
    min-height:320px;
  }
}


/* DEV037: restore home hero media mask
   Uses the original desktop/mobile black-white mask files:
   - hero-mask-desktop.webp
   - hero-mask-mobile.webp

   The hero image/video is drawn through the mask, while the shared Hero/Approach
   background remains visible in the masked lower edge. This affects only the
   homepage hero and does not touch project pages or project patterns.
*/
:root{
  --os-hero-approach-bg: color-mix(in srgb, var(--os-bg) calc(100% - var(--os-hero-approach-tint-pct, 0%)), #000 var(--os-hero-approach-tint-pct, 0%));
  --os-hero-mask-desktop: url('https://oak-studio.net/wp-content/uploads/2026/06/hero-mask-desktop.webp');
  --os-hero-mask-mobile: url('https://oak-studio.net/wp-content/uploads/2026/06/hero-mask-mobile.webp');
}
.os-hero{
  background-image:none!important;
  background-color:var(--os-hero-approach-bg)!important;
}
.os-intro{
  background-color:var(--os-hero-approach-bg)!important;
  margin-top:-1px;
}
.os-hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  display:block!important;
  z-index:0!important;
  pointer-events:none!important;
  background-image:var(--hero-desktop)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  background-color:transparent!important;
  -webkit-mask-image:var(--os-hero-mask-desktop)!important;
  mask-image:var(--os-hero-mask-desktop)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-position:center bottom!important;
  mask-position:center bottom!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-mode:luminance;
  mask-mode:luminance;
}
.os-hero-video{
  z-index:1!important;
  -webkit-mask-image:var(--os-hero-mask-desktop)!important;
  mask-image:var(--os-hero-mask-desktop)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-position:center bottom!important;
  mask-position:center bottom!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-mode:luminance;
  mask-mode:luminance;
}
.os-hero::after{
  display:none!important;
  content:none!important;
}
.os-hero-grid{
  z-index:15!important;
}
.os-hero > .os-hero-center{
  z-index:20!important;
}
.os-hero--empty{
  background-image:none!important;
  background-color:var(--os-hero-approach-bg)!important;
}
.os-hero--empty::before{
  display:none!important;
  content:none!important;
}
@media (max-width:900px){
  .os-hero::before{
    background-image:var(--hero-mobile,var(--hero-desktop))!important;
    -webkit-mask-image:var(--os-hero-mask-mobile)!important;
    mask-image:var(--os-hero-mask-mobile)!important;
  }
  .os-hero-video{
    -webkit-mask-image:var(--os-hero-mask-mobile)!important;
    mask-image:var(--os-hero-mask-mobile)!important;
  }
}



/* DEV038: Motion media fill fix
   Fixes black empty area under the Motion image/video when the media height is larger than the natural image height.
   Only affects the homepage Motion section.
*/
.os-motion-media{
  position:relative;
  overflow:hidden;
  background:#111;
  min-height:clamp(440px,56vw,760px);
}
.os-motion-media img,
.os-motion-media video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}
.os-motion-placeholder{
  position:absolute;
  inset:0;
  min-height:0;
  display:grid;
  place-items:center;
}
@media (max-width:900px){
  .os-motion-media{
    min-height:320px;
  }
}



/* DEV042: project outer background scope fix */
body.single-project,
body.single-project .os-main{
  background:var(--os-project-page-outer-bg,#fff)!important;
}



/* PHASE 1: Home text size controls */
.os-home-page .os-hero-left{font-size:var(--os-hero-left-size,clamp(38px,5.2vw,92px));}
.os-home-page .os-hero-center{font-size:var(--os-hero-center-size,clamp(24px,3vw,var(--hero-center-size,44px)));}
.os-home-page .os-hero-desc{font-size:var(--os-hero-desc-size,clamp(12px,1vw,15px));}
.os-home-page .os-hero-tags{font-size:var(--os-hero-tags-size,clamp(10px,.8vw,12px));}

.os-home-page .os-intro .os-label{font-size:var(--os-intro-label-size,11px);}
.os-home-page .os-intro .os-title{font-size:var(--os-intro-title-size,clamp(44px,5.7vw,108px));}
.os-home-page .os-intro .os-text{font-size:var(--os-intro-text-size,clamp(17px,1.25vw,22px));}

.os-home-page .os-projects .os-label{font-size:var(--os-projects-label-size,11px);}
.os-home-page .os-projects .os-title{font-size:var(--os-projects-title-size,clamp(32px,4.4vw,78px));}
.os-home-page .os-projects-note{font-size:var(--os-projects-note-size,14px);}

.os-home-page .os-motion .os-label{font-size:var(--os-motion-label-size,11px);}
.os-home-page .os-motion .os-title{font-size:var(--os-motion-title-size,clamp(34px,4vw,74px));}
.os-home-page .os-motion .os-text{font-size:var(--os-motion-text-size,clamp(15px,1.25vw,20px));}

.os-home-page .os-contact .os-label{font-size:var(--os-contact-label-size,11px);}
.os-home-page .os-contact .os-title{font-size:var(--os-contact-title-size,clamp(58px,8.2vw,142px));}
.os-home-page .os-contact .os-text{font-size:var(--os-contact-text-size,clamp(16px,1.1vw,21px));}







/* PHASE 2 REVISION 2: Project Index / Works Page */
.os-project-index-page{
  background:var(--os-index-outer-bg,#0f0f10);
  color:var(--os-text);
  overflow-x:hidden;
}
.os-index-frame{
  width:min(1500px,100%);
  margin:0 auto;
  background:var(--os-index-inner-bg,#efece4);
  min-height:100svh;
}
.os-project-index-page .os-index-hero{
  position:relative;
  min-height:clamp(560px,72svh,760px);
  background:var(--os-index-inner-bg,#efece4);
  color:#fff;
  overflow:hidden;
  isolation:isolate;
}
.os-project-index-page .os-index-hero-media{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  background:#171613;
}
.os-project-index-page .os-index-hero-media img,
.os-project-index-page .os-index-hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.94) contrast(.96);
  transform:scale(1.01);
}
.os-project-index-page .os-index-hero-video-mobile{
  display:none;
}
.os-project-index-page .os-index-hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:
    linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.18) 44%,rgba(0,0,0,.48)),
    linear-gradient(90deg,rgba(0,0,0,.42),rgba(0,0,0,.12) 52%,rgba(0,0,0,.08));
  pointer-events:none;
}
.os-index-hero-art{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 72% 18%,rgba(255,255,255,.22),transparent 24%),
    linear-gradient(135deg,#23211d,#8d8475);
}
.os-index-hero-art span{
  position:absolute;
  display:block;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.06);
  backdrop-filter:blur(8px);
}
.os-index-hero-art span:nth-child(1){left:11%;top:13%;width:38%;height:30%;}
.os-index-hero-art span:nth-child(2){right:12%;top:29%;width:34%;height:46%;}
.os-index-hero-art span:nth-child(3){left:18%;bottom:13%;width:46%;height:18%;}
.os-project-index-page .os-index-hero-copy{
  position:absolute;
  left:clamp(34px,6vw,96px);
  right:clamp(34px,6vw,96px);
  bottom:clamp(42px,7vw,104px);
  z-index:3;
  max-width:780px;
}
.os-project-index-page .os-back{
  display:inline-flex;
  margin:0 0 30px;
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
  transition:color .25s ease, transform .25s ease;
}
.os-project-index-page .os-back:hover{
  color:#fff;
  transform:translateX(-3px);
}
.os-project-index-page .os-label{
  display:block;
  margin:0 0 18px;
  font-size:11px;
  line-height:1;
  letter-spacing:.25em;
  text-transform:uppercase;
  font-weight:600;
  color:#b7a06a;
}
.os-project-index-page .os-title{
  margin:0;
  max-width:900px;
  font-size:clamp(58px,8vw,132px);
  font-weight:400;
  line-height:.88;
  letter-spacing:-.075em;
}
.os-project-index-page .os-page-note{
  max-width:580px;
  margin:clamp(24px,3vw,40px) 0 0;
  color:rgba(255,255,255,.72);
  font-size:clamp(15px,1.15vw,20px);
  line-height:1.75;
}
.os-index-reveal{
  animation:osIndexFadeUp .78s cubic-bezier(.2,.7,.2,1) both;
}
.os-index-gallery-section{
  padding:clamp(76px,8vw,122px) clamp(24px,5vw,76px) clamp(92px,10vw,150px);
  background:var(--os-index-inner-bg,#efece4);
}
.os-index-gallery-head{
  max-width:100%;
  margin:0 auto clamp(34px,4.4vw,64px);
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:28px;
}
.os-index-gallery-head h2{
  margin:0;
  font-size:clamp(36px,4.6vw,78px);
  line-height:.95;
  letter-spacing:-.065em;
  font-weight:400;
}
.os-index-filters{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
.os-index-filter-btn{
  appearance:none;
  border:1px solid rgba(18,17,15,.18);
  background:transparent;
  color:#12110f;
  padding:12px 18px;
  border-radius:999px;
  cursor:pointer;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s ease;
}
.os-index-filter-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(18,17,15,.46);
}
.os-index-filter-btn.is-active{
  background:#12110f;
  border-color:#12110f;
  color:#fff;
}
.os-index-empty,
.os-index-no-projects{
  margin:0 0 28px;
  color:var(--os-muted);
  font-size:14px;
  line-height:1.7;
}
.os-index-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,1.85vw,30px);
}
.os-index-card{
  position:relative;
  aspect-ratio:3/4.25;
  min-height:0;
  overflow:hidden;
  background:#d9d4ca;
  color:#fff;
  display:block;
  isolation:isolate;
  transform:translateY(18px);
  opacity:0;
  animation:osIndexFadeUp .72s cubic-bezier(.2,.7,.2,1) both;
  animation-delay:var(--index-stagger,0ms);
}
.os-index-card[hidden]{
  display:none!important;
}
.os-index-card-media,
.os-index-card-media img,
.os-index-card-placeholder{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.os-index-card-media{
  overflow:hidden;
  z-index:1;
}
.os-index-card-media img{
  object-fit:cover;
  transition:transform .72s cubic-bezier(.2,.7,.2,1),filter .35s ease;
}
.os-index-card-placeholder{
  background:
    radial-gradient(circle at 28% 24%,rgba(255,255,255,.24),transparent 26%),
    linear-gradient(135deg,#423c33,#bdb3a1);
}
.os-index-card-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.08) 42%,rgba(0,0,0,.58));
  transition:background .35s ease;
}
.os-index-card-meta{
  position:absolute;
  left:clamp(18px,1.8vw,28px);
  right:clamp(18px,1.8vw,28px);
  bottom:clamp(18px,1.8vw,28px);
  z-index:3;
  transform:translateY(12px);
  transition:transform .38s ease;
}
.os-index-card-meta p{
  margin:0 0 10px;
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
}
.os-index-card-meta h3{
  margin:0;
  max-width:760px;
  font-size:clamp(24px,2.45vw,44px);
  font-weight:400;
  line-height:.98;
  letter-spacing:-.055em;
}
.os-index-card-meta span{
  display:inline-flex;
  margin-top:clamp(16px,1.6vw,24px);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.9);
  opacity:.72;
  transform:translateY(8px);
  transition:opacity .3s ease,transform .3s ease,color .3s ease;
}
.os-index-card:hover .os-index-card-media img{
  transform:scale(1.045);
}
.os-index-card:hover .os-index-card-overlay{
  background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.12) 36%,rgba(0,0,0,.5));
}
.os-index-card:hover .os-index-card-meta{
  transform:translateY(0);
}
.os-index-card:hover .os-index-card-meta span{
  opacity:1;
  transform:translateY(0);
  color:#fff;
}
.os-index-card.is-filtered-in{
  opacity:1;
  transform:translateY(0) scale(1);
  animation:osIndexFadeUp .42s cubic-bezier(.2,.7,.2,1) both;
  animation-delay:var(--index-stagger,0ms);
}
@keyframes osIndexFadeUp{
  from{opacity:0;transform:translateY(22px);}
  to{opacity:1;transform:translateY(0);}
}
@media (max-width:1100px){
  .os-index-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:900px){
  .os-index-frame{
    width:100%;
  }
  .os-project-index-page .os-index-hero{
    min-height:76svh;
  }
  .os-project-index-page .os-index-hero-video-mobile{
    display:block;
  }
  .os-project-index-page .os-index-hide-on-mobile{
    display:none;
  }
  .os-project-index-page .os-index-hero-copy{
    left:22px;
    right:22px;
    bottom:34px;
  }
  .os-project-index-page .os-title{
    font-size:clamp(52px,16vw,86px);
  }
  .os-project-index-page .os-page-note{
    font-size:15px;
    line-height:1.72;
  }
  .os-index-gallery-section{
    padding:62px 18px 88px;
  }
  .os-index-gallery-head{
    display:block;
    margin-bottom:28px;
  }
  .os-index-gallery-head h2{
    font-size:clamp(38px,12vw,68px);
  }
  .os-index-filters{
    justify-content:flex-start;
    margin-top:26px;
    gap:8px;
  }
  .os-index-filter-btn{
    padding:11px 14px;
    font-size:10px;
  }
  .os-index-grid{
    grid-template-columns:1fr;
    gap:18px;
  }
  .os-index-card{
    aspect-ratio:3/4.15;
  }
  .os-index-card-overlay{
    background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.16) 36%,rgba(0,0,0,.62));
  }
  .os-index-card-meta{
    left:20px;
    right:20px;
    bottom:20px;
    transform:none;
  }
  .os-index-card-meta h3{
    font-size:clamp(30px,10vw,54px);
  }
  .os-index-card-meta span{
    opacity:1;
    transform:none;
  }
}
@media (prefers-reduced-motion:reduce){
  .os-index-reveal,
  .os-index-card,
  .os-index-card-media img,
  .os-index-filter-btn,
  .os-index-card-meta,
  .os-index-card-meta span{
    animation:none!important;
    transition:none!important;
    transform:none!important;
  }
  .os-index-card{
    opacity:1!important;
  }
}




/* PHASE 2 REVISION 3: Project Index typography controls and centered hero copy */
.os-project-index-page .os-index-hero-copy{
  left:50%;
  right:auto;
  bottom:clamp(112px,17vh,178px);
  width:min(860px,calc(100% - 56px));
  max-width:860px;
  text-align:center;
  transform:translateX(-50%);
}
.os-project-index-page .os-back{
  justify-content:center;
  margin-left:auto;
  margin-right:auto;
  font-family:var(--os-index-back-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-back-font-weight,600);
  font-size:var(--os-index-back-size,10px);
  color:var(--os-index-back-color,rgba(255,255,255,.72));
}
.os-project-index-page .os-index-hero-label{
  font-family:var(--os-index-label-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-label-font-weight,600);
  font-size:var(--os-index-label-size,11px);
  color:var(--os-index-label-color,#b7a06a);
}
.os-project-index-page .os-title{
  font-family:var(--os-index-title-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-title-font-weight,400);
  font-size:var(--os-index-title-size,clamp(42px,5.8vw,96px));
  color:var(--os-index-title-color,#ffffff);
}
.os-project-index-page .os-page-note{
  margin-left:auto;
  margin-right:auto;
  font-family:var(--os-index-subtitle-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-subtitle-font-weight,400);
  font-size:var(--os-index-subtitle-size,clamp(14px,1vw,18px));
  color:var(--os-index-subtitle-color,rgba(255,255,255,.72));
}
.os-index-gallery-head .os-index-gallery-label{
  font-family:var(--os-index-gallery-label-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-gallery-label-font-weight,600);
  font-size:var(--os-index-gallery-label-size,11px);
  color:var(--os-index-gallery-label-color,#b7a06a);
}
.os-index-gallery-head h2{
  font-family:var(--os-index-gallery-title-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-gallery-title-font-weight,400);
  font-size:var(--os-index-gallery-title-size,clamp(36px,4.6vw,78px));
  color:var(--os-index-gallery-title-color,#12110f);
}
.os-index-filter-btn{
  font-family:var(--os-index-filter-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-filter-font-weight,600);
  font-size:var(--os-index-filter-size,11px);
  color:var(--os-index-filter-color,#12110f);
}
.os-index-filter-btn.is-active{
  color:#fff;
}
.os-index-card-meta p{
  font-family:var(--os-index-card-type-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-card-type-font-weight,600);
  font-size:var(--os-index-card-type-size,10px);
  color:var(--os-index-card-type-color,rgba(255,255,255,.72));
}
.os-index-card-meta h3{
  font-family:var(--os-index-card-title-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-card-title-font-weight,400);
  font-size:var(--os-index-card-title-size,clamp(24px,2.45vw,44px));
  color:var(--os-index-card-title-color,#ffffff);
}
.os-index-card-meta span{
  font-family:var(--os-index-card-view-font-family,Montserrat,Arial,sans-serif);
  font-weight:var(--os-index-card-view-font-weight,600);
  font-size:var(--os-index-card-view-size,10px);
  color:var(--os-index-card-view-color,rgba(255,255,255,.9));
}
@media (max-width:900px){
  .os-project-index-page .os-index-hero-copy{
    width:calc(100% - 44px);
    bottom:clamp(54px,12vh,96px);
  }
  .os-project-index-page .os-title{
    font-size:var(--os-index-title-size,clamp(40px,12vw,72px));
  }
}



/* PHASE 3: Editable About Page */
.os-about-page{
  background:#efece4;
  color:#12110f;
  overflow-x:hidden;
}
.os-about-page .os-label{
  display:block;
  margin:0 0 18px;
  font-size:11px;
  line-height:1;
  letter-spacing:.25em;
  text-transform:uppercase;
  font-weight:600;
  color:#b7a06a;
}
.os-about-hero{
  position:relative;
  min-height:clamp(620px,88svh,920px);
  display:flex;
  align-items:flex-end;
  padding:clamp(120px,13vw,190px) var(--os-pad) clamp(78px,8vw,132px);
  background:#12110f;
  color:#fff;
  overflow:hidden;
  isolation:isolate;
}
.os-about-hero-media{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  background:#171613;
}
.os-about-hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.9) contrast(.96);
  transform:scale(1.01);
}
.os-about-hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.14),rgba(0,0,0,.52)),
    linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.12) 62%);
  z-index:2;
  pointer-events:none;
}
.os-about-hero-art{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 18%,rgba(255,255,255,.18),transparent 25%),
    linear-gradient(135deg,#171613,#7d7363);
}
.os-about-hero-art span{
  position:absolute;
  display:block;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.06);
  backdrop-filter:blur(8px);
}
.os-about-hero-art span:nth-child(1){left:12%;top:18%;width:34%;height:26%;}
.os-about-hero-art span:nth-child(2){right:13%;top:26%;width:36%;height:44%;}
.os-about-hero-art span:nth-child(3){left:20%;bottom:15%;width:42%;height:18%;}
.os-about-hero-copy{
  position:relative;
  z-index:3;
  width:min(980px,100%);
}
.os-about-hero h1{
  margin:0;
  font-size:clamp(58px,8.5vw,150px);
  font-weight:400;
  line-height:.9;
  letter-spacing:-.075em;
}
.os-about-hero p{
  max-width:620px;
  margin:clamp(24px,3vw,42px) 0 0;
  color:rgba(255,255,255,.72);
  font-size:clamp(16px,1.2vw,21px);
  line-height:1.75;
}

.os-about-section{
  padding:clamp(88px,9vw,150px) var(--os-pad);
}
.os-about-space{
  display:grid;
  grid-template-columns:minmax(300px,.9fr) minmax(280px,.7fr);
  gap:clamp(36px,7vw,110px);
  align-items:center;
}
.os-about-space-copy,
.os-about-behind-copy,
.os-about-approach-head{
  max-width:760px;
}
.os-about-lead{
  margin:0 0 28px;
  font-size:clamp(22px,2vw,34px);
  line-height:1.35;
  letter-spacing:-.04em;
  color:#12110f;
}
.os-about-page p:not(.os-about-lead){
  color:#4f4b45;
  line-height:1.82;
  font-size:clamp(15px,1vw,18px);
}
.os-about-keywords{
  display:grid;
  gap:clamp(10px,1.4vw,18px);
}
.os-about-keywords span{
  display:block;
  font-size:clamp(48px,7vw,118px);
  line-height:.86;
  letter-spacing:-.08em;
  color:rgba(18,17,15,.13);
  transform:translateY(16px);
  animation:osAboutFloat 5s ease-in-out infinite alternate;
}
.os-about-keywords span:nth-child(2){
  animation-delay:.5s;
}
.os-about-keywords span:nth-child(3){
  animation-delay:1s;
}

.os-about-logo-divider{
  padding:clamp(54px,6vw,96px) var(--os-pad);
  display:flex;
  justify-content:center;
  align-items:center;
}
.os-about-logo-divider img{
  width:clamp(34px,4vw,58px);
  height:auto;
  max-height:58px;
  object-fit:contain;
  opacity:.72;
}

.os-about-behind{
  display:grid;
  grid-template-columns:minmax(280px,.72fr) minmax(320px,.78fr);
  gap:clamp(34px,6vw,90px);
  align-items:center;
}
.os-about-behind-media{
  min-height:clamp(360px,42vw,620px);
  overflow:hidden;
  background:#d8d1c3;
}
.os-about-behind-media img,
.os-about-image-placeholder{
  width:100%;
  height:100%;
  min-height:inherit;
  display:block;
  object-fit:cover;
}
.os-about-image-placeholder{
  background:
    radial-gradient(circle at 35% 24%,rgba(255,255,255,.34),transparent 28%),
    linear-gradient(135deg,#b7ad9e,#ebe7dd);
}

.os-about-direction{
  background:#12110f;
  color:#fff;
}
.os-about-direction .os-about-lead,
.os-about-direction p{
  color:rgba(255,255,255,.7)!important;
}
.os-about-direction-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  background:rgba(255,255,255,.14);
  margin-top:clamp(28px,4vw,58px);
}
.os-about-direction-grid article{
  background:#12110f;
  padding:clamp(28px,3.3vw,54px);
  min-height:clamp(260px,25vw,380px);
}
.os-about-direction-grid h2{
  margin:0 0 26px;
  font-size:clamp(28px,3vw,54px);
  font-weight:400;
  line-height:1;
  letter-spacing:-.055em;
}
.os-about-direction-grid p{
  margin:0;
  color:rgba(255,255,255,.68)!important;
}

.os-about-philosophy{
  padding:clamp(90px,10vw,170px) var(--os-pad);
  background:#e8e2d6;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(28px,5vw,82px);
}
.os-about-philosophy h2{
  margin:0 0 24px;
  font-size:clamp(34px,4.8vw,86px);
  line-height:.94;
  letter-spacing:-.07em;
  font-weight:400;
}
.os-about-philosophy p{
  max-width:580px;
}

.os-about-explores-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:clamp(30px,4vw,62px);
}
.os-about-explores-grid span{
  display:flex;
  align-items:center;
  min-height:clamp(110px,10vw,160px);
  padding:22px;
  border:1px solid rgba(18,17,15,.12);
  font-size:clamp(15px,1.25vw,21px);
  line-height:1.3;
  letter-spacing:-.025em;
  transition:background .28s ease, transform .28s ease, border-color .28s ease;
}
.os-about-explores-grid span:hover{
  background:#fffaf0;
  border-color:rgba(18,17,15,.28);
  transform:translateY(-3px);
}

.os-about-approach{
  display:grid;
  grid-template-columns:minmax(300px,.68fr) minmax(320px,.92fr);
  gap:clamp(34px,6vw,92px);
  align-items:start;
  background:#f4f1e9;
}
.os-about-steps{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.os-about-steps li{
  display:flex;
  align-items:center;
  gap:18px;
  min-height:76px;
  border-bottom:1px solid rgba(18,17,15,.12);
  font-size:clamp(28px,4vw,72px);
  line-height:1;
  letter-spacing:-.07em;
}
.os-about-steps li span{
  width:42px;
  flex:0 0 42px;
  font-size:11px;
  letter-spacing:.18em;
  color:#b7a06a;
}

.os-about-cta{
  padding:clamp(82px,9vw,150px) var(--os-pad);
  text-align:center;
  background:#12110f;
  color:#fff;
}
.os-about-cta p{
  max-width:780px;
  margin:0 auto 34px;
  font-size:clamp(28px,4.6vw,78px)!important;
  line-height:.98!important;
  letter-spacing:-.07em;
  color:#fff!important;
}
.os-about-cta .os-btn{
  border-color:#fff;
}

.os-about-reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .72s cubic-bezier(.2,.7,.2,1), transform .72s cubic-bezier(.2,.7,.2,1);
}
.os-about-reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}
@keyframes osAboutFloat{
  from{transform:translateY(10px);}
  to{transform:translateY(-4px);}
}

@media (max-width:900px){
  .os-about-hero{
    min-height:74svh;
    padding:110px 22px 58px;
  }
  .os-about-hero h1{
    font-size:clamp(46px,14vw,82px);
  }
  .os-about-section{
    padding:70px 22px;
  }
  .os-about-space,
  .os-about-behind,
  .os-about-approach,
  .os-about-philosophy{
    grid-template-columns:1fr;
  }
  .os-about-keywords span{
    font-size:clamp(46px,15vw,76px);
  }
  .os-about-logo-divider{
    padding:46px 22px;
  }
  .os-about-direction-grid,
  .os-about-explores-grid{
    grid-template-columns:1fr;
  }
  .os-about-direction-grid article{
    min-height:auto;
  }
  .os-about-explores-grid span{
    min-height:84px;
  }
  .os-about-steps li{
    font-size:clamp(34px,12vw,60px);
  }
  .os-about-cta{
    padding:74px 22px;
  }
}
@media (prefers-reduced-motion:reduce){
  .os-about-reveal,
  .os-about-keywords span,
  .os-about-explores-grid span{
    animation:none!important;
    transition:none!important;
    transform:none!important;
  }
  .os-about-reveal{
    opacity:1!important;
  }
}



/* PHASE 3 REVISION: calmer About page aligned with Oak Studio frame system */
.os-about-page{
  background:var(--os-about-outer-bg,#0f0f10)!important;
  color:#12110f;
  overflow-x:hidden;
}
.os-about-frame{
  width:min(1500px,100%);
  margin:0 auto;
  background:var(--os-about-inner-bg,#eee9df);
  min-height:100svh;
}
.os-about-page .os-label{
  color:var(--os-about-accent,#b7a06a)!important;
}
.os-about-hero{
  min-height:clamp(540px,72svh,760px)!important;
  padding:0!important;
  background:var(--os-about-inner-bg,#eee9df)!important;
  display:block!important;
}
.os-about-hero-media{
  inset:0!important;
}
.os-about-hero-media img{
  filter:saturate(.9) contrast(.95)!important;
}
.os-about-hero-media::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.18) 42%,rgba(0,0,0,.46)),
    linear-gradient(90deg,rgba(0,0,0,.38),rgba(0,0,0,.12) 58%,rgba(0,0,0,.08))!important;
}
.os-about-hero-copy{
  position:absolute!important;
  left:50%!important;
  right:auto!important;
  bottom:clamp(70px,13vh,132px)!important;
  width:min(860px,calc(100% - 64px))!important;
  max-width:860px!important;
  text-align:center!important;
  transform:translateX(-50%)!important;
  z-index:3!important;
}
.os-about-hero h1{
  font-size:clamp(42px,5.8vw,96px)!important;
  line-height:.94!important;
  letter-spacing:-.07em!important;
}
.os-about-hero p{
  margin-left:auto!important;
  margin-right:auto!important;
  max-width:620px!important;
  font-size:clamp(14px,1vw,18px)!important;
  color:rgba(255,255,255,.72)!important;
}

.os-about-section{
  padding:clamp(76px,8vw,130px) clamp(24px,5vw,76px)!important;
}
.os-about-space,
.os-about-behind,
.os-about-approach{
  grid-template-columns:minmax(280px,.8fr) minmax(280px,.8fr)!important;
  gap:clamp(34px,6vw,86px)!important;
}
.os-about-lead{
  font-size:clamp(20px,1.65vw,28px)!important;
  line-height:1.42!important;
  letter-spacing:-.035em!important;
  font-weight:400!important;
}
.os-about-page p:not(.os-about-lead){
  font-size:clamp(15px,.92vw,17px)!important;
  line-height:1.82!important;
}
.os-about-keywords{
  align-self:center!important;
  gap:8px!important;
}
.os-about-keywords span{
  font-size:clamp(38px,5.4vw,86px)!important;
  color:rgba(18,17,15,.16)!important;
  animation:none!important;
  transform:none!important;
}

.os-about-logo-divider{
  padding:clamp(44px,5vw,76px) clamp(24px,5vw,76px)!important;
}
.os-about-logo-divider img{
  width:clamp(28px,3vw,42px)!important;
  max-height:42px!important;
  opacity:.68!important;
}

.os-about-behind-media{
  min-height:clamp(320px,36vw,520px)!important;
  border-radius:0!important;
  background:#d8d1c3!important;
}
.os-about-behind-media img,
.os-about-image-placeholder{
  border-radius:0!important;
}

.os-about-direction{
  background:var(--os-about-inner-bg,#eee9df)!important;
  color:#12110f!important;
}
.os-about-direction p{
  color:#4f4b45!important;
}
.os-about-direction-grid{
  background:transparent!important;
  gap:clamp(14px,1.6vw,24px)!important;
}
.os-about-direction-grid article{
  background:rgba(255,255,255,.26)!important;
  border:1px solid rgba(18,17,15,.08)!important;
  padding:clamp(24px,2.7vw,42px)!important;
  min-height:clamp(220px,20vw,310px)!important;
  transition:background .25s ease, border-color .25s ease, transform .25s ease!important;
}
.os-about-direction-grid article:hover{
  background:rgba(255,255,255,.42)!important;
  border-color:rgba(18,17,15,.16)!important;
  transform:translateY(-2px)!important;
}
.os-about-direction-grid h2{
  font-size:clamp(26px,2.55vw,44px)!important;
  letter-spacing:-.055em!important;
}
.os-about-direction-grid p{
  color:#4f4b45!important;
}

.os-about-philosophy{
  background:#e8e2d7!important;
  grid-template-columns:1fr 1fr!important;
  padding:clamp(76px,8vw,130px) clamp(24px,5vw,76px)!important;
}
.os-about-philosophy h2{
  font-size:clamp(32px,4vw,68px)!important;
  letter-spacing:-.065em!important;
}
.os-about-philosophy p{
  color:#4f4b45!important;
}

.os-about-explores-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:clamp(10px,1.2vw,16px)!important;
}
.os-about-explores-grid span{
  min-height:clamp(86px,8vw,120px)!important;
  border:1px solid rgba(18,17,15,.09)!important;
  background:rgba(255,255,255,.22)!important;
  font-size:clamp(14px,1vw,18px)!important;
}
.os-about-explores-grid span:hover{
  background:rgba(255,255,255,.45)!important;
  border-color:rgba(18,17,15,.16)!important;
  transform:translateY(-2px)!important;
}

.os-about-approach{
  background:#f1ede4!important;
}
.os-about-steps li{
  min-height:62px!important;
  border-bottom:1px solid rgba(18,17,15,.1)!important;
  font-size:clamp(26px,3.2vw,54px)!important;
}
.os-about-steps li span{
  color:var(--os-about-accent,#b7a06a)!important;
}

.os-about-cta{
  background:#ded7c9!important;
  color:#12110f!important;
  padding:clamp(72px,8vw,126px) clamp(24px,5vw,76px)!important;
}
.os-about-cta p{
  max-width:760px!important;
  font-size:clamp(28px,4vw,68px)!important;
  color:#12110f!important;
}
.os-about-cta .os-btn{
  border-color:#12110f!important;
  color:#12110f!important;
}

.os-about-reveal{
  opacity:1!important;
  transform:none!important;
  transition:opacity .24s ease!important;
}
.os-about-reveal.is-visible{
  opacity:1!important;
  transform:none!important;
}

@media (max-width:900px){
  .os-about-frame{
    width:100%;
  }
  .os-about-hero{
    min-height:72svh!important;
  }
  .os-about-hero-copy{
    width:calc(100% - 44px)!important;
    bottom:clamp(48px,10vh,88px)!important;
  }
  .os-about-hero h1{
    font-size:clamp(40px,12vw,72px)!important;
  }
  .os-about-section{
    padding:64px 22px!important;
  }
  .os-about-space,
  .os-about-behind,
  .os-about-approach,
  .os-about-philosophy{
    grid-template-columns:1fr!important;
  }
  .os-about-direction-grid,
  .os-about-explores-grid{
    grid-template-columns:1fr!important;
  }
  .os-about-direction-grid article{
    min-height:auto!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .os-about-direction-grid article,
  .os-about-explores-grid span{
    transition:none!important;
    transform:none!important;
  }
}



/* PHASE 3 REVISION 2: About modernization, typography controls, explores grid, timeline */
.os-about-page{
  font-family:var(--os-about-body-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
}
.os-about-page .os-label{
  font-family:var(--os-about-label-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-label-font-weight,600)!important;
  font-size:var(--os-about-label-size,11px)!important;
  color:var(--os-about-label-color,var(--os-about-accent,#b7a06a))!important;
}
.os-about-hero h1{
  font-family:var(--os-about-hero-title-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-hero-title-font-weight,400)!important;
  font-size:var(--os-about-hero-title-size,clamp(42px,5.8vw,96px))!important;
  color:var(--os-about-hero-title-color,#ffffff)!important;
}
.os-about-hero p{
  font-family:var(--os-about-hero-statement-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-hero-statement-font-weight,400)!important;
  font-size:var(--os-about-hero-statement-size,clamp(14px,1vw,18px))!important;
  color:var(--os-about-hero-statement-color,rgba(255,255,255,.72))!important;
}
.os-about-lead{
  font-family:var(--os-about-lead-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-lead-font-weight,400)!important;
  font-size:var(--os-about-lead-size,clamp(20px,1.65vw,28px))!important;
  color:var(--os-about-lead-color,#12110f)!important;
}
.os-about-page p:not(.os-about-lead):not(.os-about-cta p){
  font-family:var(--os-about-body-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-body-font-weight,400)!important;
  font-size:var(--os-about-body-size,clamp(15px,.92vw,17px))!important;
  color:var(--os-about-body-color,#4f4b45)!important;
}
.os-about-keywords span{
  font-family:var(--os-about-keyword-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-keyword-font-weight,400)!important;
  font-size:var(--os-about-keyword-size,clamp(38px,5.4vw,86px))!important;
  color:color-mix(in srgb, var(--os-about-keyword-color,#12110f) 16%, transparent)!important;
}
.os-about-direction-grid h2,
.os-about-philosophy h2{
  font-family:var(--os-about-card-title-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-card-title-font-weight,400)!important;
  font-size:var(--os-about-card-title-size,clamp(26px,2.55vw,44px))!important;
  color:var(--os-about-card-title-color,#12110f)!important;
}
.os-about-direction-grid p,
.os-about-philosophy p{
  font-family:var(--os-about-card-text-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-card-text-font-weight,400)!important;
  font-size:var(--os-about-card-text-size,clamp(15px,.92vw,17px))!important;
  color:var(--os-about-card-text-color,#4f4b45)!important;
}

/* Instagram-like soft square grid */
.os-about-explores-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:clamp(12px,1.25vw,20px)!important;
  align-items:stretch!important;
}
.os-about-explores-grid span{
  aspect-ratio:1/1!important;
  min-height:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  padding:clamp(18px,2vw,32px)!important;
  border:1px solid rgba(18,17,15,.08)!important;
  background:rgba(255,255,255,.24)!important;
  box-shadow:0 20px 50px rgba(18,17,15,.025)!important;
  font-family:var(--os-about-explores-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-explores-font-weight,400)!important;
  font-size:var(--os-about-explores-size,clamp(15px,1.1vw,20px))!important;
  color:var(--os-about-explores-color,#12110f)!important;
  transition:transform .32s cubic-bezier(.2,.7,.2,1), background .32s ease, box-shadow .32s ease, border-color .32s ease!important;
}
.os-about-explores-grid span:hover{
  transform:scale(1.035)!important;
  background:rgba(255,255,255,.56)!important;
  border-color:rgba(18,17,15,.18)!important;
  box-shadow:0 26px 70px rgba(18,17,15,.08)!important;
}

/* Transparent PNG-friendly behind image */
.os-about-behind-media{
  background:transparent!important;
  min-height:clamp(280px,34vw,520px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
}
.os-about-behind-media img{
  width:100%!important;
  height:auto!important;
  max-height:clamp(320px,38vw,580px)!important;
  object-fit:contain!important;
  display:block!important;
}
.os-about-image-placeholder{
  background:transparent!important;
}

/* Optional logo divider */
.os-about-logo-divider{
  display:flex!important;
}
.os-about-logo-divider img{
  width:var(--os-about-logo-size,42px)!important;
  max-height:var(--os-about-logo-size,42px)!important;
}

/* Horizontal timeline */
.os-about-approach{
  display:block!important;
}
.os-about-approach-head{
  max-width:760px!important;
  margin-bottom:clamp(34px,5vw,70px)!important;
}
.os-about-steps{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;
  padding:clamp(26px,3vw,44px) 0 0!important;
  border-top:1px solid rgba(18,17,15,.16)!important;
}
.os-about-steps::before{
  content:""!important;
  position:absolute!important;
  top:-1px!important;
  left:0!important;
  width:100%!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(18,17,15,.24),transparent)!important;
}
.os-about-steps li{
  position:relative!important;
  display:block!important;
  min-height:0!important;
  border:0!important;
  padding:clamp(16px,2vw,28px) clamp(10px,1.3vw,18px) 0 0!important;
  font-family:var(--os-about-steps-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-steps-font-weight,400)!important;
  font-size:var(--os-about-steps-size,clamp(26px,3vw,52px))!important;
  color:var(--os-about-steps-color,#12110f)!important;
  letter-spacing:-.065em!important;
}
.os-about-steps li::before{
  content:""!important;
  position:absolute!important;
  top:-35px!important;
  left:0!important;
  width:11px!important;
  height:11px!important;
  border-radius:999px!important;
  background:var(--os-about-inner-bg,#eee9df)!important;
  border:1px solid var(--os-about-accent,#b7a06a)!important;
  box-shadow:0 0 0 7px color-mix(in srgb, var(--os-about-accent,#b7a06a) 12%, transparent)!important;
}
.os-about-steps li span{
  display:block!important;
  width:auto!important;
  margin:0 0 12px!important;
  font-size:11px!important;
  letter-spacing:.18em!important;
  color:var(--os-about-accent,#b7a06a)!important;
}

/* CTA typography */
.os-about-cta p{
  font-family:var(--os-about-cta-text-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-cta-text-font-weight,400)!important;
  font-size:var(--os-about-cta-text-size,clamp(28px,4vw,68px))!important;
  color:var(--os-about-cta-text-color,#12110f)!important;
}
.os-about-cta .os-btn{
  font-family:var(--os-about-cta-button-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-cta-button-font-weight,600)!important;
  font-size:var(--os-about-cta-button-size,11px)!important;
  color:var(--os-about-cta-button-color,#12110f)!important;
}

@media (max-width:1100px){
  .os-about-explores-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media (max-width:900px){
  .os-about-explores-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .os-about-steps{
    grid-template-columns:1fr!important;
    border-top:0!important;
    padding-top:0!important;
  }
  .os-about-steps::before{
    display:none!important;
  }
  .os-about-steps li{
    padding:20px 0!important;
    border-bottom:1px solid rgba(18,17,15,.1)!important;
    font-size:var(--os-about-steps-size,clamp(32px,11vw,56px))!important;
  }
  .os-about-steps li::before{
    display:none!important;
  }
}
@media (max-width:520px){
  .os-about-explores-grid{
    grid-template-columns:1fr!important;
  }
  .os-about-explores-grid span{
    aspect-ratio:1.8/1!important;
  }
}



/* PHASE 3 REVISION 3: About refinements, editable typography fix, image cards, centered timeline */
.os-about-hero-media::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,calc(var(--os-about-hero-overlay,.42) * .22)),rgba(0,0,0,calc(var(--os-about-hero-overlay,.42) * .44)) 46%,rgba(0,0,0,var(--os-about-hero-overlay,.42))),
    linear-gradient(90deg,rgba(0,0,0,calc(var(--os-about-hero-overlay,.42) * .78)),rgba(0,0,0,calc(var(--os-about-hero-overlay,.42) * .28)) 58%,rgba(0,0,0,calc(var(--os-about-hero-overlay,.42) * .18)))!important;
}
.os-about-page .os-label{color:var(--os-about-label-color,var(--os-about-accent,#b7a06a))!important;}
.os-about-lead{color:var(--os-about-lead-color,#12110f)!important;}
.os-about-page p:not(.os-about-lead):not(.os-about-cta p){color:var(--os-about-body-color,#4f4b45)!important;}
.os-about-direction-grid h2,
.os-about-philosophy h2{
  text-align:center!important;
  color:var(--os-about-card-title-color,#12110f)!important;
}
.os-about-direction-grid p,
.os-about-philosophy p{color:var(--os-about-card-text-color,#4f4b45)!important;}
.os-about-philosophy div{text-align:center!important;}
.os-about-philosophy p{margin-left:auto!important;margin-right:auto!important;}

.os-about-explores-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
.os-about-explores-grid span{
  position:relative!important;
  overflow:hidden!important;
  aspect-ratio:1/1!important;
  min-height:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  isolation:isolate!important;
  background:rgba(255,255,255,.34)!important;
}
.os-about-explores-grid span img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  z-index:1!important;
  opacity:.72!important;
  transform:scale(1.01)!important;
  transition:transform .38s cubic-bezier(.2,.7,.2,1), opacity .38s ease!important;
}
.os-about-explores-grid span::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(245,241,232,.18),rgba(245,241,232,.72))!important;
  z-index:2!important;
  opacity:0!important;
  transition:opacity .32s ease!important;
}
.os-about-explores-grid span.has-image::after{opacity:1!important;}
.os-about-explores-grid span strong{
  position:relative!important;
  z-index:3!important;
  max-width:82%!important;
  font-family:var(--os-about-explores-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif)!important;
  font-weight:var(--os-about-explores-font-weight,400)!important;
  font-size:var(--os-about-explores-size,clamp(15px,1.1vw,20px))!important;
  line-height:1.22!important;
  color:var(--os-about-explores-color,#12110f)!important;
}
.os-about-explores-grid span:hover{transform:scale(1.035)!important;}
.os-about-explores-grid span:hover img{transform:scale(1.07)!important;opacity:.84!important;}

.os-about-approach-head{
  max-width:820px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}
.os-about-approach-head p{margin-left:auto!important;margin-right:auto!important;}
.os-about-steps{text-align:center!important;}
.os-about-steps li{text-align:center!important;padding-right:0!important;}
.os-about-steps li::before{left:50%!important;transform:translateX(-50%)!important;}
.os-about-steps li span{margin-left:auto!important;margin-right:auto!important;}

@media (max-width:900px){
  .os-about-explores-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .os-about-explores-grid span{aspect-ratio:1/1!important;}
  .os-about-steps li{text-align:center!important;padding:24px 0!important;}
  .os-about-steps li span{text-align:center!important;}
}
@media (max-width:520px){
  .os-about-explores-grid{grid-template-columns:1fr 1fr!important;}
  .os-about-explores-grid span{aspect-ratio:1/1!important;}
}



/* PHASE 3 REVISION 4: clean About settings + stronger inline styles support */
.os-about-keywords{
  text-align:center!important;
}
.os-about-keywords span{
  display:block!important;
}
@media (max-width:900px){
  .os-about-keywords{
    text-align:center!important;
    justify-items:center!important;
  }
  .os-about-keywords span{
    font-size:var(--os-about-keyword-size,clamp(54px,17vw,92px))!important;
    text-align:center!important;
  }
  .os-about-explores-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .os-about-explores-grid span{
    aspect-ratio:1/1!important;
  }
}
@media (max-width:520px){
  .os-about-explores-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}



/* PHASE 3 REVISION 5: About keyword desktop alignment + back link */
.os-about-back{
  display:inline-flex!important;
  margin:0 0 clamp(20px,2vw,30px)!important;
  font-size:var(--os-about-back-text-size,10px)!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  color:#fff!important;
  opacity:.78!important;
  transition:opacity .25s ease, transform .25s ease!important;
}
.os-about-back:hover{
  opacity:1!important;
  transform:translateX(-3px)!important;
}
.os-about-keywords{
  text-align:left!important;
  justify-items:start!important;
  align-self:center!important;
}
.os-about-keywords span{
  text-align:left!important;
  color:#cfc7bd!important;
  opacity:.42!important;
}
@media (max-width:900px){
  .os-about-keywords{
    text-align:center!important;
    justify-items:center!important;
    margin-top:clamp(18px,5vw,34px)!important;
  }
  .os-about-keywords span{
    text-align:center!important;
    font-size:var(--os-about-keyword-size,clamp(54px,17vw,92px))!important;
  }
}



/* PHASE 3B: About closeout refinement only */
.os-about-page{
  background:var(--os-about-outer-bg,#0f0f10)!important;
}
.os-about-frame{
  width:min(1600px,100%)!important;
  max-width:1600px!important;
  margin:0 auto!important;
}

/* Hero consistency with stable single project language */
.os-about-hero{
  min-height:clamp(520px,72vh,820px)!important;
  max-height:880px!important;
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.os-about-hero-copy{
  bottom:clamp(86px,13vh,150px)!important;
  width:min(1040px,calc(100% - 72px))!important;
  max-width:1040px!important;
  text-align:center!important;
  z-index:4!important;
}
.os-about-hero h1{
  font-size:var(--os-about-hero-title-size,clamp(34px,4.6vw,86px))!important;
  line-height:.98!important;
  letter-spacing:-.055em!important;
  max-width:980px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.os-about-hero p{
  max-width:680px!important;
  line-height:1.65!important;
}
.os-about-back{
  margin-bottom:clamp(20px,2.3vw,34px)!important;
  font-size:var(--os-about-back-text-size,10px)!important;
  letter-spacing:.18em!important;
  opacity:.78!important;
  transform:translateX(0)!important;
  will-change:transform!important;
}
.os-about-back:hover{
  opacity:1!important;
  transform:translateX(-4px)!important;
}

/* Optional About hero logo: hidden unless enabled and image selected */
.os-about-hero-logo{
  position:absolute!important;
  left:50%!important;
  top:clamp(118px,17vh,210px)!important;
  transform:translateX(-50%)!important;
  z-index:4!important;
  width:var(--os-about-hero-logo-size,96px)!important;
  max-width:min(34vw,240px)!important;
  pointer-events:none!important;
  opacity:.9!important;
}
.os-about-hero-logo img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:calc(var(--os-about-hero-logo-size,96px) * 1.4)!important;
  object-fit:contain!important;
}

/* Safe refined About motion */
.os-about-page .os-about-reveal{
  opacity:0!important;
  transform:translateY(18px)!important;
  transition:
    opacity .72s cubic-bezier(.2,.7,.2,1),
    transform .72s cubic-bezier(.2,.7,.2,1)!important;
}
.os-about-page .os-about-reveal.is-visible{
  opacity:1!important;
  transform:translateY(0)!important;
}
.os-about-page .os-about-hero.os-about-reveal{
  transform:translateY(0)!important;
}
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy,
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-logo{
  opacity:0;
  transform:translate(-50%,12px);
  transition:
    opacity .78s cubic-bezier(.2,.7,.2,1),
    transform .78s cubic-bezier(.2,.7,.2,1);
}
.os-about-page .os-about-hero.os-about-reveal.is-visible .os-about-hero-copy,
.os-about-page .os-about-hero.os-about-reveal.is-visible .os-about-hero-logo{
  opacity:1;
  transform:translate(-50%,0);
}

/* Design Direction: centered and balanced text inside cards */
.os-about-direction-grid article{
  text-align:center!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
}
.os-about-direction-grid h2{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.os-about-direction-grid p{
  text-align:center!important;
  max-width:36em!important;
  margin-left:auto!important;
  margin-right:auto!important;
  line-height:1.75!important;
}

/* Philosophy as quote/statement treatment */
.os-about-philosophy{
  align-items:stretch!important;
}
.os-about-philosophy div{
  position:relative!important;
  text-align:center!important;
  padding:clamp(22px,2.6vw,42px) clamp(18px,2.6vw,38px)!important;
}
.os-about-philosophy h2{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.os-about-philosophy p{
  position:relative!important;
  max-width:34em!important;
  margin:clamp(22px,2.3vw,34px) auto 0!important;
  padding-top:clamp(18px,2vw,28px)!important;
  text-align:center!important;
  font-style:italic!important;
  line-height:1.85!important;
}
.os-about-philosophy p::before{
  content:"“"!important;
  position:absolute!important;
  left:50%!important;
  top:-.38em!important;
  transform:translateX(-50%)!important;
  font-size:clamp(42px,5vw,86px)!important;
  line-height:1!important;
  color:var(--os-about-accent,#b7a06a)!important;
  opacity:.34!important;
  font-style:normal!important;
}
.os-about-philosophy p::after{
  content:""!important;
  position:absolute!important;
  top:0!important;
  left:50%!important;
  width:min(120px,36%)!important;
  height:1px!important;
  transform:translateX(-50%)!important;
  background:rgba(18,17,15,.12)!important;
}

/* Keep keywords desktop quiet-left, mobile centered */
.os-about-keywords{
  text-align:left!important;
  justify-items:start!important;
}
.os-about-keywords span{
  text-align:left!important;
  color:#cfc7bd!important;
  opacity:.42!important;
}

@media (max-width:900px){
  .os-about-frame{
    width:100%!important;
  }
  .os-about-hero{
    min-height:72svh!important;
  }
  .os-about-hero-copy{
    width:calc(100% - 44px)!important;
    bottom:clamp(54px,11vh,94px)!important;
  }
  .os-about-hero h1{
    font-size:var(--os-about-hero-title-size,clamp(40px,12vw,72px))!important;
  }
  .os-about-hero-logo{
    top:clamp(92px,14vh,150px)!important;
    width:min(var(--os-about-hero-logo-size,96px),32vw)!important;
  }
  .os-about-direction-grid article{
    min-height:auto!important;
  }
  .os-about-keywords{
    text-align:center!important;
    justify-items:center!important;
  }
  .os-about-keywords span{
    text-align:center!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .os-about-page .os-about-reveal,
  .os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy,
  .os-about-page .os-about-hero.os-about-reveal .os-about-hero-logo{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
  .os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy,
  .os-about-page .os-about-hero.os-about-reveal .os-about-hero-logo{
    transform:translateX(-50%)!important;
  }
}



/* PHASE 3B LOGO FIX: render About hero logo inside the text stack */
.os-about-hero-copy .os-about-hero-logo{
  position:relative!important;
  left:auto!important;
  top:auto!important;
  z-index:5!important;
  width:var(--os-about-hero-logo-size,96px)!important;
  max-width:min(38vw,240px)!important;
  margin:0 auto clamp(22px,4vh,48px)!important;
  opacity:.92!important;
  transform:none!important;
  pointer-events:none!important;
}
.os-about-hero-copy .os-about-hero-logo img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:calc(var(--os-about-hero-logo-size,96px) * 1.45)!important;
  object-fit:contain!important;
}
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy{
  opacity:0;
  transform:translate(-50%,12px);
  transition:
    opacity .78s cubic-bezier(.2,.7,.2,1),
    transform .78s cubic-bezier(.2,.7,.2,1);
}
.os-about-page .os-about-hero.os-about-reveal.is-visible .os-about-hero-copy{
  opacity:1;
  transform:translate(-50%,0);
}
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy .os-about-hero-logo,
.os-about-page .os-about-hero.os-about-reveal.is-visible .os-about-hero-copy .os-about-hero-logo{
  opacity:.92!important;
  transform:none!important;
}
@media (max-width:900px){
  .os-about-hero-copy .os-about-hero-logo{
    width:min(var(--os-about-hero-logo-size,96px),34vw)!important;
    margin-bottom:clamp(18px,3.4vh,34px)!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy{
    opacity:1!important;
    transform:translateX(-50%)!important;
    transition:none!important;
  }
}



/* PHASE 3B EXPLORES HOVER FIX: prevent image-card hover jitter */
.os-about-explores-grid span{
  transform:none!important;
  will-change:auto!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  contain:paint!important;
}
.os-about-explores-grid span:hover{
  transform:none!important;
  background:rgba(255,255,255,.5)!important;
  border-color:rgba(18,17,15,.18)!important;
  box-shadow:0 22px 58px rgba(18,17,15,.07)!important;
}
.os-about-explores-grid span img{
  pointer-events:none!important;
  will-change:transform, opacity!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  transform:translateZ(0) scale(1.015)!important;
  transform-origin:center center!important;
}
.os-about-explores-grid span:hover img{
  transform:translateZ(0) scale(1.055)!important;
  opacity:.84!important;
}
.os-about-explores-grid span::after,
.os-about-explores-grid span strong{
  pointer-events:none!important;
}
@media (prefers-reduced-motion:reduce){
  .os-about-explores-grid span,
  .os-about-explores-grid span img{
    transition:none!important;
    transform:none!important;
  }
}



/* PHASE 3B SCROLL + LOGO SIZE FIX */
.os-about-page .os-about-reveal{
  opacity:1!important;
  transform:none!important;
  transition:none!important;
}
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy{
  opacity:1!important;
  transform:translate(-50%,0)!important;
  transition:none!important;
}
.os-about-hero-copy .os-about-hero-logo{
  width:var(--os-about-hero-logo-size-desktop,var(--os-about-hero-logo-size,96px))!important;
}
.os-about-hero-copy .os-about-hero-logo img{
  max-height:calc(var(--os-about-hero-logo-size-desktop,var(--os-about-hero-logo-size,96px)) * 1.45)!important;
}
@media (max-width:900px){
  .os-about-hero-copy .os-about-hero-logo{
    width:min(var(--os-about-hero-logo-size-mobile,72px),34vw)!important;
  }
  .os-about-hero-copy .os-about-hero-logo img{
    max-height:calc(var(--os-about-hero-logo-size-mobile,72px) * 1.45)!important;
  }
}



/* PHASE 3B CLOSEOUT MOTION RESTORE: same fast motion feel as About_Closeout */
.os-about-page .os-about-reveal{
  opacity:0!important;
  transform:translateY(18px)!important;
  transition:
    opacity .72s cubic-bezier(.2,.7,.2,1),
    transform .72s cubic-bezier(.2,.7,.2,1)!important;
}
.os-about-page .os-about-reveal.is-visible{
  opacity:1!important;
  transform:translateY(0)!important;
}
.os-about-page .os-about-hero.os-about-reveal{
  transform:translateY(0)!important;
}
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy{
  opacity:0!important;
  transform:translate(-50%,12px)!important;
  transition:
    opacity .78s cubic-bezier(.2,.7,.2,1),
    transform .78s cubic-bezier(.2,.7,.2,1)!important;
}
.os-about-page .os-about-hero.os-about-reveal.is-visible .os-about-hero-copy{
  opacity:1!important;
  transform:translate(-50%,0)!important;
}
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy .os-about-hero-logo,
.os-about-page .os-about-hero.os-about-reveal.is-visible .os-about-hero-copy .os-about-hero-logo{
  opacity:.92!important;
  transform:none!important;
}
@media (prefers-reduced-motion:reduce){
  .os-about-page .os-about-reveal,
  .os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
  .os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy{
    transform:translateX(-50%)!important;
  }
}



/* PHASE 3B LOAD FADE: lightweight About motion on page load only */
.os-about-page .os-about-reveal,
.os-about-page .os-about-hero.os-about-reveal,
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-copy,
.os-about-page .os-about-hero.os-about-reveal .os-about-hero-logo{
  opacity:1!important;
  transform:none!important;
  transition:none!important;
}
.os-about-page .os-about-frame{
  opacity:0;
  transform:translateY(8px);
  transition:
    opacity .55s cubic-bezier(.2,.7,.2,1),
    transform .55s cubic-bezier(.2,.7,.2,1);
}
html.os-about-loaded .os-about-page .os-about-frame{
  opacity:1;
  transform:translateY(0);
}
.os-about-page .os-about-hero-copy{
  transform:translateX(-50%)!important;
}
.os-about-page .os-about-hero-logo{
  transform:none!important;
}
@media (prefers-reduced-motion:reduce){
  .os-about-page .os-about-frame{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}



/* PHASE 4: Project Index closeout refinement only */
.os-project-index-page{
  background:var(--os-index-outer-bg,#0f0f10)!important;
}
.os-index-frame{
  width:min(1600px,100%)!important;
  max-width:1600px!important;
  margin:0 auto!important;
  background:var(--os-index-inner-bg,#efece4)!important;
}

/* Hero consistency */
.os-project-index-page .os-index-hero{
  min-height:clamp(520px,72vh,820px)!important;
  max-height:880px!important;
}
.os-project-index-page .os-index-hero-copy{
  left:50%!important;
  right:auto!important;
  bottom:clamp(86px,13vh,150px)!important;
  width:min(1040px,calc(100% - 72px))!important;
  max-width:1040px!important;
  text-align:center!important;
  transform:translateX(-50%)!important;
  z-index:4!important;
}
.os-project-index-page .os-title{
  font-size:var(--os-index-title-size,clamp(34px,4.6vw,86px))!important;
  line-height:.98!important;
  letter-spacing:-.055em!important;
  max-width:980px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.os-project-index-page .os-page-note{
  max-width:680px!important;
  line-height:1.65!important;
}
.os-project-index-page .os-back{
  margin-left:auto!important;
  margin-right:auto!important;
  margin-bottom:clamp(20px,2.3vw,34px)!important;
  justify-content:center!important;
  font-size:var(--os-index-back-size,10px)!important;
  letter-spacing:.18em!important;
  opacity:.78!important;
  transform:translateX(0)!important;
  will-change:transform!important;
}
.os-project-index-page .os-back:hover{
  opacity:1!important;
  color:#fff!important;
  transform:translateX(-4px)!important;
}

/* Optional Project Index hero logo */
.os-index-hero-logo{
  position:relative!important;
  z-index:5!important;
  width:var(--os-index-hero-logo-size,96px)!important;
  max-width:min(38vw,240px)!important;
  margin:0 auto clamp(22px,4vh,48px)!important;
  opacity:.92!important;
  pointer-events:none!important;
}
.os-index-hero-logo img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:calc(var(--os-index-hero-logo-size,96px) * 1.45)!important;
  object-fit:contain!important;
}

/* Tighter editorial card layout */
.os-index-gallery-section{
  padding:clamp(72px,7.5vw,118px) clamp(18px,4.2vw,64px) clamp(86px,9vw,140px)!important;
}
.os-index-grid{
  gap:clamp(8px,.75vw,14px)!important;
}
.os-index-card{
  aspect-ratio:3/4.25!important;
}
.os-index-card-media img{
  transform:translateZ(0) scale(1.01)!important;
  will-change:transform!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
}
.os-index-card:hover .os-index-card-media img{
  transform:translateZ(0) scale(1.045)!important;
}
.os-index-card-overlay{
  background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.08) 42%,rgba(0,0,0,.54))!important;
}
.os-index-card:hover .os-index-card-overlay{
  background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.14) 36%,rgba(0,0,0,.54))!important;
}
.os-index-card-meta{
  transform:translateY(12px)!important;
}
.os-index-card-meta span{
  opacity:0!important;
  transform:translateY(10px)!important;
}
.os-index-card:hover .os-index-card-meta{
  transform:translateY(0)!important;
}
.os-index-card:hover .os-index-card-meta span{
  opacity:1!important;
  transform:translateY(0)!important;
  color:var(--os-index-card-view-color,#fff)!important;
}

/* Keep filters stable and obvious */
.os-index-filter-btn.is-active{
  background:#12110f!important;
  border-color:#12110f!important;
  color:#fff!important;
}

/* Mobile: visible information without hover */
@media (max-width:1100px){
  .os-index-grid{
    gap:clamp(10px,1.8vw,18px)!important;
  }
}
@media (max-width:900px){
  .os-index-frame{
    width:100%!important;
    max-width:100%!important;
  }
  .os-project-index-page .os-index-hero{
    min-height:72svh!important;
  }
  .os-project-index-page .os-index-hero-copy{
    width:calc(100% - 44px)!important;
    bottom:clamp(54px,11vh,94px)!important;
  }
  .os-project-index-page .os-title{
    font-size:var(--os-index-title-size,clamp(40px,12vw,72px))!important;
  }
  .os-index-hero-logo{
    width:min(var(--os-index-hero-logo-size,96px),34vw)!important;
    margin-bottom:clamp(18px,3.4vh,34px)!important;
  }
  .os-index-gallery-section{
    padding:62px 18px 88px!important;
  }
  .os-index-grid{
    gap:14px!important;
  }
  .os-index-card-meta,
  .os-index-card:hover .os-index-card-meta{
    transform:none!important;
  }
  .os-index-card-meta span,
  .os-index-card:hover .os-index-card-meta span{
    opacity:1!important;
    transform:none!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .os-index-card,
  .os-index-card-media img,
  .os-index-card-meta,
  .os-index-card-meta span,
  .os-project-index-page .os-back{
    animation:none!important;
    transition:none!important;
  }
}



/* PHASE 4 REVISION: Index logo, tighter cards, centered desktop CTA */
.os-index-hero-logo-stack,
.os-project-index-page .os-index-hero-copy .os-index-hero-logo{
  display:block!important;
  position:relative!important;
  left:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  width:var(--os-index-hero-logo-size-desktop,var(--os-index-hero-logo-size,96px))!important;
  max-width:min(38vw,260px)!important;
  margin:0 auto clamp(22px,4vh,48px)!important;
  opacity:.94!important;
  visibility:visible!important;
  pointer-events:none!important;
  transform:none!important;
  z-index:8!important;
}
.os-index-hero-logo-stack img,
.os-project-index-page .os-index-hero-copy .os-index-hero-logo img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:calc(var(--os-index-hero-logo-size-desktop,var(--os-index-hero-logo-size,96px)) * 1.45)!important;
  object-fit:contain!important;
}

/* Cards almost touching: thin visual line only */
.os-index-gallery-section{
  padding-left:clamp(16px,3vw,48px)!important;
  padding-right:clamp(16px,3vw,48px)!important;
}
.os-index-grid{
  gap:1px!important;
  background:rgba(18,17,15,.12)!important;
}
.os-index-card{
  background:#d9d4ca!important;
}

/* Desktop CTA in the exact visual center of the card */
.os-index-card-meta{
  transform:none!important;
}
.os-index-card-meta span{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  bottom:auto!important;
  margin:0!important;
  transform:translate(-50%,-50%)!important;
  opacity:0!important;
  z-index:5!important;
  padding:12px 18px!important;
  border:1px solid rgba(255,255,255,.42)!important;
  border-radius:999px!important;
  background:rgba(0,0,0,.18)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  white-space:nowrap!important;
  color:#fff!important;
}
.os-index-card:hover .os-index-card-meta{
  transform:none!important;
}
.os-index-card:hover .os-index-card-meta span{
  opacity:1!important;
  transform:translate(-50%,-50%)!important;
}
.os-index-card:hover .os-index-card-overlay{
  background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.22) 42%,rgba(0,0,0,.58))!important;
}

/* Mobile keeps CTA below title and always visible */
@media (max-width:900px){
  .os-index-hero-logo-stack,
  .os-project-index-page .os-index-hero-copy .os-index-hero-logo{
    width:min(var(--os-index-hero-logo-size-mobile,72px),34vw)!important;
    margin-bottom:clamp(18px,3.4vh,34px)!important;
  }
  .os-index-hero-logo-stack img,
  .os-project-index-page .os-index-hero-copy .os-index-hero-logo img{
    max-height:calc(var(--os-index-hero-logo-size-mobile,72px) * 1.45)!important;
  }
  .os-index-grid{
    gap:1px!important;
  }
  .os-index-card-meta span,
  .os-index-card:hover .os-index-card-meta span{
    position:static!important;
    display:inline-flex!important;
    left:auto!important;
    top:auto!important;
    margin-top:clamp(16px,1.6vw,24px)!important;
    transform:none!important;
    opacity:1!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    white-space:normal!important;
    color:var(--os-index-card-view-color,#fff)!important;
  }
}



/* PHASE 4 REVISION 2: match About logo output and center text-only CTA */
.os-project-index-page .os-index-hero-copy .os-index-hero-logo{
  display:block!important;
  position:relative!important;
  left:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  width:var(--os-index-hero-logo-size-desktop,var(--os-index-hero-logo-size,96px))!important;
  max-width:min(38vw,260px)!important;
  margin:0 auto clamp(22px,4vh,48px)!important;
  opacity:.94!important;
  visibility:visible!important;
  pointer-events:none!important;
  transform:none!important;
  z-index:8!important;
}
.os-project-index-page .os-index-hero-copy .os-index-hero-logo img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:calc(var(--os-index-hero-logo-size-desktop,var(--os-index-hero-logo-size,96px)) * 1.45)!important;
  object-fit:contain!important;
}

/* Final card spacing: almost a hairline */
.os-index-grid{
  gap:1px!important;
  background:rgba(18,17,15,.13)!important;
}

/* Desktop: View Project is centered text, not a button */
.os-index-card-meta{
  transform:none!important;
  pointer-events:none!important;
}
.os-index-card-meta span{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  bottom:auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  box-shadow:none!important;
  width:auto!important;
  min-width:max-content!important;
  white-space:nowrap!important;
  text-align:center!important;
  font-size:var(--os-index-card-view-size,clamp(22px,2.4vw,44px))!important;
  line-height:1!important;
  letter-spacing:-.035em!important;
  text-transform:uppercase!important;
  color:var(--os-index-card-view-color,#fff)!important;
  opacity:0!important;
  transform:translate(-50%,-50%) scale(.98)!important;
  transition:opacity .28s ease, transform .28s cubic-bezier(.2,.7,.2,1)!important;
  z-index:6!important;
  text-shadow:0 16px 38px rgba(0,0,0,.34)!important;
}
.os-index-card:hover .os-index-card-meta span{
  opacity:1!important;
  transform:translate(-50%,-50%) scale(1)!important;
}
.os-index-card:hover .os-index-card-overlay{
  background:linear-gradient(180deg,rgba(0,0,0,.16),rgba(0,0,0,.28) 45%,rgba(0,0,0,.62))!important;
}

/* Mobile: keep View Project below title and always visible */
@media (max-width:900px){
  .os-project-index-page .os-index-hero-copy .os-index-hero-logo{
    width:min(var(--os-index-hero-logo-size-mobile,72px),34vw)!important;
    margin-bottom:clamp(18px,3.4vh,34px)!important;
  }
  .os-project-index-page .os-index-hero-copy .os-index-hero-logo img{
    max-height:calc(var(--os-index-hero-logo-size-mobile,72px) * 1.45)!important;
  }
  .os-index-card-meta{
    pointer-events:none!important;
  }
  .os-index-card-meta span,
  .os-index-card:hover .os-index-card-meta span{
    position:static!important;
    display:inline-flex!important;
    left:auto!important;
    top:auto!important;
    margin-top:clamp(16px,1.6vw,24px)!important;
    transform:none!important;
    opacity:1!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    box-shadow:none!important;
    min-width:0!important;
    width:auto!important;
    white-space:normal!important;
    text-align:left!important;
    font-size:var(--os-index-card-view-size,10px)!important;
    letter-spacing:.18em!important;
    line-height:1!important;
    color:var(--os-index-card-view-color,#fff)!important;
    text-shadow:none!important;
  }
}



/* PHASE 4 REVISION 3: exact card-center CTA and no filter ghost gaps */
.os-index-card[hidden],
.os-index-card.is-filtered-out,
.os-index-card:not(.is-filtered-in).os-filtered-state{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Keep project info at the bottom as before */
.os-index-card-meta{
  position:absolute!important;
  left:clamp(18px,1.8vw,28px)!important;
  right:clamp(18px,1.8vw,28px)!important;
  bottom:clamp(18px,1.8vw,28px)!important;
  z-index:4!important;
  transform:none!important;
  pointer-events:none!important;
}

/* Mobile/default CTA inside meta, hidden on desktop */
.os-index-card-view-mobile{
  display:none!important;
}

/* Desktop centered CTA: direct child of the card, centered against full card */
.os-index-card-view-center{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  z-index:6!important;
  display:block!important;
  width:max-content!important;
  max-width:calc(100% - 56px)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  transform:translate(-50%,-50%) scale(.98)!important;
  opacity:0!important;
  pointer-events:none!important;
  text-align:center!important;
  white-space:nowrap!important;
  font-family:var(--os-index-card-view-font-family,Montserrat,Arial,sans-serif)!important;
  font-weight:var(--os-index-card-view-font-weight,400)!important;
  font-size:clamp(26px,3vw,56px)!important;
  line-height:.95!important;
  letter-spacing:-.045em!important;
  text-transform:uppercase!important;
  color:var(--os-index-card-view-color,#fff)!important;
  text-shadow:0 16px 44px rgba(0,0,0,.38)!important;
  transition:opacity .28s ease, transform .28s cubic-bezier(.2,.7,.2,1)!important;
}
.os-index-card:hover .os-index-card-view-center{
  opacity:1!important;
  transform:translate(-50%,-50%) scale(1)!important;
}
.os-index-card:hover .os-index-card-overlay{
  background:linear-gradient(180deg,rgba(0,0,0,.16),rgba(0,0,0,.28) 45%,rgba(0,0,0,.62))!important;
}

/* Cancel older desktop styling that targeted every span inside meta */
.os-index-card-meta span:not(.os-index-card-view-mobile){
  display:none!important;
}

/* Mobile: center CTA hidden; mobile CTA returns below title and visible */
@media (max-width:900px){
  .os-index-card-view-center{
    display:none!important;
  }
  .os-index-card-view-mobile,
  .os-index-card:hover .os-index-card-view-mobile{
    position:static!important;
    display:inline-flex!important;
    left:auto!important;
    top:auto!important;
    margin-top:clamp(16px,1.6vw,24px)!important;
    transform:none!important;
    opacity:1!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    min-width:0!important;
    width:auto!important;
    white-space:normal!important;
    text-align:left!important;
    font-family:var(--os-index-card-view-font-family,Montserrat,Arial,sans-serif)!important;
    font-weight:var(--os-index-card-view-font-weight,600)!important;
    font-size:var(--os-index-card-view-size,10px)!important;
    letter-spacing:.18em!important;
    line-height:1!important;
    text-transform:uppercase!important;
    color:var(--os-index-card-view-color,#fff)!important;
    text-shadow:none!important;
  }
}



/* PHASE 4 REVISION 4: smaller centered CTA and inner-bg grid gaps */
.os-index-grid{
  background:var(--os-index-inner-bg,#efece4)!important;
}
.os-index-card-view-center{
  font-size:clamp(18px,1.75vw,34px)!important;
}
@media (max-width:900px){
  .os-index-card-view-mobile,
  .os-index-card:hover .os-index-card-view-mobile{
    font-size:var(--os-index-card-view-size,10px)!important;
  }
}



/* PHASE 4 REVISION 5: filter buttons should not create jumpy focus/scroll behavior */
.os-index-filter-btn{
  scroll-margin-top:0!important;
}



/* PHASE 4 REVISION 6: prevent Project Index filter scroll jump */
.os-project-index-page,
.os-project-index-page .os-index-frame,
.os-project-index-page .os-index-gallery-section,
.os-project-index-page .os-index-grid{
  overflow-anchor:none!important;
}
.os-project-index-page.os-index-filtering .os-index-card,
.os-project-index-page.os-index-filtering .os-index-card.is-filtered-in{
  animation:none!important;
  transition:none!important;
}
.os-index-card[hidden],
.os-index-card.is-filtered-out{
  display:none!important;
}



/* PHASE 4 REVISION 7: smoother filtering without repeated scroll restore */
.os-project-index-page,
.os-project-index-page .os-index-frame,
.os-project-index-page .os-index-gallery-section,
.os-project-index-page .os-index-grid{
  overflow-anchor:none!important;
}
.os-project-index-page.os-index-filtering .os-index-card,
.os-project-index-page.os-index-filtering .os-index-card.is-filtered-in{
  animation:osIndexFadeUp .42s cubic-bezier(.2,.7,.2,1) both!important;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), opacity .28s ease!important;
}
.os-index-card.is-filtered-in{
  animation:osIndexFadeUp .42s cubic-bezier(.2,.7,.2,1) both!important;
}
.os-index-card[hidden],
.os-index-card.is-filtered-out{
  display:none!important;
}



/* PHASE 5: Header logic and inner content alignment only */
.os-site-header{
  width:100%!important;
  padding:0!important;
  justify-content:center!important;
}
.os-site-header-inner{
  width:min(1600px,100%)!important;
  height:100%!important;
  margin:0 auto!important;
  padding:0 clamp(12px,2vw,28px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:clamp(18px,4vw,54px)!important;
  pointer-events:none!important;
}
.os-site-header .os-logo,
.os-site-header .os-nav{
  pointer-events:auto!important;
}
.os-site-header .os-logo{
  font-weight:600!important;
  font-size:12px!important;
  letter-spacing:.18em!important;
}
.os-site-header .os-nav{
  font-size:clamp(11px,.72vw,12px)!important;
  font-weight:500!important;
  letter-spacing:.15em!important;
  gap:clamp(18px,2.1vw,36px)!important;
  flex-wrap:nowrap!important;
  white-space:nowrap!important;
}
.os-site-header .os-nav a{
  font-weight:500!important;
  opacity:.92!important;
  transition:opacity .25s ease, transform .25s ease!important;
}
.os-site-header .os-nav a:hover{
  opacity:1!important;
  transform:translateY(-1px)!important;
}
@media (max-width:900px){
  .os-site-header-inner{
    padding:0 clamp(14px,4vw,22px)!important;
    gap:14px!important;
  }
  .os-site-header .os-logo{
    font-size:11px!important;
    letter-spacing:.15em!important;
  }
  .os-site-header .os-nav{
    gap:clamp(10px,3.2vw,16px)!important;
    font-size:10px!important;
    letter-spacing:.12em!important;
  }
}
@media (max-width:390px){
  .os-site-header .os-logo{
    font-size:10px!important;
    letter-spacing:.13em!important;
  }
  .os-site-header .os-nav{
    gap:10px!important;
    font-size:9.5px!important;
    letter-spacing:.105em!important;
  }
}



/* PHASE 5 REVISION: Footer content alignment + About hero header tone support */
.os-footer{
  padding:28px 0!important;
}
.os-footer-inner{
  width:min(1600px,100%)!important;
  max-width:1600px!important;
  margin:0 auto!important;
  padding:0 clamp(12px,2vw,28px)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:20px!important;
}
.os-footer-copy{
  justify-self:start!important;
  text-align:left!important;
}
.os-footer-socials{
  justify-self:center!important;
}
.os-footer-meta{
  justify-self:end!important;
  text-align:right!important;
}
@media (max-width:760px){
  .os-footer{
    padding:24px 0!important;
  }
  .os-footer-inner{
    padding:0 clamp(14px,4vw,22px)!important;
    grid-template-columns:1fr!important;
    justify-items:center!important;
    text-align:center!important;
    gap:14px!important;
  }
  .os-footer-copy,
  .os-footer-meta,
  .os-footer-socials{
    justify-self:center!important;
    text-align:center!important;
  }
}



/* PHASE 6A: Home layout and content alignment only
   Keep Home full-bleed. Align text/content frames only.
   Do not create Home inner/outer backgrounds and do not constrain hero/media backgrounds. */
.os-home-page{
  --os-home-frame:1600px;
  --os-home-inline-pad:clamp(12px,2vw,28px);
  overflow-x:hidden;
}

/* Hero media remains full-bleed; only the text grid is aligned to the site frame. */
.os-home-page .os-hero-grid{
  left:50%!important;
  right:auto!important;
  width:min(var(--os-home-frame),100%)!important;
  max-width:var(--os-home-frame)!important;
  margin:0!important;
  padding-left:var(--os-home-inline-pad)!important;
  padding-right:var(--os-home-inline-pad)!important;
  transform:translateX(-50%)!important;
  box-sizing:border-box!important;
}

/* Home section backgrounds stay full width; only inner content receives the shared frame. */
.os-home-page .os-section{
  padding-left:0!important;
  padding-right:0!important;
}
.os-home-page .os-section-inner{
  width:min(var(--os-home-frame),100%)!important;
  max-width:var(--os-home-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-home-inline-pad)!important;
  padding-right:var(--os-home-inline-pad)!important;
  box-sizing:border-box!important;
}

/* Selected Works: align the head and slider shell, while keeping the horizontal slider behavior intact. */
.os-home-page .os-projects-head{
  width:min(var(--os-home-frame),100%)!important;
  max-width:var(--os-home-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-home-inline-pad)!important;
  padding-right:var(--os-home-inline-pad)!important;
  box-sizing:border-box!important;
}
.os-home-page .os-slider-wrap{
  width:min(var(--os-home-frame),100%)!important;
  max-width:var(--os-home-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-home-inline-pad)!important;
  padding-right:var(--os-home-inline-pad)!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
.os-home-page .os-project-slider{
  width:100%!important;
}

/* Small spacing polish only, no copy or logic changes. */
.os-home-page .os-intro-grid,
.os-home-page .os-motion-grid,
.os-home-page .os-contact-grid{
  column-gap:clamp(38px,6vw,118px)!important;
}
.os-home-page .os-projects-head{
  margin-bottom:clamp(30px,3.5vw,50px)!important;
}
.os-home-page .os-motion-copy,
.os-home-page .os-contact-grid > div:first-child,
.os-home-page .os-intro-right{
  max-width:720px!important;
}

@media (max-width:900px){
  .os-home-page{
    --os-home-inline-pad:clamp(18px,5vw,22px);
  }
  .os-home-page .os-hero-grid{
    width:100%!important;
    max-width:100%!important;
    left:50%!important;
    right:auto!important;
    padding-left:var(--os-home-inline-pad)!important;
    padding-right:var(--os-home-inline-pad)!important;
  }
  .os-home-page .os-section-inner,
  .os-home-page .os-projects-head,
  .os-home-page .os-slider-wrap{
    width:100%!important;
    max-width:100%!important;
    padding-left:var(--os-home-inline-pad)!important;
    padding-right:var(--os-home-inline-pad)!important;
  }
  .os-home-page .os-intro-grid,
  .os-home-page .os-motion-grid,
  .os-home-page .os-contact-grid{
    column-gap:0!important;
  }
  .os-home-page .os-slider-wrap{
    max-width:100%!important;
  }
  .os-home-page .os-project-card{
    flex-basis:72vw;
  }
  .os-home-page .os-project-card:hover{
    flex-basis:78vw;
  }
}

@media (max-width:520px){
  .os-home-page{
    --os-home-inline-pad:18px;
  }
  .os-home-page .os-slider-wrap{
    padding-left:18px!important;
    padding-right:18px!important;
  }
}



/* PHASE 6A REVISION: mobile home text centering only */
@media (max-width:900px){
  .os-home-page .os-intro-left,
  .os-home-page .os-intro-right,
  .os-home-page .os-projects-head,
  .os-home-page .os-projects-head > div,
  .os-home-page .os-projects-note,
  .os-home-page .os-motion-copy,
  .os-home-page .os-contact-grid > div:first-child{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .os-home-page .os-intro-left .os-label,
  .os-home-page .os-projects .os-label,
  .os-home-page .os-motion .os-label,
  .os-home-page .os-contact .os-label{
    display:block!important;
    text-align:center!important;
  }

  .os-home-page .os-intro .os-title,
  .os-home-page .os-intro .os-text,
  .os-home-page .os-projects .os-title,
  .os-home-page .os-projects-note,
  .os-home-page .os-motion .os-title,
  .os-home-page .os-motion .os-text,
  .os-home-page .os-contact .os-title,
  .os-home-page .os-contact .os-text{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .os-home-page .os-intro-right,
  .os-home-page .os-motion-copy,
  .os-home-page .os-contact-grid > div:first-child{
    max-width:720px!important;
  }

  .os-home-page .os-intro-tags{
    display:flex!important;
    grid-template-columns:none!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(14px,4.2vw,28px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    width:100%!important;
  }

  .os-home-page .os-intro-tags span{
    white-space:nowrap!important;
    text-align:center!important;
    font-size:clamp(9px,2.4vw,10px)!important;
  }
}

@media (max-width:380px){
  .os-home-page .os-intro-tags{
    gap:10px!important;
  }
  .os-home-page .os-intro-tags span{
    font-size:8.5px!important;
    letter-spacing:.14em!important;
  }
}


/* Phase 6A mobile centering follow-up: center hero bottom labels on mobile */
@media (max-width: 767px){
  .os-home-page .os-hero-bottom-item:last-child{
    justify-content:center!important;
  }

  .os-home-page .os-hero-tags{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
    max-width:100%!important;
  }
}


/* Phase 6A follow-up: keep Home header link weight consistent with inner pages */
body.home .os-site-header .os-nav a,
body.home .os-site-header .os-logo,
body.front-page .os-site-header .os-nav a,
body.front-page .os-site-header .os-logo,
.os-home-page ~ .os-site-header .os-nav a{
  font-weight:600!important;
}

body.home .os-site-header .os-nav,
body.front-page .os-site-header .os-nav{
  font-weight:600!important;
}



/* Phase 6A follow-up: Home Motion cinematic layout + centered intro tags */
.os-home-page .os-intro-tags{
  display:flex!important;
  grid-template-columns:none!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:clamp(18px,2.8vw,44px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  width:100%!important;
  text-align:center!important;
}

.os-home-page .os-intro-tags span{
  text-align:center!important;
}

.os-home-page .os-motion-grid{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:clamp(34px,4.5vw,72px)!important;
  align-items:center!important;
}

.os-home-page .os-motion-copy{
  order:1!important;
  width:min(920px,100%)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}

.os-home-page .os-motion-copy .os-label,
.os-home-page .os-motion-copy .os-title,
.os-home-page .os-motion-copy .os-text{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

.os-home-page .os-motion-copy .os-text{
  max-width:760px!important;
}

.os-home-page .os-motion-media{
  order:2!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  aspect-ratio:2.35 / 1!important;
  max-height:clamp(300px,42vw,560px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  overflow:hidden!important;
}

.os-home-page .os-motion-media video,
.os-home-page .os-motion-media img,
.os-home-page .os-motion-placeholder{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  object-fit:cover!important;
  display:block!important;
}

@media (max-width:767px){
  .os-home-page .os-intro-tags{
    gap:clamp(14px,4.2vw,28px)!important;
  }

  .os-home-page .os-motion-grid{
    gap:clamp(24px,8vw,42px)!important;
  }

  .os-home-page .os-motion-media{
    aspect-ratio:16 / 9!important;
    max-height:none!important;
  }
}

@media (max-width:380px){
  .os-home-page .os-intro-tags{
    gap:10px!important;
  }
}



/* Phase 6A follow-up: Motion media true 21:9 cinematic ratio */
.os-home-page .os-motion-media{
  aspect-ratio:21 / 9!important;
}



/* Phase 6B Revision: copy-fit polish for approved Home text */
.os-home-page .os-intro-grid{
  align-items:center!important;
  gap:clamp(58px,7vw,132px)!important;
}

.os-home-page .os-intro-left,
.os-home-page .os-intro-right{
  min-width:0!important;
}

.os-home-page .os-intro .os-title{
  max-width:760px!important;
  font-size:var(--os-intro-title-size,clamp(60px,6.1vw,118px))!important;
  line-height:.96!important;
}

.os-home-page .os-intro-right{
  align-self:center!important;
}

.os-home-page .os-intro .os-text{
  max-width:720px!important;
}

.os-home-page .os-intro-tags{
  justify-content:center!important;
  text-align:center!important;
}

.os-home-page .os-contact-grid{
  grid-template-columns:minmax(0,.88fr) minmax(360px,1fr)!important;
  gap:clamp(54px,7.2vw,132px)!important;
  align-items:start!important;
}

.os-home-page .os-contact-grid > *{
  min-width:0!important;
}

.os-home-page .os-contact .os-title{
  max-width:760px!important;
  font-size:var(--os-contact-title-size,clamp(56px,7vw,128px))!important;
  line-height:.86!important;
  letter-spacing:-.065em!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}

.os-home-page .os-form{
  position:relative!important;
  z-index:2!important;
  min-width:0!important;
}

@media (max-width:900px){
  .os-home-page .os-intro-grid,
  .os-home-page .os-contact-grid{
    grid-template-columns:1fr!important;
    gap:clamp(28px,8vw,54px)!important;
  }

  .os-home-page .os-intro .os-title,
  .os-home-page .os-contact .os-title{
    max-width:100%!important;
  }

  .os-home-page .os-contact .os-title{
    font-size:var(--os-contact-title-size,clamp(48px,14vw,86px))!important;
  }
}

/* Footer editable text safety */
.os-footer-copy,
.os-footer-meta{
  min-width:0!important;
  overflow-wrap:normal!important;
}



/* Phase 6B Revision 2: restore footer visual structure + fix Contact title overlap */
.os-footer{
  background:var(--os-bg)!important;
  color:#11110f!important;
  border-top:1px solid rgba(17,17,15,.18)!important;
  padding:28px var(--os-pad)!important;
}
.os-footer-inner{
  max-width:var(--os-max)!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
  font-size:10px!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  color:rgba(17,17,15,.58)!important;
}
.os-footer-socials{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
}
.os-social-link{
  width:32px!important;
  height:32px!important;
  border:1px solid rgba(17,17,15,.22)!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  color:#11110f!important;
  opacity:.72!important;
}
.os-social-link svg{
  width:16px!important;
  height:16px!important;
  fill:currentColor!important;
}
.os-social-link.is-disabled{
  opacity:.18!important;
}

.os-home-page .os-contact-grid{
  grid-template-columns:minmax(0,.82fr) minmax(430px,1fr)!important;
  gap:clamp(72px,8vw,170px)!important;
  align-items:start!important;
}
.os-home-page .os-contact-grid > div:first-child{
  min-width:0!important;
  max-width:720px!important;
}
.os-home-page .os-contact .os-title{
  font-size:clamp(52px,4.8vw,96px)!important;
  line-height:.86!important;
  letter-spacing:-.062em!important;
  max-width:700px!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.os-home-page .os-contact .os-text{
  max-width:520px!important;
}
.os-home-page .os-form{
  min-width:0!important;
  max-width:100%!important;
  position:relative!important;
  z-index:3!important;
}

@media (max-width:1100px){
  .os-home-page .os-contact-grid{
    grid-template-columns:1fr!important;
    gap:clamp(32px,8vw,58px)!important;
  }
  .os-home-page .os-contact-grid > div:first-child,
  .os-home-page .os-contact .os-title,
  .os-home-page .os-contact .os-text{
    max-width:100%!important;
  }
  .os-home-page .os-contact .os-title{
    font-size:var(--os-contact-title-size,clamp(48px,14vw,86px))!important;
  }
}



/* Phase 6B Revision 3: smaller Contact title + cleaner mobile footer stack */
.os-home-page .os-contact .os-title{
  font-size:clamp(42px,3.85vw,77px)!important;
  line-height:.88!important;
  max-width:620px!important;
}

@media (max-width:1100px){
  .os-home-page .os-contact .os-title{
    font-size:clamp(38px,11.2vw,69px)!important;
    max-width:100%!important;
    line-height:.9!important;
  }
}

@media (max-width:767px){
  .os-home-page .os-contact .os-title{
    font-size:clamp(34px,10.2vw,58px)!important;
    line-height:.92!important;
    letter-spacing:-.055em!important;
    max-width:92vw!important;
    margin-left:auto!important;
    margin-right:auto!important;
    text-align:center!important;
  }

  .os-footer{
    padding:30px 22px!important;
  }

  .os-footer-inner{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:16px!important;
    text-align:center!important;
  }

  .os-footer-copy,
  .os-footer-meta{
    width:100%!important;
    max-width:300px!important;
    margin:0 auto!important;
    text-align:center!important;
    line-height:1.75!important;
    letter-spacing:.14em!important;
  }

  .os-footer-socials{
    order:2!important;
    margin:0 auto!important;
    justify-content:center!important;
  }

  .os-footer-copy{
    order:1!important;
  }

  .os-footer-meta{
    order:3!important;
  }
}



/* Small Revision: Single Project Back to Projects above title */
.os-single-hero-inner .os-back.os-back-light{
  display:inline-flex!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 0 clamp(18px,2.2vw,32px)!important;
  color:rgba(255,255,255,.76)!important;
  opacity:.82!important;
  transform:translateX(0)!important;
  transition:color .25s ease, opacity .25s ease, transform .25s ease!important;
  will-change:transform!important;
}

.os-single-hero-inner .os-back.os-back-light:hover{
  color:#fff!important;
  opacity:1!important;
  transform:translateX(-4px)!important;
}

.os-single-hero-inner .os-back.os-back-light + h1{
  margin-top:0!important;
}

@media (max-width:900px){
  .os-single-hero-inner .os-back.os-back-light{
    margin-bottom:clamp(16px,5vw,24px)!important;
  }
}



/* Small Revision follow-up: put Single Project Back link on its own line */
.os-single-hero-inner{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
}

.os-single-hero-inner > span{
  display:block!important;
  width:100%!important;
  text-align:center!important;
  margin-bottom:clamp(12px,1.3vw,18px)!important;
}

.os-single-hero-inner .os-back-link{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 auto clamp(18px,2.2vw,32px)!important;
  color:rgba(255,255,255,.76)!important;
  transform:translateX(0)!important;
  transition:color .25s ease, opacity .25s ease, transform .25s ease!important;
  will-change:transform!important;
}

.os-single-hero-inner .os-back-link:hover{
  color:#fff!important;
  opacity:1!important;
  transform:translateX(-4px)!important;
}

.os-single-hero-inner .os-back-link + h1{
  margin-top:0!important;
}

@media (max-width:900px){
  .os-single-hero-inner > span{
    margin-bottom:12px!important;
  }
  .os-single-hero-inner .os-back-link{
    margin-bottom:clamp(16px,5vw,24px)!important;
  }
}



/* Small Revision follow-up 2: Single Project Back order like Project Index */
.os-single-hero-inner{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
}

.os-single-hero-inner .os-back.os-back-light{
  order:1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 auto clamp(22px,2.6vw,38px)!important;
  color:rgba(255,255,255,.78)!important;
  transform:translateX(0)!important;
  transition:color .25s ease, opacity .25s ease, transform .25s ease!important;
  will-change:transform!important;
}

.os-single-hero-inner .os-back.os-back-light:hover{
  color:#fff!important;
  opacity:1!important;
  transform:translateX(-4px)!important;
}

.os-single-hero-inner > .os-single-label{
  order:2!important;
  display:block!important;
  width:100%!important;
  text-align:center!important;
  margin:0 0 clamp(18px,2vw,28px)!important;
}

.os-single-hero-inner > h1{
  order:3!important;
  margin-top:0!important;
}

@media (max-width:900px){
  .os-single-hero-inner .os-back.os-back-light{
    margin-bottom:clamp(18px,5vw,28px)!important;
  }
  .os-single-hero-inner > .os-single-label{
    margin-bottom:clamp(14px,4vw,22px)!important;
  }
}

/* Phase 7 Patterns V2 — Image cells revision */
.os-project-block-layout .oak-v2-section,
.editor-styles-wrapper .oak-v2-section{
  width:min(1280px,100%)!important;
  max-width:1280px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  color:#12110f;
}

.os-project-block-layout .oak-v2-section p,
.os-project-block-layout .oak-v2-section h2,
.os-project-block-layout .oak-v2-section h3,
.editor-styles-wrapper .oak-v2-section p,
.editor-styles-wrapper .oak-v2-section h2,
.editor-styles-wrapper .oak-v2-section h3{
  margin-top:0!important;
}

.os-project-block-layout .oak-v2-eyebrow,
.editor-styles-wrapper .oak-v2-eyebrow{
  margin:0 0 clamp(12px,1.2vw,18px);
  font-size:clamp(10px,.72vw,12px);
  line-height:1.2;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#a98f58;
  font-weight:600;
}

.os-project-block-layout .oak-v2-muted-text,
.os-project-block-layout .oak-v2-large-copy,
.os-project-block-layout .oak-v2-fact-value,
.editor-styles-wrapper .oak-v2-muted-text,
.editor-styles-wrapper .oak-v2-large-copy,
.editor-styles-wrapper .oak-v2-fact-value{
  color:rgba(18,17,15,.72);
}

.os-project-block-layout .oak-v2-large-copy,
.editor-styles-wrapper .oak-v2-large-copy{
  font-size:clamp(17px,1.35vw,24px);
  line-height:1.72;
  max-width:820px!important;
}

.os-project-block-layout .oak-v2-statement,
.editor-styles-wrapper .oak-v2-statement{
  padding-block:clamp(18px,3vw,42px)!important;
}

.os-project-block-layout .oak-v2-statement-text,
.os-project-block-layout .oak-v2-quote-text,
.editor-styles-wrapper .oak-v2-statement-text,
.editor-styles-wrapper .oak-v2-quote-text{
  max-width:1120px!important;
  margin:0 auto;
  font-size:clamp(34px,4.6vw,86px);
  line-height:1.02;
  letter-spacing:-.055em;
  text-align:center;
  color:#12110f;
}

.os-project-block-layout .oak-v2-brief-response,
.editor-styles-wrapper .oak-v2-brief-response,
.os-project-block-layout .oak-v2-key-plan,
.editor-styles-wrapper .oak-v2-key-plan{
  align-items:flex-start!important;
  gap:clamp(28px,5vw,96px)!important;
}

.os-project-block-layout .oak-v2-project-facts,
.editor-styles-wrapper .oak-v2-project-facts{
  gap:0!important;
  border-top:1px solid rgba(18,17,15,.13)!important;
  border-bottom:1px solid rgba(18,17,15,.13)!important;
  align-items:stretch!important;
}

.os-project-block-layout .oak-v2-fact,
.editor-styles-wrapper .oak-v2-fact{
  padding:clamp(18px,2.2vw,34px) clamp(12px,1.8vw,28px)!important;
  border-right:1px solid rgba(18,17,15,.13)!important;
  min-width:0!important;
  height:100%!important;
}

.os-project-block-layout .oak-v2-project-facts > .wp-block-column:last-child .oak-v2-fact,
.editor-styles-wrapper .oak-v2-project-facts > .wp-block-column:last-child .oak-v2-fact{
  border-right:0!important;
}

.os-project-block-layout .oak-v2-fact-value,
.editor-styles-wrapper .oak-v2-fact-value{
  font-size:clamp(14px,1vw,18px);
  line-height:1.45;
  margin:0;
}

.os-project-block-layout .oak-v2-design-highlights,
.editor-styles-wrapper .oak-v2-design-highlights,
.os-project-block-layout .oak-v2-detail-study-cards,
.editor-styles-wrapper .oak-v2-detail-study-cards,
.os-project-block-layout .oak-v2-material-palette,
.editor-styles-wrapper .oak-v2-material-palette{
  align-items:flex-start!important;
  gap:clamp(16px,2vw,32px)!important;
}

.os-project-block-layout .oak-v2-highlight,
.editor-styles-wrapper .oak-v2-highlight{
  padding-top:clamp(18px,2vw,30px)!important;
  border-top:1px solid rgba(18,17,15,.13)!important;
}

.os-project-block-layout .oak-v2-small-title,
.editor-styles-wrapper .oak-v2-small-title{
  font-size:clamp(20px,1.45vw,30px);
  line-height:1.08;
  letter-spacing:-.035em;
  font-weight:500;
  margin:0 0 clamp(12px,1.4vw,20px);
}

.os-project-block-layout .oak-v2-muted-text,
.editor-styles-wrapper .oak-v2-muted-text{
  font-size:clamp(14px,1vw,17px);
  line-height:1.75;
  margin:0;
}

/* Replaceable decorative V2 images */
.os-project-block-layout .oak-v2-no-lightbox,
.editor-styles-wrapper .oak-v2-no-lightbox{
  pointer-events:none!important;
}

.editor-styles-wrapper .oak-v2-no-lightbox{
  pointer-events:auto!important;
}

.os-project-block-layout .oak-v2-no-lightbox img{
  cursor:default!important;
}

.os-project-block-layout .oak-v2-palette-image,
.editor-styles-wrapper .oak-v2-palette-image{
  aspect-ratio:1/1!important;
  width:100%!important;
  overflow:hidden!important;
  border:1px solid rgba(18,17,15,.13)!important;
  margin:0!important;
}

.os-project-block-layout .oak-v2-palette-image img,
.editor-styles-wrapper .oak-v2-palette-image img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}

.os-project-block-layout .oak-v2-palette-name,
.editor-styles-wrapper .oak-v2-palette-name{
  margin:clamp(10px,1vw,14px) 0 0;
  font-size:clamp(10px,.75vw,12px);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(18,17,15,.62);
}

/* 3x3 matrix image grid */
.os-project-block-layout .oak-v2-material-matrix,
.editor-styles-wrapper .oak-v2-material-matrix{
  max-width:min(760px,100%)!important;
  background:transparent!important;
  border:0!important;
}

.os-project-block-layout .oak-v2-matrix-row,
.editor-styles-wrapper .oak-v2-matrix-row{
  gap:1px!important;
  margin:0 0 1px!important;
  flex-wrap:nowrap!important;
}

.os-project-block-layout .oak-v2-matrix-row:last-child,
.editor-styles-wrapper .oak-v2-matrix-row:last-child{
  margin-bottom:0!important;
}

.os-project-block-layout .oak-v2-matrix-row > .wp-block-column,
.editor-styles-wrapper .oak-v2-matrix-row > .wp-block-column{
  margin:0!important;
  padding:0!important;
  flex-basis:33.333%!important;
  flex-grow:1!important;
}

.os-project-block-layout .oak-v2-matrix-cell,
.editor-styles-wrapper .oak-v2-matrix-cell{
  aspect-ratio:1/1!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  border:0!important;
  padding:0!important;
  margin:0!important;
}

.os-project-block-layout .oak-v2-matrix-image,
.editor-styles-wrapper .oak-v2-matrix-image{
  width:100%!important;
  height:100%!important;
  margin:0!important;
}

.os-project-block-layout .oak-v2-matrix-image img,
.editor-styles-wrapper .oak-v2-matrix-image img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}

.os-project-block-layout .oak-v2-detail-card,
.editor-styles-wrapper .oak-v2-detail-card{
  display:flex!important;
  flex-direction:column!important;
  gap:clamp(12px,1.4vw,20px)!important;
  min-width:0!important;
}

.os-project-block-layout .oak-v2-detail-image,
.editor-styles-wrapper .oak-v2-detail-image{
  aspect-ratio:4/3!important;
  overflow:hidden!important;
  background:#ddd!important;
  margin:0!important;
}

.os-project-block-layout .oak-v2-detail-image img,
.editor-styles-wrapper .oak-v2-detail-image img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}

.os-project-block-layout .oak-v2-plan-media,
.editor-styles-wrapper .oak-v2-plan-media{
  border:1px solid rgba(18,17,15,.13)!important;
  padding:clamp(14px,2vw,28px)!important;
}

.os-project-block-layout .oak-v2-plan-image img,
.editor-styles-wrapper .oak-v2-plan-image img{
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  background:transparent!important;
}

.os-project-block-layout .oak-v2-quote-note,
.editor-styles-wrapper .oak-v2-quote-note{
  position:relative!important;
  padding-block:clamp(28px,4vw,70px)!important;
}

.os-project-block-layout .oak-v2-quote-note::before,
.editor-styles-wrapper .oak-v2-quote-note::before{
  content:""!important;
  display:block!important;
  width:min(140px,34%)!important;
  height:1px!important;
  margin:0 auto clamp(24px,3vw,46px)!important;
  background:rgba(18,17,15,.13)!important;
}

@media (max-width:700px){
  .os-project-block-layout .oak-v2-section,
  .editor-styles-wrapper .oak-v2-section{
    width:100%!important;
  }

  .os-project-block-layout .oak-v2-brief-response,
  .editor-styles-wrapper .oak-v2-brief-response{
    text-align:center;
    gap:clamp(22px,7vw,38px)!important;
  }

  .os-project-block-layout .oak-v2-brief-response .wp-block-column,
  .editor-styles-wrapper .oak-v2-brief-response .wp-block-column{
    flex-basis:100%!important;
  }

  .os-project-block-layout .oak-v2-brief-response .oak-v2-large-copy,
  .editor-styles-wrapper .oak-v2-brief-response .oak-v2-large-copy{
    margin-left:auto;
    margin-right:auto;
  }

  .os-project-block-layout .oak-v2-project-facts,
  .editor-styles-wrapper .oak-v2-project-facts{
    text-align:center;
  }

  .os-project-block-layout .oak-v2-project-facts > .wp-block-column .oak-v2-fact,
  .editor-styles-wrapper .oak-v2-project-facts > .wp-block-column .oak-v2-fact{
    border-right:0!important;
    border-bottom:1px solid rgba(18,17,15,.13)!important;
  }

  .os-project-block-layout .oak-v2-project-facts > .wp-block-column:last-child .oak-v2-fact,
  .editor-styles-wrapper .oak-v2-project-facts > .wp-block-column:last-child .oak-v2-fact{
    border-bottom:0!important;
  }

  .os-project-block-layout .oak-v2-material-palette,
  .editor-styles-wrapper .oak-v2-material-palette{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:1px!important;
  }

  .os-project-block-layout .oak-v2-material-palette > .wp-block-column,
  .editor-styles-wrapper .oak-v2-material-palette > .wp-block-column{
    flex-basis:calc(33.333% - 1px)!important;
    flex-grow:0!important;
    margin:0!important;
  }

  .os-project-block-layout .oak-v2-palette-name,
  .editor-styles-wrapper .oak-v2-palette-name{
    text-align:center;
    font-size:9px;
    letter-spacing:.12em;
  }

  .os-project-block-layout .oak-v2-detail-study-cards,
  .editor-styles-wrapper .oak-v2-detail-study-cards{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:clamp(14px,4vw,22px)!important;
  }

  .os-project-block-layout .oak-v2-detail-study-cards > .wp-block-column,
  .editor-styles-wrapper .oak-v2-detail-study-cards > .wp-block-column{
    flex-basis:calc(50% - 12px)!important;
    flex-grow:0!important;
    margin:0!important;
  }

  .os-project-block-layout .oak-v2-detail-card .oak-v2-small-title,
  .editor-styles-wrapper .oak-v2-detail-card .oak-v2-small-title{
    font-size:clamp(16px,4.5vw,22px);
  }

  .os-project-block-layout .oak-v2-detail-card .oak-v2-muted-text,
  .editor-styles-wrapper .oak-v2-detail-card .oak-v2-muted-text{
    font-size:clamp(12px,3.6vw,15px);
    line-height:1.55;
  }

  .os-project-block-layout .oak-v2-matrix-row,
  .editor-styles-wrapper .oak-v2-matrix-row{
    flex-wrap:nowrap!important;
  }

  .os-project-block-layout .oak-v2-matrix-row > .wp-block-column,
  .editor-styles-wrapper .oak-v2-matrix-row > .wp-block-column{
    flex-basis:33.333%!important;
    flex-grow:1!important;
  }

  .os-project-block-layout .oak-v2-statement-text,
  .os-project-block-layout .oak-v2-quote-text,
  .editor-styles-wrapper .oak-v2-statement-text,
  .editor-styles-wrapper .oak-v2-quote-text{
    font-size:clamp(32px,10vw,58px);
  }
}



/* Phase 7 V2 follow-up: tighter palette gaps + centered mobile text */
.os-project-block-layout .oak-v2-material-palette,
.editor-styles-wrapper .oak-v2-material-palette{
  gap:1px!important;
}

.os-project-block-layout .oak-v2-material-palette > .wp-block-column,
.editor-styles-wrapper .oak-v2-material-palette > .wp-block-column{
  margin:0!important;
  padding:0!important;
}

@media (max-width:700px){
  .os-project-block-layout .oak-v2-design-highlights,
  .editor-styles-wrapper .oak-v2-design-highlights,
  .os-project-block-layout .oak-v2-detail-study-cards,
  .editor-styles-wrapper .oak-v2-detail-study-cards{
    text-align:center;
  }

  .os-project-block-layout .oak-v2-highlight,
  .editor-styles-wrapper .oak-v2-highlight,
  .os-project-block-layout .oak-v2-detail-card,
  .editor-styles-wrapper .oak-v2-detail-card{
    text-align:center;
    align-items:center!important;
  }

  .os-project-block-layout .oak-v2-highlight .oak-v2-small-title,
  .os-project-block-layout .oak-v2-highlight .oak-v2-muted-text,
  .os-project-block-layout .oak-v2-detail-card .oak-v2-small-title,
  .os-project-block-layout .oak-v2-detail-card .oak-v2-muted-text,
  .editor-styles-wrapper .oak-v2-highlight .oak-v2-small-title,
  .editor-styles-wrapper .oak-v2-highlight .oak-v2-muted-text,
  .editor-styles-wrapper .oak-v2-detail-card .oak-v2-small-title,
  .editor-styles-wrapper .oak-v2-detail-card .oak-v2-muted-text{
    text-align:center;
    margin-left:auto;
    margin-right:auto;
  }

  .os-project-block-layout .oak-v2-highlight .oak-v2-muted-text,
  .os-project-block-layout .oak-v2-detail-card .oak-v2-muted-text,
  .editor-styles-wrapper .oak-v2-highlight .oak-v2-muted-text,
  .editor-styles-wrapper .oak-v2-detail-card .oak-v2-muted-text{
    max-width:28ch!important;
  }
}



/* Phase 7 V2 follow-up: allow WordPress typography and theme color controls */
.os-project-block-layout .oak-v2-section :where(p,h1,h2,h3,h4,h5,h6),
.editor-styles-wrapper .oak-v2-section :where(p,h1,h2,h3,h4,h5,h6){
  /* Defaults above are intentionally not locked with !important,
     so block editor color/typography controls can override them. */
  font-family:inherit;
}

/* Keep layout-only classes stable without locking text design controls */
.os-project-block-layout .oak-v2-section .has-text-color,
.editor-styles-wrapper .oak-v2-section .has-text-color{
  color:var(--wp--preset--color--current, inherit);
}

/* If Gutenberg writes inline style for typography/color, it should visually win. */
.os-project-block-layout .oak-v2-section [style],
.editor-styles-wrapper .oak-v2-section [style]{
  /* no hard overrides here by design */
}



/* Phase 7 V2 follow-up: responsive text alignment safety
   Desktop/tablet typography controls remain editable.
   On mobile, V2 text is centered to avoid desktop left/right alignment breaking mobile composition. */
@media (max-width:700px){
  .os-project-block-layout .oak-v2-section :where(p,h1,h2,h3,h4,h5,h6),
  .editor-styles-wrapper .oak-v2-section :where(p,h1,h2,h3,h4,h5,h6){
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .os-project-block-layout .oak-v2-section .has-text-align-left,
  .os-project-block-layout .oak-v2-section .has-text-align-right,
  .os-project-block-layout .oak-v2-section .has-text-align-center,
  .editor-styles-wrapper .oak-v2-section .has-text-align-left,
  .editor-styles-wrapper .oak-v2-section .has-text-align-right,
  .editor-styles-wrapper .oak-v2-section .has-text-align-center{
    text-align:center!important;
  }

  .os-project-block-layout .oak-v2-brief-response,
  .os-project-block-layout .oak-v2-project-facts,
  .os-project-block-layout .oak-v2-design-highlights,
  .os-project-block-layout .oak-v2-detail-study-cards,
  .os-project-block-layout .oak-v2-key-plan,
  .editor-styles-wrapper .oak-v2-brief-response,
  .editor-styles-wrapper .oak-v2-project-facts,
  .editor-styles-wrapper .oak-v2-design-highlights,
  .editor-styles-wrapper .oak-v2-detail-study-cards,
  .editor-styles-wrapper .oak-v2-key-plan{
    text-align:center!important;
  }

  .os-project-block-layout .oak-v2-section .wp-block-column,
  .editor-styles-wrapper .oak-v2-section .wp-block-column{
    text-align:center!important;
  }

  .os-project-block-layout .oak-v2-large-copy,
  .os-project-block-layout .oak-v2-muted-text,
  .os-project-block-layout .oak-v2-fact-value,
  .editor-styles-wrapper .oak-v2-large-copy,
  .editor-styles-wrapper .oak-v2-muted-text,
  .editor-styles-wrapper .oak-v2-fact-value{
    max-width:34ch!important;
  }

  .os-project-block-layout .oak-v2-statement-text,
  .os-project-block-layout .oak-v2-quote-text,
  .editor-styles-wrapper .oak-v2-statement-text,
  .editor-styles-wrapper .oak-v2-quote-text{
    max-width:min(92vw,14ch)!important;
  }
}



/* Contact optional description follow-up */
.os-home-page .os-contact-copy.is-description-empty .os-text{
  display:none!important;
}
.os-home-page .os-contact-copy.is-description-empty .os-title{
  margin-bottom:0;
}

/* Experimental Phase: Project Index Preview Prototype — Iframe nav revision */
.oak-index-preview-enabled [data-oak-preview-card]{
  cursor:pointer;
}

.oak-index-preview-overlay{
  position:fixed;
  inset:0;
  z-index:9990;
  display:grid;
  place-items:center;
  padding:clamp(14px,2.2vw,32px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease, visibility .22s ease;
}

.oak-index-preview-overlay.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.oak-index-preview-overlay[hidden]{
  display:none!important;
}

.oak-index-preview-backdrop{
  position:absolute;
  inset:0;
  background:rgba(12,12,10,.64);
  backdrop-filter:blur(9px);
}

.oak-index-preview-panel{
  position:relative;
  z-index:1;
  width:min(1460px,96vw);
  height:min(900px,90vh);
  background:#0f0f0e;
  color:#fff;
  box-shadow:0 24px 90px rgba(0,0,0,.28);
  overflow:hidden;
  transform:translateY(14px) scale(.988);
  transition:transform .22s ease;
  outline:none;
}

.oak-index-preview-overlay.is-open .oak-index-preview-panel{
  transform:translateY(0) scale(1);
}

.oak-index-preview-toolbar{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:5;
  height:78px;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  background:linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,0));
}

.oak-index-preview-full{
  pointer-events:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 14px;
  border:0;
  background:transparent;
  color:#fff;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:11px;
  font-weight:800;
  text-shadow:0 1px 12px rgba(0,0,0,.45);
  transition:opacity .2s ease, transform .2s ease;
}

.oak-index-preview-full:hover{
  opacity:.72;
  transform:translateY(-1px);
}

.oak-index-preview-close{
  pointer-events:auto;
  position:absolute;
  top:18px;
  right:18px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.28);
  background:rgba(0,0,0,.18);
  color:#fff;
  font-size:25px;
  line-height:1;
  cursor:pointer;
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}

.oak-index-preview-close:hover{
  transform:rotate(4deg) scale(1.04);
  background:rgba(0,0,0,.34);
  border-color:rgba(255,255,255,.5);
}

.oak-index-preview-frame-wrap{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-height:0;
  background:#ebe6dc;
  overflow:hidden;
}

.oak-index-preview-frame{
  width:100%;
  height:100%;
  border:0;
  display:block;
  background:#ebe6dc;
}

.oak-index-preview-arrow{
  position:absolute;
  top:50%;
  z-index:6;
  width:52px;
  height:72px;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border:0;
  background:rgba(0,0,0,.18);
  color:#fff;
  font-size:54px;
  font-weight:300;
  line-height:1;
  cursor:pointer;
  text-shadow:0 1px 16px rgba(0,0,0,.52);
  transition:background .2s ease, opacity .2s ease, transform .2s ease;
}

.oak-index-preview-arrow:hover{
  background:rgba(0,0,0,.34);
  transform:translateY(-50%) scale(1.04);
}

.oak-index-preview-arrow[disabled]{
  opacity:.22;
  cursor:default;
  pointer-events:none;
}

.oak-index-preview-prev{
  left:clamp(10px,1.5vw,22px);
}

.oak-index-preview-next{
  right:clamp(10px,1.5vw,22px);
}

body.oak-index-preview-lock{
  overflow:hidden;
}

@media (max-width:760px){
  .oak-index-preview-overlay{
    padding:0;
    align-items:stretch;
  }

  .oak-index-preview-panel{
    width:100%;
    height:100%;
    max-height:none;
  }

  .oak-index-preview-toolbar{
    height:68px;
  }

  .oak-index-preview-full{
    font-size:10px;
    letter-spacing:.14em;
    padding:0 10px;
  }

  .oak-index-preview-close{
    top:12px;
    right:12px;
    width:40px;
    height:40px;
  }

  .oak-index-preview-arrow{
    width:42px;
    height:58px;
    font-size:42px;
    background:rgba(0,0,0,.20);
  }

  .oak-index-preview-prev{
    left:6px;
  }

  .oak-index-preview-next{
    right:6px;
  }
}

@media (prefers-reduced-motion:reduce){
  .oak-index-preview-overlay,
  .oak-index-preview-panel,
  .oak-index-preview-close,
  .oak-index-preview-full,
  .oak-index-preview-arrow{
    transition:none!important;
  }
}



/* Experimental Index Preview follow-up: lower top controls away from iframe header */
.oak-index-preview-iframe-mode .oak-index-preview-toolbar{
  top:clamp(58px,5.6vw,86px)!important;
  height:58px!important;
  background:transparent!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-close{
  top:clamp(72px,6.2vw,96px)!important;
}

@media (max-width:760px){
  .oak-index-preview-iframe-mode .oak-index-preview-toolbar{
    top:70px!important;
    height:54px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-close{
    top:78px!important;
  }
}



/* Experimental Index Preview follow-up: hide iframe site header, restore top controls with subtle glass */
.oak-index-preview-iframe-mode .oak-index-preview-toolbar{
  top:0!important;
  height:78px!important;
  background:linear-gradient(to bottom, rgba(8,8,7,.26), rgba(8,8,7,.08), rgba(8,8,7,0))!important;
  backdrop-filter:blur(6px)!important;
  -webkit-backdrop-filter:blur(6px)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-close{
  top:18px!important;
}

@media (max-width:760px){
  .oak-index-preview-iframe-mode .oak-index-preview-toolbar{
    top:0!important;
    height:68px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-close{
    top:12px!important;
  }
}



/* Experimental Index Preview follow-up: Behance-like outer controls + separated scrollbar */
.oak-index-preview-iframe-mode .oak-index-preview-panel{
  overflow:visible!important;
  background:transparent!important;
  box-shadow:none!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-frame-wrap{
  inset:0 18px 0 0!important;
  width:auto!important;
  height:100%!important;
  overflow:hidden!important;
  box-shadow:0 24px 90px rgba(0,0,0,.28)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-frame{
  width:100%!important;
  height:100%!important;
  display:block!important;
  border:0!important;
}

/* remove the previous glass/gradient effect */
.oak-index-preview-iframe-mode .oak-index-preview-toolbar{
  top:0!important;
  height:62px!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  pointer-events:none!important;
}

/* centered text link floating above the preview, no background */
.oak-index-preview-iframe-mode .oak-index-preview-full{
  pointer-events:auto!important;
  color:#fff!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-shadow:0 2px 18px rgba(0,0,0,.72)!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
  transform:none!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-full:hover{
  opacity:.72!important;
  transform:translateY(-1px)!important;
}

/* close outside the iframe/page boundary */
.oak-index-preview-iframe-mode .oak-index-preview-close{
  top:0!important;
  right:-58px!important;
  width:42px!important;
  height:42px!important;
  border:0!important;
  border-radius:50%!important;
  background:rgba(0,0,0,.62)!important;
  color:#fff!important;
  box-shadow:0 10px 34px rgba(0,0,0,.26)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-close:hover{
  background:rgba(0,0,0,.82)!important;
}

/* arrows outside the iframe/page boundary */
.oak-index-preview-iframe-mode .oak-index-preview-arrow{
  background:rgba(0,0,0,.42)!important;
  border-radius:50%!important;
  width:52px!important;
  height:52px!important;
  font-size:44px!important;
  box-shadow:0 12px 36px rgba(0,0,0,.22)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-arrow:hover{
  background:rgba(0,0,0,.72)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-prev{
  left:-74px!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-next{
  right:-74px!important;
}

/* show the scroll gutter visually on the outside/right, closer to Behance */
.oak-index-preview-iframe-mode .oak-index-preview-panel::after{
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:18px;
  height:100%;
  background:rgba(235,230,220,.82);
  box-shadow:inset 1px 0 rgba(0,0,0,.08);
  pointer-events:none;
}

/* iframe scrollbar styling where supported */
.oak-index-preview-frame{
  scrollbar-width:thin;
  scrollbar-color:rgba(17,17,15,.38) rgba(235,230,220,.78);
}

@media (max-width:1100px){
  .oak-index-preview-iframe-mode .oak-index-preview-prev{
    left:-58px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next{
    right:-58px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-close{
    right:-46px!important;
  }
}

@media (max-width:760px){
  .oak-index-preview-iframe-mode .oak-index-preview-panel{
    overflow:hidden!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-frame-wrap{
    inset:0!important;
    box-shadow:none!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-panel::after{
    display:none!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-toolbar{
    top:0!important;
    height:62px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-close{
    top:12px!important;
    right:12px!important;
    width:40px!important;
    height:40px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-arrow{
    width:42px!important;
    height:42px!important;
    font-size:34px!important;
    background:rgba(0,0,0,.36)!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev{
    left:8px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next{
    right:8px!important;
  }
}



/* Experimental Index Preview follow-up: external scroll + bottom project arrows */
.oak-index-preview-iframe-mode.oak-index-preview-overlay{
  display:block!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:clamp(42px,5vw,78px) clamp(18px,3vw,46px)!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.38) rgba(0,0,0,.22);
}

.oak-index-preview-iframe-mode.oak-index-preview-overlay::-webkit-scrollbar{
  width:14px;
}

.oak-index-preview-iframe-mode.oak-index-preview-overlay::-webkit-scrollbar-track{
  background:rgba(0,0,0,.22);
}

.oak-index-preview-iframe-mode.oak-index-preview-overlay::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.36);
  border:4px solid rgba(0,0,0,.22);
  border-radius:20px;
}

.oak-index-preview-iframe-mode .oak-index-preview-panel{
  width:min(1460px,86vw)!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0 auto!important;
  overflow:visible!important;
  background:transparent!important;
  box-shadow:none!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-frame-wrap{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:auto!important;
  min-height:80vh!important;
  overflow:hidden!important;
  box-shadow:0 24px 90px rgba(0,0,0,.28)!important;
  background:#ebe6dc!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-frame{
  width:100%!important;
  height:80vh!important;
  min-height:80vh!important;
  border:0!important;
  display:block!important;
  background:#ebe6dc!important;
  overflow:hidden!important;
}

/* remove the previous artificial right gutter completely */
.oak-index-preview-iframe-mode .oak-index-preview-panel::after{
  display:none!important;
  content:none!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-toolbar{
  position:fixed!important;
  top:clamp(14px,2vw,24px)!important;
  left:0!important;
  right:0!important;
  height:42px!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  pointer-events:none!important;
  z-index:10000!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-full{
  pointer-events:auto!important;
  color:#fff!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-shadow:0 2px 18px rgba(0,0,0,.72)!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-close{
  position:fixed!important;
  top:clamp(14px,2vw,24px)!important;
  right:clamp(14px,2vw,24px)!important;
  width:42px!important;
  height:42px!important;
  border:0!important;
  border-radius:50%!important;
  background:rgba(0,0,0,.62)!important;
  color:#fff!important;
  box-shadow:0 10px 34px rgba(0,0,0,.26)!important;
  z-index:10001!important;
}

/* Move project previous/next controls to the lower area to avoid conflict with image lightbox arrows */
.oak-index-preview-iframe-mode .oak-index-preview-arrow{
  position:fixed!important;
  top:auto!important;
  bottom:clamp(22px,3.2vw,44px)!important;
  transform:none!important;
  width:54px!important;
  height:54px!important;
  border-radius:50%!important;
  background:rgba(0,0,0,.44)!important;
  color:#fff!important;
  font-size:42px!important;
  box-shadow:0 12px 36px rgba(0,0,0,.22)!important;
  z-index:10000!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-arrow:hover{
  background:rgba(0,0,0,.72)!important;
  transform:scale(1.04)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-prev{
  left:calc(50% - 74px)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-next{
  right:calc(50% - 74px)!important;
}

@media (max-width:760px){
  .oak-index-preview-iframe-mode.oak-index-preview-overlay{
    padding:0!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-panel{
    width:100%!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-frame-wrap{
    min-height:100vh!important;
    box-shadow:none!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-frame{
    height:100vh!important;
    min-height:100vh!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-toolbar{
    top:12px!important;
    height:40px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-close{
    top:12px!important;
    right:12px!important;
    width:40px!important;
    height:40px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-full{
    font-size:10px!important;
    max-width:calc(100vw - 120px)!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-arrow{
    bottom:16px!important;
    width:44px!important;
    height:44px!important;
    font-size:34px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev{
    left:calc(50% - 58px)!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next{
    right:calc(50% - 58px)!important;
  }
}



/* Experimental Index Preview follow-up: working hidden iframe scroll + outside controls */
.oak-index-preview-iframe-mode.oak-index-preview-overlay{
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
  padding:clamp(28px,4vw,64px) clamp(42px,6vw,96px)!important;
  scrollbar-width:none!important;
}

.oak-index-preview-iframe-mode.oak-index-preview-overlay::-webkit-scrollbar{
  display:none!important;
  width:0!important;
  height:0!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-panel{
  width:min(1460px,86vw)!important;
  height:min(900px,88vh)!important;
  min-height:0!important;
  max-height:none!important;
  margin:0 auto!important;
  overflow:visible!important;
  background:transparent!important;
  box-shadow:none!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-frame-wrap{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
  box-shadow:0 24px 90px rgba(0,0,0,.28)!important;
  background:#ebe6dc!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-frame{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  border:0!important;
  display:block!important;
  background:#ebe6dc!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-panel::after{
  display:none!important;
  content:none!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-toolbar{
  position:absolute!important;
  top:0!important;
  left:0!important;
  right:0!important;
  height:62px!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  pointer-events:none!important;
  z-index:10000!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-full{
  pointer-events:auto!important;
  color:#fff!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-shadow:0 2px 18px rgba(0,0,0,.72)!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-close{
  position:absolute!important;
  top:-56px!important;
  right:-8px!important;
  width:44px!important;
  height:44px!important;
  border:0!important;
  border-radius:50%!important;
  background:rgba(0,0,0,.66)!important;
  color:#fff!important;
  box-shadow:0 10px 34px rgba(0,0,0,.28)!important;
  z-index:10001!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-close:hover{
  background:rgba(0,0,0,.86)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-arrow{
  position:absolute!important;
  top:auto!important;
  bottom:-74px!important;
  transform:none!important;
  width:54px!important;
  height:54px!important;
  border-radius:50%!important;
  background:rgba(0,0,0,.48)!important;
  color:#fff!important;
  font-size:42px!important;
  box-shadow:0 12px 36px rgba(0,0,0,.24)!important;
  z-index:10000!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-arrow:hover{
  background:rgba(0,0,0,.76)!important;
  transform:scale(1.04)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-prev{
  left:calc(50% - 70px)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-next{
  right:calc(50% - 70px)!important;
}

@media (max-width:760px){
  .oak-index-preview-iframe-mode.oak-index-preview-overlay{
    padding:0!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-panel{
    width:100%!important;
    height:100%!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-frame-wrap{
    box-shadow:none!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-toolbar{
    top:0!important;
    height:62px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-close{
    top:12px!important;
    right:12px!important;
    width:40px!important;
    height:40px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-full{
    font-size:10px!important;
    max-width:calc(100vw - 120px)!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-arrow{
    position:fixed!important;
    bottom:16px!important;
    width:44px!important;
    height:44px!important;
    font-size:34px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev{
    left:calc(50% - 58px)!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next{
    right:calc(50% - 58px)!important;
  }
}



/* Experimental Index Preview follow-up: side arrows aligned to iframe bottom */
.oak-index-preview-iframe-mode .oak-index-preview-arrow{
  position:absolute!important;
  top:auto!important;
  bottom:0!important;
  transform:none!important;
  width:54px!important;
  height:54px!important;
  border-radius:50%!important;
  background:rgba(0,0,0,.48)!important;
  color:#fff!important;
  font-size:42px!important;
  box-shadow:0 12px 36px rgba(0,0,0,.24)!important;
  z-index:10000!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-arrow:hover{
  background:rgba(0,0,0,.76)!important;
  transform:scale(1.04)!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-prev{
  left:-64px!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-next{
  right:-64px!important;
}

@media (max-width:1100px){
  .oak-index-preview-iframe-mode .oak-index-preview-prev{
    left:-54px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next{
    right:-54px!important;
  }
}

@media (max-width:760px){
  .oak-index-preview-iframe-mode .oak-index-preview-arrow{
    position:fixed!important;
    bottom:16px!important;
    width:44px!important;
    height:44px!important;
    font-size:34px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev{
    left:16px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next{
    right:16px!important;
  }
}



/* Experimental Index Preview follow-up: arrow labels + mobile close separation */
@media (min-width:761px){
  .oak-index-preview-iframe-mode .oak-index-preview-arrow{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    overflow:visible!important;
    text-indent:-9999px!important;
    font-size:0!important;
    line-height:1!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-arrow::before{
    display:block!important;
    text-indent:0!important;
    font-size:42px!important;
    line-height:1!important;
    font-weight:300!important;
    transform:translateY(-3px)!important;
    color:#fff!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev::before{
    content:"‹"!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next::before{
    content:"›"!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-arrow::after{
    position:absolute!important;
    top:calc(100% + 8px)!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    display:block!important;
    text-indent:0!important;
    font-size:10px!important;
    line-height:1!important;
    font-weight:700!important;
    letter-spacing:.08em!important;
    text-transform:capitalize!important;
    color:rgba(255,255,255,.78)!important;
    text-shadow:0 2px 12px rgba(0,0,0,.55)!important;
    white-space:nowrap!important;
    pointer-events:none!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev::after{
    content:"Previous"!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next::after{
    content:"Next"!important;
  }
}

/* On mobile, keep the project-preview close away from the iframe lightbox close button */
@media (max-width:760px){
  .oak-index-preview-iframe-mode .oak-index-preview-close{
    top:12px!important;
    right:auto!important;
    left:12px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-toolbar{
    padding-left:58px!important;
    padding-right:58px!important;
  }
}



/* Experimental Index Preview follow-up: mobile previous/next labels + centered arrows */
@media (max-width:760px){
  .oak-index-preview-iframe-mode .oak-index-preview-arrow{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    overflow:visible!important;
    text-indent:-9999px!important;
    font-size:0!important;
    line-height:1!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-arrow::before{
    display:block!important;
    text-indent:0!important;
    font-size:34px!important;
    line-height:1!important;
    font-weight:300!important;
    transform:translateY(-2px)!important;
    color:#fff!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev::before{
    content:"‹"!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next::before{
    content:"›"!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-arrow::after{
    position:absolute!important;
    top:calc(100% + 7px)!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    display:block!important;
    text-indent:0!important;
    font-size:9px!important;
    line-height:1!important;
    font-weight:700!important;
    letter-spacing:.07em!important;
    text-transform:capitalize!important;
    color:rgba(255,255,255,.78)!important;
    text-shadow:0 2px 12px rgba(0,0,0,.55)!important;
    white-space:nowrap!important;
    pointer-events:none!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev::after{
    content:"Previous"!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next::after{
    content:"Next"!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-prev{
    left:18px!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-next{
    right:18px!important;
  }
}



/* About small revision: soften Explore card image overlay to 10% */
.os-about-explores-grid span.has-image::after{
  opacity:.10!important;
  background:rgba(245,241,232,.10)!important;
}

.os-about-explores-grid span.has-image img{
  opacity:.96!important;
}

.os-about-explores-grid span.has-image:hover::after{
  opacity:.10!important;
}

.os-about-explores-grid span.has-image:hover img{
  opacity:.98!important;
}


/* About small revision: raise explore card labels toward upper quarter */
.os-about-explores-grid span{
  align-items:flex-start!important;
  padding-top:25%!important;
  box-sizing:border-box!important;
}


/* Experimental Index Preview follow-up: prevent iframe scrollbar flash */
.oak-index-preview-iframe-mode .oak-index-preview-frame{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}

.oak-index-preview-iframe-mode .oak-index-preview-frame::-webkit-scrollbar{
  display:none!important;
  width:0!important;
  height:0!important;
}



/* Small Home Slider revision: calmer hover zoom + hover-only project text */
.os-home-works .os-work-card img,
.os-home-works .os-work-item img,
.os-home-works .os-project-slide img,
.os-selected-works .os-work-card img,
.os-selected-works .os-work-item img,
.os-selected-works .os-project-slide img,
.os-home-slider .os-work-card img,
.os-home-slider .os-work-item img,
.os-home-slider .os-project-slide img,
.os-works-slider .os-work-card img,
.os-works-slider .os-work-item img,
.os-works-slider .os-project-slide img{
  transition:transform .55s cubic-bezier(.2,.7,.2,1), filter .35s ease, opacity .35s ease!important;
}

/* Reduce the aggressive hover zoom. Previous behavior stays intact, only the scale is calmer. */
.os-home-works .os-work-card:hover img,
.os-home-works .os-work-item:hover img,
.os-home-works .os-project-slide:hover img,
.os-selected-works .os-work-card:hover img,
.os-selected-works .os-work-item:hover img,
.os-selected-works .os-project-slide:hover img,
.os-home-slider .os-work-card:hover img,
.os-home-slider .os-work-item:hover img,
.os-home-slider .os-project-slide:hover img,
.os-works-slider .os-work-card:hover img,
.os-works-slider .os-work-item:hover img,
.os-works-slider .os-project-slide:hover img,
.os-home-works .os-work-card:focus-within img,
.os-home-works .os-work-item:focus-within img,
.os-home-works .os-project-slide:focus-within img,
.os-selected-works .os-work-card:focus-within img,
.os-selected-works .os-work-item:focus-within img,
.os-selected-works .os-project-slide:focus-within img,
.os-home-slider .os-work-card:focus-within img,
.os-home-slider .os-work-item:focus-within img,
.os-home-slider .os-project-slide:focus-within img,
.os-works-slider .os-work-card:focus-within img,
.os-works-slider .os-work-item:focus-within img,
.os-works-slider .os-project-slide:focus-within img{
  transform:scale(1.025)!important;
}

/* Hide project title/type by default, reveal only on interaction. */
.os-home-works .os-work-card .os-work-meta,
.os-home-works .os-work-card .os-work-content,
.os-home-works .os-work-card .os-card-copy,
.os-home-works .os-work-item .os-work-meta,
.os-home-works .os-work-item .os-work-content,
.os-home-works .os-work-item .os-card-copy,
.os-home-works .os-project-slide .os-work-meta,
.os-home-works .os-project-slide .os-work-content,
.os-home-works .os-project-slide .os-card-copy,
.os-selected-works .os-work-card .os-work-meta,
.os-selected-works .os-work-card .os-work-content,
.os-selected-works .os-work-card .os-card-copy,
.os-selected-works .os-work-item .os-work-meta,
.os-selected-works .os-work-item .os-work-content,
.os-selected-works .os-work-item .os-card-copy,
.os-selected-works .os-project-slide .os-work-meta,
.os-selected-works .os-project-slide .os-work-content,
.os-selected-works .os-project-slide .os-card-copy,
.os-home-slider .os-work-card .os-work-meta,
.os-home-slider .os-work-card .os-work-content,
.os-home-slider .os-work-card .os-card-copy,
.os-home-slider .os-work-item .os-work-meta,
.os-home-slider .os-work-item .os-work-content,
.os-home-slider .os-work-item .os-card-copy,
.os-home-slider .os-project-slide .os-work-meta,
.os-home-slider .os-project-slide .os-work-content,
.os-home-slider .os-project-slide .os-card-copy,
.os-works-slider .os-work-card .os-work-meta,
.os-works-slider .os-work-card .os-work-content,
.os-works-slider .os-work-card .os-card-copy,
.os-works-slider .os-work-item .os-work-meta,
.os-works-slider .os-work-item .os-work-content,
.os-works-slider .os-work-item .os-card-copy,
.os-works-slider .os-project-slide .os-work-meta,
.os-works-slider .os-project-slide .os-work-content,
.os-works-slider .os-project-slide .os-card-copy{
  opacity:0!important;
  transform:translateY(8px)!important;
  visibility:hidden!important;
  transition:opacity .28s ease, transform .32s cubic-bezier(.2,.7,.2,1), visibility .28s ease!important;
}

/* Reveal on desktop hover/focus and mobile tap/active states when available. */
.os-home-works .os-work-card:hover .os-work-meta,
.os-home-works .os-work-card:hover .os-work-content,
.os-home-works .os-work-card:hover .os-card-copy,
.os-home-works .os-work-item:hover .os-work-meta,
.os-home-works .os-work-item:hover .os-work-content,
.os-home-works .os-work-item:hover .os-card-copy,
.os-home-works .os-project-slide:hover .os-work-meta,
.os-home-works .os-project-slide:hover .os-work-content,
.os-home-works .os-project-slide:hover .os-card-copy,
.os-selected-works .os-work-card:hover .os-work-meta,
.os-selected-works .os-work-card:hover .os-work-content,
.os-selected-works .os-work-card:hover .os-card-copy,
.os-selected-works .os-work-item:hover .os-work-meta,
.os-selected-works .os-work-item:hover .os-work-content,
.os-selected-works .os-work-item:hover .os-card-copy,
.os-selected-works .os-project-slide:hover .os-work-meta,
.os-selected-works .os-project-slide:hover .os-work-content,
.os-selected-works .os-project-slide:hover .os-card-copy,
.os-home-slider .os-work-card:hover .os-work-meta,
.os-home-slider .os-work-card:hover .os-work-content,
.os-home-slider .os-work-card:hover .os-card-copy,
.os-home-slider .os-work-item:hover .os-work-meta,
.os-home-slider .os-work-item:hover .os-work-content,
.os-home-slider .os-work-item:hover .os-card-copy,
.os-home-slider .os-project-slide:hover .os-work-meta,
.os-home-slider .os-project-slide:hover .os-work-content,
.os-home-slider .os-project-slide:hover .os-card-copy,
.os-works-slider .os-work-card:hover .os-work-meta,
.os-works-slider .os-work-card:hover .os-work-content,
.os-works-slider .os-work-card:hover .os-card-copy,
.os-works-slider .os-work-item:hover .os-work-meta,
.os-works-slider .os-work-item:hover .os-work-content,
.os-works-slider .os-work-item:hover .os-card-copy,
.os-works-slider .os-project-slide:hover .os-work-meta,
.os-works-slider .os-project-slide:hover .os-work-content,
.os-works-slider .os-project-slide:hover .os-card-copy,
.os-home-works .os-work-card:focus-within .os-work-meta,
.os-home-works .os-work-card:focus-within .os-work-content,
.os-home-works .os-work-card:focus-within .os-card-copy,
.os-home-works .os-work-item:focus-within .os-work-meta,
.os-home-works .os-work-item:focus-within .os-work-content,
.os-home-works .os-work-item:focus-within .os-card-copy,
.os-home-works .os-project-slide:focus-within .os-work-meta,
.os-home-works .os-project-slide:focus-within .os-work-content,
.os-home-works .os-project-slide:focus-within .os-card-copy,
.os-selected-works .os-work-card:focus-within .os-work-meta,
.os-selected-works .os-work-card:focus-within .os-work-content,
.os-selected-works .os-work-card:focus-within .os-card-copy,
.os-selected-works .os-work-item:focus-within .os-work-meta,
.os-selected-works .os-work-item:focus-within .os-work-content,
.os-selected-works .os-work-item:focus-within .os-card-copy,
.os-selected-works .os-project-slide:focus-within .os-work-meta,
.os-selected-works .os-project-slide:focus-within .os-work-content,
.os-selected-works .os-project-slide:focus-within .os-card-copy,
.os-home-slider .os-work-card:focus-within .os-work-meta,
.os-home-slider .os-work-card:focus-within .os-work-content,
.os-home-slider .os-work-card:focus-within .os-card-copy,
.os-home-slider .os-work-item:focus-within .os-work-meta,
.os-home-slider .os-work-item:focus-within .os-work-content,
.os-home-slider .os-work-item:focus-within .os-card-copy,
.os-home-slider .os-project-slide:focus-within .os-work-meta,
.os-home-slider .os-project-slide:focus-within .os-work-content,
.os-home-slider .os-project-slide:focus-within .os-card-copy,
.os-works-slider .os-work-card:focus-within .os-work-meta,
.os-works-slider .os-work-card:focus-within .os-work-content,
.os-works-slider .os-work-card:focus-within .os-card-copy,
.os-works-slider .os-work-item:focus-within .os-work-meta,
.os-works-slider .os-work-item:focus-within .os-work-content,
.os-works-slider .os-work-item:focus-within .os-card-copy,
.os-works-slider .os-project-slide:focus-within .os-work-meta,
.os-works-slider .os-project-slide:focus-within .os-work-content,
.os-works-slider .os-project-slide:focus-within .os-card-copy,
.os-home-works .is-active .os-work-meta,
.os-home-works .is-active .os-work-content,
.os-home-works .is-active .os-card-copy,
.os-selected-works .is-active .os-work-meta,
.os-selected-works .is-active .os-work-content,
.os-selected-works .is-active .os-card-copy,
.os-home-slider .is-active .os-work-meta,
.os-home-slider .is-active .os-work-content,
.os-home-slider .is-active .os-card-copy,
.os-works-slider .is-active .os-work-meta,
.os-works-slider .is-active .os-work-content,
.os-works-slider .is-active .os-card-copy{
  opacity:1!important;
  transform:translateY(0)!important;
  visibility:visible!important;
}

@media (hover:none){
  .os-home-works .os-work-card:active img,
  .os-home-works .os-work-item:active img,
  .os-home-works .os-project-slide:active img,
  .os-selected-works .os-work-card:active img,
  .os-selected-works .os-work-item:active img,
  .os-selected-works .os-project-slide:active img,
  .os-home-slider .os-work-card:active img,
  .os-home-slider .os-work-item:active img,
  .os-home-slider .os-project-slide:active img,
  .os-works-slider .os-work-card:active img,
  .os-works-slider .os-work-item:active img,
  .os-works-slider .os-project-slide:active img{
    transform:scale(1.018)!important;
  }

  .os-home-works .os-work-card:active .os-work-meta,
  .os-home-works .os-work-card:active .os-work-content,
  .os-home-works .os-work-card:active .os-card-copy,
  .os-home-works .os-work-item:active .os-work-meta,
  .os-home-works .os-work-item:active .os-work-content,
  .os-home-works .os-work-item:active .os-card-copy,
  .os-home-works .os-project-slide:active .os-work-meta,
  .os-home-works .os-project-slide:active .os-work-content,
  .os-home-works .os-project-slide:active .os-card-copy,
  .os-selected-works .os-work-card:active .os-work-meta,
  .os-selected-works .os-work-card:active .os-work-content,
  .os-selected-works .os-work-card:active .os-card-copy,
  .os-selected-works .os-work-item:active .os-work-meta,
  .os-selected-works .os-work-item:active .os-work-content,
  .os-selected-works .os-work-item:active .os-card-copy,
  .os-selected-works .os-project-slide:active .os-work-meta,
  .os-selected-works .os-project-slide:active .os-work-content,
  .os-selected-works .os-project-slide:active .os-card-copy,
  .os-home-slider .os-work-card:active .os-work-meta,
  .os-home-slider .os-work-card:active .os-work-content,
  .os-home-slider .os-work-card:active .os-card-copy,
  .os-home-slider .os-work-item:active .os-work-meta,
  .os-home-slider .os-work-item:active .os-work-content,
  .os-home-slider .os-work-item:active .os-card-copy,
  .os-home-slider .os-project-slide:active .os-work-meta,
  .os-home-slider .os-project-slide:active .os-work-content,
  .os-home-slider .os-project-slide:active .os-card-copy,
  .os-works-slider .os-work-card:active .os-work-meta,
  .os-works-slider .os-work-card:active .os-work-content,
  .os-works-slider .os-work-card:active .os-card-copy,
  .os-works-slider .os-work-item:active .os-work-meta,
  .os-works-slider .os-work-item:active .os-work-content,
  .os-works-slider .os-work-item:active .os-card-copy,
  .os-works-slider .os-project-slide:active .os-work-meta,
  .os-works-slider .os-project-slide:active .os-work-content,
  .os-works-slider .os-project-slide:active .os-card-copy{
    opacity:1!important;
    transform:translateY(0)!important;
    visibility:visible!important;
  }
}



/* Small Home Slider exact fix: target the real slider classes */
.os-projects .os-project-slider .os-project-card img{
  transition:transform .55s cubic-bezier(.2,.7,.2,1), filter .35s ease, opacity .35s ease!important;
}

/* Calmer image zoom inside the same card container */
.os-projects .os-project-slider .os-project-card:hover img,
.os-projects .os-project-slider .os-project-card:focus-within img,
.os-projects .os-project-slider .os-project-card.is-mobile-focus img{
  transform:scale(1.018)!important;
}

/* Hide project name/type by default */
.os-projects .os-project-slider .os-project-card .os-card-meta{
  opacity:0!important;
  visibility:hidden!important;
  transform:translateY(10px)!important;
  transition:opacity .28s ease, transform .32s cubic-bezier(.2,.7,.2,1), visibility .28s ease!important;
}

/* Show project name/type only on interaction */
.os-projects .os-project-slider .os-project-card:hover .os-card-meta,
.os-projects .os-project-slider .os-project-card:focus-within .os-card-meta,
.os-projects .os-project-slider .os-project-card.is-mobile-focus .os-card-meta,
.os-projects .os-project-slider .os-project-card:active .os-card-meta{
  opacity:1!important;
  visibility:visible!important;
  transform:translateY(0)!important;
}

/* Keep mobile safe: active/centered card can reveal text, inactive cards stay clean */
@media (hover:none){
  .os-projects .os-project-slider .os-project-card:hover img{
    transform:none!important;
  }

  .os-projects .os-project-slider .os-project-card.is-mobile-focus img,
  .os-projects .os-project-slider .os-project-card:active img{
    transform:scale(1.012)!important;
  }

  .os-projects .os-project-slider .os-project-card:hover .os-card-meta{
    opacity:0!important;
    visibility:hidden!important;
    transform:translateY(10px)!important;
  }

  .os-projects .os-project-slider .os-project-card.is-mobile-focus .os-card-meta,
  .os-projects .os-project-slider .os-project-card:active .os-card-meta{
    opacity:1!important;
    visibility:visible!important;
    transform:translateY(0)!important;
  }
}



/* Contact form AJAX status states */
.os-form-message[hidden]{
  display:none!important;
}

.os-form-message.is-error{
  background:rgba(130,30,22,.08)!important;
  border-color:rgba(130,30,22,.22)!important;
  color:#6f1f18!important;
}

.os-form-message.is-success{
  background:rgba(17,17,15,.05)!important;
  border-color:rgba(17,17,15,.16)!important;
  color:#11110f!important;
}

.os-submit:disabled{
  opacity:.56!important;
  cursor:wait!important;
}




/* V2 00 — Center PNG / Logo / Key Plan pattern — valid Gutenberg spacing fix */
.os-project-block-layout .oak-v2-centered-png-section,
.editor-styles-wrapper .oak-v2-centered-png-section{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  width:min(1280px,100%)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-block:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

.os-project-block-layout .oak-v2-centered-png-section > .oak-v2-centered-png-image,
.editor-styles-wrapper .oak-v2-centered-png-section > .oak-v2-centered-png-image{
  width:100%;
  max-width:100%;
  margin:0 auto!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-align:center!important;
}

.os-project-block-layout .oak-v2-centered-png-image img,
.editor-styles-wrapper .oak-v2-centered-png-image img{
  display:block;
  width:min(320px,100%);
  max-width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  margin:0 auto!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Front-end only: decorative centered PNG should never feel clickable. */
.os-project-block-layout .oak-v2-centered-png-image,
.os-project-block-layout .oak-v2-centered-png-image img{
  pointer-events:none!important;
  cursor:default!important;
}

/* Editor remains editable and resizable. */
.editor-styles-wrapper .oak-v2-centered-png-image,
.editor-styles-wrapper .oak-v2-centered-png-image img{
  pointer-events:auto!important;
  cursor:default!important;
}



/* Project Index iframe preview window clamp sizing only */
@media (min-width:761px){
  .oak-index-preview-iframe-mode .oak-index-preview-panel{
    width:clamp(1100px,84vw,1760px)!important;
    height:clamp(680px,86vh,1100px)!important;
    max-width:calc(100vw - 190px)!important;
    max-height:calc(100vh - 150px)!important;
  }

  .oak-index-preview-iframe-mode .oak-index-preview-frame-wrap,
  .oak-index-preview-iframe-mode .oak-index-preview-frame{
    width:100%!important;
    height:100%!important;
  }
}

/* Keep the mobile preview full-screen and untouched */
@media (max-width:760px){
  .oak-index-preview-iframe-mode .oak-index-preview-panel{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
  }
}



/* Home frame responsive width refinement */
:root{
  --os-home-frame:clamp(1600px,82vw,1800px);
}



/* Home frame responsive width refinement - actual page variable override */
.os-home-page{
  --os-home-frame:clamp(1600px,82vw,1800px)!important;
}



/* Home-only header/footer frame alignment with widened Home frame */
body.home .os-site-header .os-header-inner,
body.front-page .os-site-header .os-header-inner{
  width:min(clamp(1600px,82vw,1800px),100%)!important;
  max-width:clamp(1600px,82vw,1800px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:clamp(12px,2vw,28px)!important;
  padding-right:clamp(12px,2vw,28px)!important;
  box-sizing:border-box!important;
}

body.home .os-footer-inner,
body.front-page .os-footer-inner{
  width:min(clamp(1600px,82vw,1800px),100%)!important;
  max-width:clamp(1600px,82vw,1800px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:clamp(12px,2vw,28px)!important;
  padding-right:clamp(12px,2vw,28px)!important;
  box-sizing:border-box!important;
}

/* Fallback when WordPress body class differs but the Home main exists after header */
body:has(.os-home-page) .os-site-header .os-header-inner,
body:has(.os-home-page) .os-footer-inner{
  width:min(clamp(1600px,82vw,1800px),100%)!important;
  max-width:clamp(1600px,82vw,1800px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:clamp(12px,2vw,28px)!important;
  padding-right:clamp(12px,2vw,28px)!important;
  box-sizing:border-box!important;
}



/* Home frame 2K/4K scaling + correct header/footer alignment */
.os-home-page{
  --os-home-frame:clamp(1600px,70vw,2200px)!important;
}

/* Correct header class is .os-site-header-inner */
body.home .os-site-header .os-site-header-inner,
body.front-page .os-site-header .os-site-header-inner,
body:has(.os-home-page) .os-site-header .os-site-header-inner{
  width:min(clamp(1600px,70vw,2200px),100%)!important;
  max-width:clamp(1600px,70vw,2200px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:clamp(12px,2vw,28px)!important;
  padding-right:clamp(12px,2vw,28px)!important;
  box-sizing:border-box!important;
}

/* Footer follows the same Home frame */
body.home .os-footer-inner,
body.front-page .os-footer-inner,
body:has(.os-home-page) .os-footer-inner{
  width:min(clamp(1600px,70vw,2200px),100%)!important;
  max-width:clamp(1600px,70vw,2200px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:clamp(12px,2vw,28px)!important;
  padding-right:clamp(12px,2vw,28px)!important;
  box-sizing:border-box!important;
}



/* Global frame scaling trial: unify large-screen rhythm across the site */
:root{
  --os-global-frame:clamp(1600px,70vw,2200px);
  --os-global-inline-pad:clamp(12px,2vw,28px);
}

/* Keep Home using the same scaling formula */
.os-home-page{
  --os-home-frame:var(--os-global-frame)!important;
}

/* Header and footer unified across Home, About, Project Index, and Single Project */
.os-site-header .os-site-header-inner,
.os-footer-inner{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-global-inline-pad)!important;
  padding-right:var(--os-global-inline-pad)!important;
  box-sizing:border-box!important;
}

/* About page frame trial */
.os-about-page .os-about-inner,
.os-about-page .os-about-hero-inner,
.os-about-page .os-about-section,
.os-about-page .os-about-closeout-inner{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-global-inline-pad)!important;
  padding-right:var(--os-global-inline-pad)!important;
  box-sizing:border-box!important;
}

/* Project Index / Works frame trial */
.os-index-page .os-index-inner,
.os-index-page .os-index-hero-inner,
.os-index-page .os-index-gallery-inner,
.os-project-index .os-index-inner,
.os-project-index .os-index-hero-inner,
.os-project-index .os-index-gallery-inner{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-global-inline-pad)!important;
  padding-right:var(--os-global-inline-pad)!important;
  box-sizing:border-box!important;
}

/* Single project frame trial: keep media/full-bleed logic, only widen the content frame */
.os-single-project .os-project-inner,
.os-single-project .os-single-inner,
.os-single-project .os-single-hero-inner,
.os-single-project .os-project-body,
.os-single-project .entry-content,
.single-project .os-project-inner,
.single-project .os-single-inner,
.single-project .os-single-hero-inner,
.single-project .os-project-body,
.single-project .entry-content{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-global-inline-pad)!important;
  padding-right:var(--os-global-inline-pad)!important;
  box-sizing:border-box!important;
}

/* Avoid double-padding on explicitly full-width blocks inside project content */
.single-project .alignfull,
.os-single-project .alignfull{
  max-width:none!important;
}



/* Global frame scaling trial: sync inner/outer background shells with widened content */
.os-about-page .os-about-outer,
.os-about-page .os-about-bg-outer,
.os-about-page .os-about-shell,
.os-about-page .os-about-inner-bg,
.os-about-page .os-about-surface,
.os-about-page .os-about-main,
.os-index-page .os-index-outer,
.os-index-page .os-index-bg-outer,
.os-index-page .os-index-shell,
.os-index-page .os-index-inner-bg,
.os-index-page .os-index-surface,
.os-index-page .os-index-main,
.os-project-index .os-index-outer,
.os-project-index .os-index-bg-outer,
.os-project-index .os-index-shell,
.os-project-index .os-index-inner-bg,
.os-project-index .os-index-surface,
.os-project-index .os-index-main,
.os-single-project .os-single-outer,
.os-single-project .os-single-bg-outer,
.os-single-project .os-single-shell,
.os-single-project .os-single-inner-bg,
.os-single-project .os-single-surface,
.os-single-project .os-single-main,
.os-single-project .os-project-outer,
.os-single-project .os-project-bg-outer,
.os-single-project .os-project-shell,
.os-single-project .os-project-inner-bg,
.os-single-project .os-project-surface,
.single-project .os-single-outer,
.single-project .os-single-bg-outer,
.single-project .os-single-shell,
.single-project .os-single-inner-bg,
.single-project .os-single-surface,
.single-project .os-single-main,
.single-project .os-project-outer,
.single-project .os-project-bg-outer,
.single-project .os-project-shell,
.single-project .os-project-inner-bg,
.single-project .os-project-surface{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* Common inner background/surface classes used across the stable theme */
.os-page-inner,
.os-page-surface,
.os-page-shell,
.os-content-inner,
.os-content-surface,
.os-content-shell,
.os-main-inner,
.os-main-surface{
  max-width:var(--os-global-frame)!important;
}

/* Hero background inner frames on inner pages should follow the same global rhythm */
.os-about-page .os-about-hero-bg,
.os-about-page .os-about-hero-surface,
.os-about-page .os-about-hero-frame,
.os-index-page .os-index-hero-bg,
.os-index-page .os-index-hero-surface,
.os-index-page .os-index-hero-frame,
.os-project-index .os-index-hero-bg,
.os-project-index .os-index-hero-surface,
.os-project-index .os-index-hero-frame,
.os-single-project .os-single-hero-bg,
.os-single-project .os-single-hero-surface,
.os-single-project .os-single-hero-frame,
.single-project .os-single-hero-bg,
.single-project .os-single-hero-surface,
.single-project .os-single-hero-frame{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* If the previous fixed page width appears directly on background shells, override it in this trial */
.os-about-page [class*="inner"][style*="max-width"],
.os-index-page [class*="inner"][style*="max-width"],
.os-project-index [class*="inner"][style*="max-width"],
.os-single-project [class*="inner"][style*="max-width"],
.single-project [class*="inner"][style*="max-width"]{
  max-width:var(--os-global-frame)!important;
}



/* Global frame trial refinement: inner background frame + comfortable content inset */
:root{
  --os-global-bg-frame:clamp(1600px,70vw,2200px);
  --os-global-content-inset:clamp(28px,4vw,96px);
}

/* Inner page background/surface blocks align with the same header/footer frame */
.os-about-page .os-about-surface,
.os-about-page .os-about-main,
.os-about-page .os-about-inner-bg,
.os-about-page .os-about-shell,
.os-index-page .os-index-surface,
.os-index-page .os-index-main,
.os-index-page .os-index-inner-bg,
.os-index-page .os-index-shell,
.os-project-index .os-index-surface,
.os-project-index .os-index-main,
.os-project-index .os-index-inner-bg,
.os-project-index .os-index-shell,
.os-single-project .os-single-surface,
.os-single-project .os-single-main,
.os-single-project .os-single-inner-bg,
.os-single-project .os-single-shell,
.os-single-project .os-project-surface,
.os-single-project .os-project-main,
.os-single-project .os-project-inner-bg,
.os-single-project .os-project-shell,
.single-project .os-single-surface,
.single-project .os-single-main,
.single-project .os-single-inner-bg,
.single-project .os-single-shell,
.single-project .os-project-surface,
.single-project .os-project-main,
.single-project .os-project-inner-bg,
.single-project .os-project-shell{
  width:min(var(--os-global-bg-frame),100%)!important;
  max-width:var(--os-global-bg-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* Content inside the inner background gets a real inset, instead of starting at the surface edge */
.os-about-page .os-about-section,
.os-about-page .os-about-inner,
.os-about-page .os-about-closeout-inner,
.os-index-page .os-index-inner,
.os-index-page .os-index-gallery-inner,
.os-project-index .os-index-inner,
.os-project-index .os-index-gallery-inner,
.os-single-project .os-project-inner,
.os-single-project .os-single-inner,
.os-single-project .os-project-body,
.os-single-project .entry-content,
.single-project .os-project-inner,
.single-project .os-single-inner,
.single-project .os-project-body,
.single-project .entry-content{
  width:100%!important;
  max-width:var(--os-global-bg-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-global-content-inset)!important;
  padding-right:var(--os-global-content-inset)!important;
  box-sizing:border-box!important;
}

/* Hero inner content still follows the global frame, but keeps a lighter inset so titles do not drift too far */
.os-about-page .os-about-hero-inner,
.os-index-page .os-index-hero-inner,
.os-project-index .os-index-hero-inner,
.os-single-project .os-single-hero-inner,
.single-project .os-single-hero-inner{
  width:min(var(--os-global-bg-frame),100%)!important;
  max-width:var(--os-global-bg-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-global-inline-pad)!important;
  padding-right:var(--os-global-inline-pad)!important;
  box-sizing:border-box!important;
}

/* Avoid double inset for full-width media or explicit full-width Gutenberg blocks */
.single-project .alignfull,
.os-single-project .alignfull{
  margin-left:calc(var(--os-global-content-inset) * -1)!important;
  margin-right:calc(var(--os-global-content-inset) * -1)!important;
  max-width:none!important;
  width:calc(100% + (var(--os-global-content-inset) * 2))!important;
}



/* Global frame real wrapper fix: target actual stable page wrappers */
:root{
  --os-global-frame:clamp(1600px,70vw,2200px);
  --os-global-inline-pad:clamp(12px,2vw,28px);
}

/* Header / footer actual inner wrappers */
.os-site-header .os-site-header-inner,
.os-footer .os-footer-inner{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-global-inline-pad)!important;
  padding-right:var(--os-global-inline-pad)!important;
  box-sizing:border-box!important;
}

/* Home actual frame variable */
.os-home-page{
  --os-home-frame:var(--os-global-frame)!important;
}

/* Actual inner background/page wrappers from PHP:
   About: .os-about-frame
   Index: .os-index-frame
   Single project: .os-project-frame */
.os-about-page .os-about-frame,
.os-project-index-page .os-index-frame,
.single-project .os-project-frame,
.os-single-project .os-project-frame{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* The hero/background/content blocks inside those real wrappers should fill their wrapper */
.os-about-page .os-about-hero,
.os-project-index-page .os-index-hero,
.single-project .os-single-hero,
.os-single-project .os-single-hero{
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
}

/* Keep inner page content inset comfortable after the wrapper expands */
.os-about-page .os-about-section,
.os-about-page .os-about-logo-divider,
.os-about-page .os-about-philosophy,
.os-about-page .os-about-cta,
.os-project-index-page .os-index-gallery-section,
.single-project .os-project-block-layout,
.single-project .os-project-nav-section,
.os-single-project .os-project-block-layout,
.os-single-project .os-project-nav-section{
  padding-left:clamp(28px,4vw,96px)!important;
  padding-right:clamp(28px,4vw,96px)!important;
  box-sizing:border-box!important;
}

/* Single project inner block layout must follow the widened project frame */
.single-project .os-project-block-layout-inner,
.os-single-project .os-project-block-layout-inner{
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}



/* Single Project large-screen frame fix: hero + pattern content follow the widened project frame */
.single-project .os-project-frame,
.os-single-project .os-project-frame{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}

/* Hero media must fill the actual widened project frame, not the old visual cap */
.single-project .os-single-hero,
.os-single-project .os-single-hero{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;
}

.single-project .os-single-hero-picture,
.os-single-project .os-single-hero-picture,
.single-project .os-single-hero-picture img,
.os-single-project .os-single-hero-picture img,
.single-project .os-single-hero video,
.os-single-project .os-single-hero video{
  width:100%!important;
  max-width:none!important;
  min-width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}

/* Keep hero text centered over the widened media */
.single-project .os-single-hero-inner,
.os-single-project .os-single-hero-inner{
  width:min(var(--os-global-frame),100%)!important;
  max-width:var(--os-global-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--os-global-inline-pad)!important;
  padding-right:var(--os-global-inline-pad)!important;
  box-sizing:border-box!important;
}

/* Project block/pattern area follows the widened project frame */
.single-project .os-project-block-layout,
.os-single-project .os-project-block-layout{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;
}

.single-project .os-project-block-layout-inner,
.os-single-project .os-project-block-layout-inner{
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:clamp(28px,4vw,96px)!important;
  padding-right:clamp(28px,4vw,96px)!important;
  box-sizing:border-box!important;
}

/* Gutenberg blocks inside the project content should use the available widened frame */
.single-project .os-project-block-layout-inner > *,
.os-single-project .os-project-block-layout-inner > *{
  max-width:100%!important;
  box-sizing:border-box!important;
}

/* Wide/full blocks should not stay trapped by an older content width */
.single-project .os-project-block-layout-inner .alignwide,
.os-single-project .os-project-block-layout-inner .alignwide,
.single-project .os-project-block-layout-inner .alignfull,
.os-single-project .os-project-block-layout-inner .alignfull{
  width:100%!important;
  max-width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Project next/previous area follows the same content inset */
.single-project .os-project-nav-section,
.os-single-project .os-project-nav-section{
  width:100%!important;
  max-width:none!important;
  padding-left:clamp(28px,4vw,96px)!important;
  padding-right:clamp(28px,4vw,96px)!important;
  box-sizing:border-box!important;
}



/* Global surface frame alignment:
   Surface/background wrappers align to the actual visible header content edge,
   while header/footer keep the wider navigation frame. */
:root{
  --os-global-surface-frame:calc(var(--os-global-frame) - (var(--os-global-inline-pad) * 2));
}

/* Real inner background wrappers: About / Index / Single Project */
.os-about-page .os-about-frame,
.os-project-index-page .os-index-frame,
.single-project .os-project-frame,
.os-single-project .os-project-frame{
  width:min(var(--os-global-surface-frame),100%)!important;
  max-width:var(--os-global-surface-frame)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* Hero/background sections fill the surface frame exactly */
.os-about-page .os-about-hero,
.os-project-index-page .os-index-hero,
.single-project .os-single-hero,
.os-single-project .os-single-hero{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

/* Project page media follows the corrected surface frame */
.single-project .os-single-hero-picture,
.os-single-project .os-single-hero-picture,
.single-project .os-single-hero-picture img,
.os-single-project .os-single-hero-picture img{
  width:100%!important;
  max-width:none!important;
  min-width:100%!important;
  display:block!important;
  object-fit:cover!important;
}

/* Keep project content inside the corrected surface frame */
.single-project .os-project-block-layout,
.os-single-project .os-project-block-layout{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

.single-project .os-project-block-layout-inner,
.os-single-project .os-project-block-layout-inner{
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}



/* Single Project hero edge alignment:
   Let the hero touch the inner background edges like About and Project Index. */
body.single-project .os-project-frame,
.single-project .os-project-frame,
.os-single-project .os-project-frame{
  padding-left:0!important;
  padding-right:0!important;
}

/* Preserve the project page bottom breathing room from the old frame padding */
body.single-project .os-project-frame,
.single-project .os-project-frame,
.os-single-project .os-project-frame{
  padding-bottom:clamp(32px,4vw,70px)!important;
}

/* Hero fills the corrected inner background width */
body.single-project .os-single-hero,
.single-project .os-single-hero,
.os-single-project .os-single-hero{
  margin-left:0!important;
  margin-right:0!important;
  width:100%!important;
  max-width:none!important;
}

/* Keep the hero media flush with the hero boundaries */
body.single-project .os-single-hero-picture,
.single-project .os-single-hero-picture,
.os-single-project .os-single-hero-picture,
body.single-project .os-single-hero-picture img,
.single-project .os-single-hero-picture img,
.os-single-project .os-single-hero-picture img{
  width:100%!important;
  max-width:none!important;
  min-width:100%!important;
  display:block!important;
  object-fit:cover!important;
}

/* Project content keeps its internal inset after the hero */
body.single-project .os-project-block-layout-inner,
.single-project .os-project-block-layout-inner,
.os-single-project .os-project-block-layout-inner,
body.single-project .os-project-nav-section,
.single-project .os-project-nav-section,
.os-single-project .os-project-nav-section{
  padding-left:clamp(28px,4vw,96px)!important;
  padding-right:clamp(28px,4vw,96px)!important;
  box-sizing:border-box!important;
}



/* Contact anti-spam honeypot */
.os-contact-hp{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}



/* Tablet-size V2 targeted fix
   The issue is caused by WordPress Columns stacking above the theme mobile breakpoint.
   This range keeps mobile <=700px and desktop >1280px unchanged. */
@media (min-width:701px) and (max-width:1280px){
  /* Center V2 text even when the inserted block had desktop/left alignment. */
  body.single-project .os-project-block-layout :where(
    .oak-v2-section,
    .oak-v2-section p,
    .oak-v2-section h1,
    .oak-v2-section h2,
    .oak-v2-section h3,
    .oak-v2-section h4,
    .oak-v2-section h5,
    .oak-v2-section h6,
    .oak-v2-section .wp-block-heading,
    .oak-v2-section .has-text-align-left,
    .oak-v2-section .has-text-align-right,
    .oak-v2-section .has-text-align-center,
    .oak-v2-brief-response,
    .oak-v2-project-facts,
    .oak-v2-design-highlights,
    .oak-v2-detail-study-cards,
    .oak-v2-key-plan,
    .oak-v2-large-copy,
    .oak-v2-muted-text,
    .oak-v2-statement-text,
    .oak-v2-quote-text,
    .oak-v2-small-title,
    .oak-v2-eyebrow,
    .oak-v2-fact,
    .oak-v2-fact-value,
    .oak-v2-highlight,
    .oak-v2-detail-card,
    .oak-v2-palette-name
  ){
    text-align:center!important;
  }

  body.single-project .os-project-block-layout :where(
    .oak-v2-section p,
    .oak-v2-section h1,
    .oak-v2-section h2,
    .oak-v2-section h3,
    .oak-v2-section h4,
    .oak-v2-section h5,
    .oak-v2-section h6,
    .oak-v2-large-copy,
    .oak-v2-muted-text,
    .oak-v2-statement-text,
    .oak-v2-quote-text,
    .oak-v2-small-title,
    .oak-v2-eyebrow,
    .oak-v2-fact-value,
    .oak-v2-palette-name
  ){
    margin-left:auto!important;
    margin-right:auto!important;
  }

  /* Six image palette: force a real 3 x 2 grid on tablet-size screens. */
  body.single-project .os-project-block-layout .wp-block-columns.oak-v2-material-palette,
  body.single-project .os-project-block-layout .oak-v2-material-palette{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:1px!important;
    align-items:stretch!important;
    width:100%!important;
  }

  body.single-project .os-project-block-layout .oak-v2-material-palette > .wp-block-column{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:0 1 auto!important;
    flex-basis:auto!important;
    flex-grow:0!important;
    margin:0!important;
    padding:0!important;
  }

  body.single-project .os-project-block-layout .oak-v2-material-palette :where(.wp-block-image,.oak-v2-palette-image,.oak-v2-palette-item){
    width:100%!important;
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  body.single-project .os-project-block-layout .oak-v2-material-palette img,
  body.single-project .os-project-block-layout .oak-v2-palette-image img{
    width:100%!important;
    max-width:100%!important;
    height:100%!important;
    display:block!important;
    object-fit:cover!important;
  }

  /* Design Highlights: avoid a left-aligned stacked list; keep it balanced 2 x 2. */
  body.single-project .os-project-block-layout .wp-block-columns.oak-v2-design-highlights,
  body.single-project .os-project-block-layout .oak-v2-design-highlights{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:clamp(16px,3vw,28px)!important;
    align-items:stretch!important;
  }

  body.single-project .os-project-block-layout .oak-v2-design-highlights > .wp-block-column{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:0 1 auto!important;
    flex-basis:auto!important;
    margin:0!important;
  }

  body.single-project .os-project-block-layout .oak-v2-highlight{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    height:100%!important;
  }

  /* Detail cards: balanced 2 x 2, same idea as mobile but only in tablet range. */
  body.single-project .os-project-block-layout .wp-block-columns.oak-v2-detail-study-cards,
  body.single-project .os-project-block-layout .oak-v2-detail-study-cards{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:clamp(16px,3vw,28px)!important;
    align-items:stretch!important;
  }

  body.single-project .os-project-block-layout .oak-v2-detail-study-cards > .wp-block-column{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:0 1 auto!important;
    flex-basis:auto!important;
    margin:0!important;
  }

  body.single-project .os-project-block-layout .oak-v2-detail-card{
    align-items:center!important;
    text-align:center!important;
  }

  /* Matrix is already correct in the pattern; keep it protected in tablet-size range. */
  body.single-project .os-project-block-layout .wp-block-columns.oak-v2-matrix-row,
  body.single-project .os-project-block-layout .oak-v2-matrix-row{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:1px!important;
    flex-wrap:nowrap!important;
  }

  body.single-project .os-project-block-layout .oak-v2-matrix-row > .wp-block-column{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:0 1 auto!important;
    flex-basis:auto!important;
    margin:0!important;
    padding:0!important;
  }
}



/* Mobile V2 Design Highlights: 2x2 equal cards */
@media (max-width:700px){
  .os-project-block-layout .oak-v2-design-highlights,
  .os-project-block-layout .wp-block-columns.oak-v2-design-highlights{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:1px!important;
    align-items:stretch!important;
  }

  .os-project-block-layout .oak-v2-design-highlights > .wp-block-column,
  .editor-styles-wrapper .oak-v2-design-highlights > .wp-block-column{
    width:100%!important;
    max-width:100%!important;
    flex:initial!important;
    flex-basis:auto!important;
    flex-grow:0!important;
    flex-shrink:1!important;
    min-width:0!important;
    margin:0!important;
    display:flex!important;
  }

  .os-project-block-layout .oak-v2-design-highlights .oak-v2-highlight{
    min-height:clamp(178px,42vw,240px)!important;
    height:100%!important;
    padding:clamp(18px,5vw,28px)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    text-align:center!important;
    box-sizing:border-box!important;
  }

  .os-project-block-layout .oak-v2-design-highlights .oak-v2-small-title,
  .os-project-block-layout .oak-v2-design-highlights .oak-v2-muted-text{
    text-align:center!important;
    max-width:100%!important;
  }

  .os-project-block-layout .oak-v2-design-highlights .oak-v2-small-title{
    font-size:clamp(18px,5.2vw,23px)!important;
    line-height:1.05!important;
    margin-bottom:clamp(10px,3vw,14px)!important;
  }

  .os-project-block-layout .oak-v2-design-highlights .oak-v2-muted-text{
    font-size:clamp(13px,3.7vw,15px)!important;
    line-height:1.55!important;
  }
}



/* Mobile / tablet-portrait Design Highlights real-content fallback.
   Some already-inserted posts may keep .oak-v2-highlight inside the columns,
   but lose or alter the outer .oak-v2-design-highlights class.
   This targets the real inserted content by detecting .oak-v2-highlight. */
@media (max-width:700px), (min-width:701px) and (max-width:1280px) and (orientation:portrait){
  body.single-project .os-project-block-layout .wp-block-columns:has(.oak-v2-highlight),
  body.single-project .os-project-block-layout .oak-v2-section > .wp-block-columns:has(.oak-v2-highlight),
  body.single-project .os-project-block-layout .oak-v2-design-highlights{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:1px!important;
    column-gap:1px!important;
    row-gap:1px!important;
    align-items:stretch!important;
    width:100%!important;
    max-width:100%!important;
  }

  body.single-project .os-project-block-layout .wp-block-columns:has(.oak-v2-highlight) > .wp-block-column,
  body.single-project .os-project-block-layout .oak-v2-section > .wp-block-columns:has(.oak-v2-highlight) > .wp-block-column,
  body.single-project .os-project-block-layout .oak-v2-design-highlights > .wp-block-column{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:initial!important;
    flex-basis:auto!important;
    flex-grow:0!important;
    flex-shrink:1!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
  }

  body.single-project .os-project-block-layout .wp-block-columns:has(.oak-v2-highlight) .oak-v2-highlight,
  body.single-project .os-project-block-layout .oak-v2-design-highlights .oak-v2-highlight{
    width:100%!important;
    max-width:100%!important;
    min-height:clamp(190px,46vw,260px)!important;
    height:100%!important;
    padding:clamp(18px,5vw,28px)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    text-align:center!important;
    box-sizing:border-box!important;
  }

  body.single-project .os-project-block-layout .wp-block-columns:has(.oak-v2-highlight) .oak-v2-small-title,
  body.single-project .os-project-block-layout .wp-block-columns:has(.oak-v2-highlight) .oak-v2-muted-text,
  body.single-project .os-project-block-layout .oak-v2-design-highlights .oak-v2-small-title,
  body.single-project .os-project-block-layout .oak-v2-design-highlights .oak-v2-muted-text{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
    max-width:100%!important;
  }

  body.single-project .os-project-block-layout .wp-block-columns:has(.oak-v2-highlight) .oak-v2-small-title,
  body.single-project .os-project-block-layout .oak-v2-design-highlights .oak-v2-small-title{
    font-size:clamp(18px,5vw,23px)!important;
    line-height:1.08!important;
    margin-bottom:clamp(10px,3vw,14px)!important;
  }

  body.single-project .os-project-block-layout .wp-block-columns:has(.oak-v2-highlight) .oak-v2-muted-text,
  body.single-project .os-project-block-layout .oak-v2-design-highlights .oak-v2-muted-text{
    font-size:clamp(13px,3.6vw,15px)!important;
    line-height:1.55!important;
  }
}