/* Tenant website designs. No changes to company workspace or platform branding. */
body:is([data-template=studio],[data-template=cards],[data-template=prestige]){background:#f3f5f3;--ink:#183e36;--muted:#657b73}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) #app>header{width:calc(100% - 40px);max-width:1280px;margin:20px auto;background:#ffffffed;border:1px solid #dfe7e2;border-radius:24px;padding:18px 25px;gap:20px;box-sizing:border-box}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) main{max-width:1320px;margin:auto;padding:0 20px;box-sizing:border-box}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) main>section{max-width:100%;box-sizing:border-box;scroll-margin-top:25px}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero{border-radius:32px;overflow:hidden;margin:0 auto 35px;padding:54px;min-height:530px;box-sizing:border-box;gap:35px}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero-copy{min-width:0;position:relative;z-index:2}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero h1{font-size:clamp(32px,4.3vw,60px);line-height:1.35;overflow-wrap:anywhere;letter-spacing:normal}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero p{line-height:1.9}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .actions{flex-wrap:wrap;gap:12px}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero-art{min-width:0;border-radius:24px;background:linear-gradient(0deg,#122e2422,#ffffff11),url('/site-assets/q1-architecture-20261025.png') center/cover no-repeat;min-height:370px}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero-art :is(.sun,.building,.tree,.art-label,.art-bottom,.art-card){display:none}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero-photo{width:100%;height:100%;min-height:370px;object-fit:cover;border-radius:inherit}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .service{background:#fff;border:1px solid #dde7e1;border-radius:22px;padding:28px;min-width:0;box-shadow:0 8px 30px #173d3405}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .service h3{line-height:1.6;overflow-wrap:anywhere}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) :is(.about,.apply,.contact){border-radius:28px;padding:40px;background:#fff;border:1px solid #dfe7e2;margin:30px 0}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .apply form{min-width:0;width:100%;box-sizing:border-box}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) :is(input,select,textarea){max-width:100%;box-sizing:border-box}
body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero-benefits{display:flex;flex-wrap:wrap;gap:10px;font-size:12px}
/* Panoramic photo with a readable glass card, inspired by the public Q1 site. */
body[data-template=studio] .hero{position:relative;display:flex;align-items:center;background:#dce5dc;isolation:isolate;min-height:590px}
body[data-template=studio] .hero-art{position:absolute;inset:0;border-radius:0;z-index:0;height:100%;min-height:100%}
body[data-template=studio] .hero-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#102e3012,#102e3045);pointer-events:none}
body[data-template=studio] .hero-copy{width:56%;max-width:600px;background:#ffffffed;backdrop-filter:blur(12px);border:1px solid #fff9;border-radius:26px;padding:35px;box-sizing:border-box}
body[data-template=studio] .hero-copy p{color:#536e62}
body[data-template=studio] .hero-benefits{padding-top:12px;border-top:1px solid #dbe5de}
body[data-template=studio] .service-grid{gap:18px}
/* Light card layout, distinct from the photo-led design. */
body[data-template=cards] .hero{background:linear-gradient(125deg,#e4efe7,#fbfcf8);border:1px solid #d8e6dc;display:grid;grid-template-columns:1.15fr 1fr}
body[data-template=cards] .hero-art{box-shadow:12px 12px 0 #ffffffb8;border:6px solid #fff}
body[data-template=cards] .hero-benefits span{background:white;border-radius:12px;padding:10px}
body[data-template=cards] .service-number{background:#edf5ef;border-radius:14px;width:45px;height:45px;display:grid;place-items:center;color:var(--brand)}
body[data-template=cards] .steps>div{background:#f5f8f3;border:1px solid #e3eadf;border-radius:15px;padding:18px}
/* Dark hero, light content and forms. */
body[data-template=prestige] .hero{display:grid;grid-template-columns:1.2fr 1fr;background:radial-gradient(ellipse at top right,#245a52,#102d31 70%);color:#fff}
body[data-template=prestige] .hero :is(h1,.eyebrow){color:#fff}
body[data-template=prestige] .hero p{color:#d0e2dc}
body[data-template=prestige] .hero .button.secondary{color:#fff;border-color:#ffffff70;background:#ffffff0d}
body[data-template=prestige] .hero-art{border-radius:90px 24px 24px 24px;border:1px solid #ffffff55}
body[data-template=prestige] .hero-benefits{color:#c9e2d7}
body[data-template=prestige] .service{border-top:3px solid var(--brand)}
/* Editor thumbnails reflect the actual layout. */
.thumb-studio{background:linear-gradient(90deg,#52645488,#e7e9d788),url('/site-assets/q1-architecture-20261025.png') center/cover!important}.thumb-studio .mini-hero>div{background:#fffc;border-radius:9px;padding:10px}.thumb-studio .mini-hero figure{opacity:0}.thumb-cards{background:#edf5ec!important}.thumb-cards .mini-hero figure{background:#b5cbbb;border-radius:16px;box-shadow:5px 5px white}.thumb-cards .mini-services i{border-radius:10px;background:white}.thumb-prestige{background:#143b3e!important}.thumb-prestige .mini-hero b{background:#eef5e9!important}.thumb-prestige .mini-hero figure{background:#96afa0;border-radius:30px 8px 8px 8px}.thumb-prestige .mini-services i{background:#ffffffd9}
@media(max-width:760px){
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) #app>header{width:calc(100% - 24px);margin:12px auto;padding:15px;border-radius:19px;flex-wrap:wrap;justify-content:space-between}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) #app>header nav{width:100%;order:3;display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) main{padding:0 12px}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero{display:flex;flex-direction:column;padding:24px 19px;min-height:0;gap:25px;border-radius:23px;margin-bottom:15px}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero h1{font-size:32px}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero-art{width:100%;height:260px;min-height:260px;box-sizing:border-box}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .hero-photo{min-height:260px}
 body[data-template=studio] .hero{padding:140px 14px 18px;align-items:stretch}
 body[data-template=studio] .hero-copy{width:100%;padding:24px 20px}
 body[data-template=studio] .hero-art{height:100%;min-height:100%}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) :is(.service-grid,.about,.apply){grid-template-columns:minmax(0,1fr)}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) :is(.about,.apply,.contact){padding:24px 19px;margin:18px 0;border-radius:21px}
 body:is([data-template=studio],[data-template=cards],[data-template=prestige]) .service{padding:24px}
}
