/* PDP R9: controlled design fixes built from the working R7 base, not R8. */
/* Layout rhythm: reduce whitespace enough to be visually distinct. */
.section{padding-block:42px;}
.section.intro{padding-block:46px;}
.heading-row{margin-bottom:20px;gap:14px;}
.section-head .eyebrow{margin-bottom:7px;}
.section-head p{margin:10px 0;}
.source-note{margin-bottom:18px;}
.facts{margin-top:25px;padding-top:20px;}
.projects-grid{gap:22px 26px;}
.service-list{gap:10px;}
.service-list>a{padding:15px 20px;min-height:120px;}
.service-detail-signature{padding:19px 23px;}
.service-detail-list{gap:10px;}
.process{margin-top:28px;}
.lifecycle.section{padding-block:48px;}
.cta{padding-block:49px;}
footer{padding-top:47px;}
.footer-bottom{margin-top:30px;}
.page-hero{padding-block:43px;}
.about-hero{padding-top:43px;}
.about-hero-main{padding-bottom:32px;}
.about-hero-rail span{padding-block:11px;}
.about-history{gap:5%;}
.about-history-mark{margin-top:22px;}
.history-track{margin-top:22px;gap:10px;}
.clients-head{margin-bottom:21px;}
.principles{margin-top:25px;gap:22px;}
.journal-empty{padding-block:30px 10px;}
.section-head h2{font-size:clamp(29px,3vw,43px);}

