/* Brand views only: the commerce and contact drawers retain their own geometry. */
.takura-panel:is([data-view=about],[data-view=philosophy]) {
 inset:32px; margin:auto; width:min(1180px,calc(100vw - 64px)); max-width:calc(100vw - 64px);
 height:fit-content; max-height:min(960px,calc(100dvh - 64px)); border-radius:20px;
}
.takura-panel:is([data-view=about],[data-view=philosophy])[open] { display:flex; flex-direction:column; overflow:hidden; }
.takura-panel:is([data-view=about],[data-view=philosophy]) header { padding:28px 48px; border-color:rgba(61,91,136,.16); }
.takura-panel:is([data-view=about],[data-view=philosophy]) .panel-body { flex:0 1 auto; padding:56px 48px 48px; overflow:auto; }
/* About uses the same reading column, with its collection action below the intro. */
.takura-panel[data-view=about] { width:min(1000px,calc(100vw - 64px)); }
.about-editorial .about-collections { width:fit-content; min-height:56px; margin-top:32px; padding:16px 24px; justify-content:center; font-size:16px; background:var(--ui-cta-fill); border-color:var(--ui-cta-fill); }
.about-editorial .about-collections:hover { background:var(--ui-cta-hover); border-color:var(--ui-cta-hover); }

/* The landscape stays quiet beneath a single scrolling text column. */
.takura-panel[data-view=philosophy] { width:min(1000px,calc(100vw - 64px)); height:min(840px,calc(100dvh - 64px)); }
.takura-panel[data-view=philosophy]::before { content:''; position:absolute; left:0; right:0; bottom:0; height:60%; opacity:.16; filter:grayscale(1) brightness(.7); pointer-events:none; background-image:linear-gradient(to bottom,var(--ui-panel),transparent 50%,var(--ui-panel)),linear-gradient(to right,var(--ui-panel),transparent 28%,transparent 72%,var(--ui-panel)),url('../assets/hero/bg_bluehour_sanctuary.jpg'); background-size:cover; background-position:center 64%; }
.takura-panel[data-view=philosophy] header { position:relative; z-index:1; border-bottom-color:rgba(61,91,136,.16); }
.takura-panel[data-view=philosophy] .panel-body { --reader-bottom-space:56px; position:relative; z-index:1; flex:1; overflow-y:scroll; padding-bottom:var(--reader-bottom-space); scrollbar-gutter:stable; scrollbar-width:thin; scrollbar-color:transparent transparent; transition:scrollbar-color .2s ease; -webkit-mask-image:linear-gradient(to bottom,transparent,#000 16px,#000 calc(100% - 224px + var(--reader-fade-shift,0px)),rgba(0,0,0,.75) calc(100% - 180px + var(--reader-fade-shift,0px)),rgba(0,0,0,.18) calc(100% - 104px + var(--reader-fade-shift,0px)),transparent calc(100% - 64px + var(--reader-fade-shift,0px)),transparent); mask-image:linear-gradient(to bottom,transparent,#000 16px,#000 calc(100% - 224px + var(--reader-fade-shift,0px)),rgba(0,0,0,.75) calc(100% - 180px + var(--reader-fade-shift,0px)),rgba(0,0,0,.18) calc(100% - 104px + var(--reader-fade-shift,0px)),transparent calc(100% - 64px + var(--reader-fade-shift,0px)),transparent); }
.takura-panel[data-view=philosophy] .panel-body::-webkit-scrollbar { width:5px; }
.takura-panel[data-view=philosophy] .panel-body::-webkit-scrollbar-track { background:transparent; }
.takura-panel[data-view=philosophy] .panel-body::-webkit-scrollbar-thumb { background:transparent; border-radius:5px; transition:background-color .2s ease; }
.takura-panel[data-view=philosophy] .panel-body::-webkit-scrollbar-button { display:none; width:0; height:0; }
.takura-panel[data-view=philosophy] .panel-body.is-scrolling { scrollbar-color:rgba(167,179,198,.38) transparent; }
.takura-panel[data-view=philosophy] .panel-body.is-scrolling::-webkit-scrollbar-thumb { background:rgba(167,179,198,.38); }
.takura-panel[data-view=philosophy] .panel-body:focus-visible { outline:none; }
.about-editorial,.philosophy-editorial { position:relative; color:var(--ui-ink); }
.about-editorial h1,.philosophy-editorial h1 { margin:0 0 28px; font:400 54px/1.12 var(--font-serif); letter-spacing:-.025em; }
.about-editorial p,.philosophy-editorial p { max-width:820px; margin:0; color:var(--ui-muted); font:18px/1.75 var(--font-sans); }
.philosophy-editorial p+p { margin-top:28px; }
@media(max-width:760px) {
 .takura-panel:is([data-view=about],[data-view=philosophy]) { inset:12px; width:calc(100vw - 24px); max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); border-radius:16px; }
 .takura-panel:is([data-view=about],[data-view=philosophy]) header { padding:22px 24px; }
 .takura-panel:is([data-view=about],[data-view=philosophy]) h2 { font-size:24px; }
 .takura-panel:is([data-view=about],[data-view=philosophy]) .panel-body { padding:32px 24px var(--reader-bottom-space,32px); }
 .about-editorial h1,.philosophy-editorial h1 { font-size:42px; margin-bottom:24px; }
 .about-editorial p,.philosophy-editorial p { font-size:16px; }
 .takura-panel[data-view=philosophy] { height:calc(100dvh - 24px); }
 .about-editorial .about-collections { width:100%; margin-top:24px; }
}
@media(max-width:350px) {
 .takura-panel:is([data-view=about],[data-view=philosophy]) header { padding:20px; }
 .takura-panel:is([data-view=about],[data-view=philosophy]) .panel-body { padding:28px 20px var(--reader-bottom-space,28px); }
 .about-editorial h1,.philosophy-editorial h1 { font-size:36px; }
}
@media(prefers-reduced-motion:reduce) {
 .takura-panel[data-view=philosophy] .panel-body,.takura-panel[data-view=philosophy] .panel-body::-webkit-scrollbar-thumb { transition:none; }
}

/* Let WebKit's custom thumb own its styling so native arrow buttons never appear. */
@supports selector(::-webkit-scrollbar) {
 .takura-panel[data-view=philosophy] .panel-body,
 .takura-panel[data-view=philosophy] .panel-body.is-scrolling { scrollbar-width:auto; scrollbar-color:auto; }
 .takura-panel[data-view=philosophy] .panel-body::-webkit-scrollbar-button:single-button,
 .takura-panel[data-view=philosophy] .panel-body::-webkit-scrollbar-button:double-button { display:none; width:0; height:0; }
}