/* Make the supplied logo stable on a 96px navigation bar. Do not squeeze its square lockup. */
header{height:96px;}
header .brand{min-width:0;gap:10px;}
.brand .logo-mark{
  width:106px;height:70px;flex:0 0 106px;
  border:0;border-radius:0;background:transparent;box-shadow:none;
  padding:0;overflow:visible;display:flex;align-items:center;justify-content:center;
}
.brand .logo-mark .official-logo{
  width:100%;height:100%;display:block;object-fit:contain;
}
.brand>span{font-size:13px;line-height:1.75;font-weight:800;min-width:118px;border-inline-start:2px solid #d9e5f5;padding-inline-start:11px;}
/* The full bilingual artwork remains visible in the footer and About page. */
.footer-brand img{
  display:block;width:164px;height:164px;object-fit:contain;object-position:center;
  background:#fff;padding:5px;border-radius:18px 5px 18px 5px;
  filter:none;box-shadow:0 12px 28px rgba(0,0,0,.2);
}
.footer-brand-caption{font-size:10px;}
.about-monogram{align-items:center;justify-content:center;min-height:225px;padding:12px;background:rgba(255,255,255,.07);}
.about-monogram .about-identity-full{
  display:block;width:214px;max-width:100%;height:214px;max-height:none;
  padding:6px;object-fit:contain;object-position:center;
  background:#fff;border-radius:18px 5px 18px 5px;
  filter:none;box-shadow:0 10px 25px rgba(4,20,42,.15);
}
.about-monogram small,.about-monogram i{display:none;}

/* Project-gallery cards: softer cut-corner frames; less rectangular but still very clear. */
.project-card{
  display:flex;flex-direction:column;height:100%;overflow:visible;
  background:transparent;border:0;border-radius:0;
  box-shadow:none;transform:none;transition:none;
}
.project-card:hover{transform:none;box-shadow:none;border-color:transparent;}
.project-frame{position:relative;padding:6px 18px 16px 0;isolation:isolate;flex:0 0 auto;}
html[dir=rtl] .project-frame{padding:6px 0 16px 18px;}
.project-frame::before{
  content:'';position:absolute;top:10px;bottom:2px;left:12px;right:0;
  border:1.5px solid #c8d8ee;
  clip-path:polygon(0 0,87% 0,100% 13%,100% 100%,13% 100%,0 87%);
  background:linear-gradient(145deg,#edf4fd,#dce8f7);
  box-shadow:0 10px 22px rgba(16,42,86,.08);
  z-index:-1;
}
.project-frame::after{
  content:'';position:absolute;bottom:3px;inset-inline-end:2px;
  width:86px;height:5px;background:linear-gradient(90deg,#f39200,#ffd08a);
  transform:skewX(-28deg);box-shadow:0 4px 10px rgba(243,146,0,.18);z-index:3;
}
.project-art{
  position:relative;aspect-ratio:1.68;margin:0;border:0;padding:0;
  clip-path:polygon(0 0,89% 0,100% 11%,100% 100%,11% 100%,0 89%);
  isolation:isolate;transform:translateZ(0);
  box-shadow:0 10px 26px rgba(5,26,56,.14);
  background:#173760;
}
.project-art::before{
  content:'';position:absolute;inset:10px;z-index:2;
  clip-path:polygon(0 0,88% 0,100% 10%,100% 100%,10% 100%,0 90%);
  border:1px solid rgba(255,255,255,.48);
  background:none;pointer-events:none;
}
.project-art::after{background:linear-gradient(180deg,rgba(0,0,0,.09),transparent 38%,rgba(3,24,54,.76));z-index:1;}
.project-photo{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.21,.72,.21,.99),filter .45s;}
.project-card:hover .project-photo{transform:scale(1.055);filter:saturate(1.06);}
.project-art .art-label{
  z-index:3;top:22px;inset-inline-start:20px;
  background:rgba(255,255,255,.95);color:#173f82;border:1px solid rgba(25,65,137,.14);
  border-radius:999px;padding:9px 13px;font-weight:800;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
}
.project-art .art-index{z-index:3;inset-inline-start:24px;bottom:63px;font-size:50px;color:#fff;text-shadow:0 4px 18px rgba(1,28,60,.52);}
.project-art .art-note{z-index:3;inset-inline-end:22px;bottom:66px;max-width:56%;color:#f2f7ff;text-shadow:0 1px 6px rgba(2,20,42,.78);}
.project-caption{
  position:relative;z-index:4;display:flex;flex-direction:column;flex:1 1 auto;
  width:calc(100% - 48px);min-height:154px;
  margin-top:-40px;margin-inline:24px 0;padding:22px 24px 17px;
  border:1px solid #d7e3f3;border-inline-start:4px solid var(--orange);
  border-radius:20px 8px 20px 8px;
  background:linear-gradient(130deg,#fff 0%,#f3f8fe 100%);
  box-shadow:0 14px 29px rgba(13,47,95,.13);
  transition:transform .3s,box-shadow .3s,background .3s;
}
.project-caption::before{
  content:'';position:absolute;width:46px;height:3px;
  background:var(--blue);top:0;inset-inline-start:21px;
}
.project-caption>span{font-size:13px;}
.project-caption h3{font-size:21px;font-weight:700;line-height:1.58;margin-top:7px;}
.project-open{font-size:14px;margin-top:auto;padding-top:10px;padding-bottom:3px;border-bottom:0;}
.project-open b{display:grid;place-items:center;width:29px;height:29px;background:#e2eaf7;border-radius:50%;}
.project-card:hover .project-caption{
  transform:translateY(-4px);box-shadow:0 18px 34px rgba(13,47,95,.16);
  background:#fff;
}
.featured .project-card:nth-child(2n){padding-top:0;}
.detail-cover{overflow:hidden;clip-path:polygon(0 0,90% 0,100% 11%,100% 100%,10% 100%,0 90%);}
.detail-cover img{clip-path:polygon(0 0,90% 0,100% 11%,100% 100%,10% 100%,0 90%);}

/* Smaller viewport: preserve all content and readable logo. */
@media(min-width:1001px) and (max-width:1400px){
  header{gap:12px;padding-inline:2%;}
  .brand .logo-mark{width:83px;height:62px;flex-basis:83px;}
  .brand>span{font-size:11.5px;min-width:105px;padding-inline-start:8px;}
  nav a,html[dir=ltr] nav a{font-size:13px;padding-inline:5px;}
  .header-actions{gap:8px;}
}
@media(max-width:1000px){
  header{height:88px;}
  nav{top:88px;}
  .section{padding-block:41px;}
  .section.intro{padding-block:43px;}
  .brand .logo-mark{width:83px;height:62px;flex-basis:83px;}
  .brand>span{font-size:11.5px;}
  .project-art{aspect-ratio:1.52;}
  .project-caption{min-height:145px;}
  .about-hero-signature{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .about-monogram .about-identity-full{width:190px;height:190px;}
}
@media(max-width:650px){
  header{height:80px;}
  nav{top:80px;}
  .section{padding-block:32px;}
  .section.intro{padding-block:35px;}
  .heading-row{margin-bottom:16px;}
  .projects-grid{gap:22px;}
  .brand .logo-mark{width:64px;height:53px;flex-basis:64px;}
  .brand>span{font-size:10px;min-width:0;line-height:1.65;}
  .service-list>a{padding:14px 15px;}
  .project-frame{padding-bottom:12px;}
  .project-art{aspect-ratio:1.5;}
  .project-art::before{inset:9px;}
  .project-art .art-index{font-size:42px;bottom:59px;}
  .project-art .art-note{font-size:10px;bottom:62px;}
  .project-caption{min-height:125px;padding:19px 18px 15px;margin-top:-33px;width:calc(100% - 34px);margin-inline-start:18px;}
  .project-caption h3{font-size:20px;}
  .about-hero{padding-top:30px;}
  .about-hero-signature{grid-template-columns:1fr;}
  .about-monogram{min-height:auto;}
  .about-monogram .about-identity-full{width:177px;height:177px;}
  .about-hero-facts{gap:8px;}
  .about-hero-rail span{padding-block:8px;}
  .footer-brand img{width:142px;height:142px;}
  .page-hero{padding-block:35px;}
}
@media(max-width:360px){
  .brand .logo-mark{width:55px;height:49px;flex-basis:55px;}
  .brand>span{font-size:9px;}
  .project-art .art-note{max-width:62%;}
}
@media(prefers-reduced-motion:reduce){
  .project-photo,.project-caption{transition:none!important;}
}


/* R12: remove overlay PDP labels from project photos */
.project-frame-label,.project-art .art-label{display:none !important;}