/* demo56 "Talinda Comp Card": a model's profile built round a comp card that flips. */
.p-demo56 { --coral:#f5935f; --deep:#0f2a1a; --cream:#f7f1e6; --ink:#14211a; --green:#2f7d43; --edge:clamp(16px,3vw,48px); background:var(--cream); }
.p-demo56 .main { padding:0; }
.p-demo56 .header { background:var(--deep); }
.p-demo56 .header::before { display:none; }
.tc { color:var(--ink); font-family:"Schibsted Grotesk",system-ui,sans-serif; overflow-x:clip; }
.tc :where(*) { color:inherit; }
.tc :where(h1,h2,p,dl,dd,dt,figure,ol) { margin:0; padding:0; }
.tc img { display:block; width:100%; height:100%; object-fit:cover; }
.tc-hero { position:relative; min-height:calc(100svh - 70px); background:var(--coral); padding:clamp(16px,2.5vw,36px) var(--edge); display:grid; grid-template-columns:minmax(280px,30vw) minmax(0,1fr); grid-template-rows:auto 1fr; column-gap:clamp(20px,3vw,48px); overflow:hidden; }
.tc-name { grid-area:1/2/2/3; display:flex; flex-direction:column; font-size:clamp(84px,14.4vw,300px); font-weight:900; line-height:.84; letter-spacing:-.06em; color:var(--deep)!important; }
.tc-card { grid-area:1/1/3/2; z-index:2; aspect-ratio:2/3; max-height:calc(100svh - 110px); perspective:1600px; cursor:pointer; align-self:center; justify-self:center; width:100%; }
.tc-card__in { position:relative; width:100%; height:100%; transform-style:preserve-3d; transition:transform .9s cubic-bezier(.65,0,.2,1); }
.tc-card[aria-pressed=true] .tc-card__in { transform:rotateY(180deg); }
.tc-face { position:absolute; inset:0; backface-visibility:hidden; background:var(--cream); padding:10px; display:flex; flex-direction:column; box-shadow:0 40px 70px -30px #0f2a1abf; }
.tc-face img { flex:1; min-height:0; }
.tc-face--f p { display:flex; justify-content:space-between; padding-top:9px; font-size:14px; font-weight:700; }
.tc-face--f i { font-style:normal; color:var(--green); }
.tc-face--b { transform:rotateY(180deg); padding:22px; background:var(--deep); color:var(--cream); }
.tc-face--b h2 { font-size:clamp(30px,3vw,48px); font-weight:900; letter-spacing:-.03em; line-height:1; margin-bottom:auto; }
.tc-face--b dl div { display:flex; justify-content:space-between; align-items:baseline; padding:9px 0; border-top:1px solid #f7f1e640; }
.tc-face--b dt { font-size:14px; }
.tc-face--b dd { font-size:clamp(20px,1.8vw,28px); font-weight:700; }
.tc-face--b>p { margin-top:14px; font-size:14px; font-weight:700; color:var(--coral); }
.tc-side { grid-area:2/2/3/3; align-self:end; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px 32px; align-items:start; padding-top:24px; font-size:17px; line-height:1.4; font-weight:500; }
.tc-role { font-weight:700; }
.tc-open { display:flex; align-items:center; gap:8px; font-weight:700; }
.tc-open i { width:10px; height:10px; border-radius:50%; background:var(--deep); box-shadow:0 0 0 4px #0f2a1a33; }
.tc-acts { display:flex; flex-wrap:wrap; gap:8px; }
.tc-btn { display:inline-flex; align-items:center; min-height:44px; padding:0 20px; border-radius:99px; border:1.5px solid var(--deep); background:none; color:var(--deep); font:700 15px "Schibsted Grotesk",sans-serif; text-decoration:none; cursor:pointer; transition:background .2s,color .2s; }
.tc-btn:hover,.tc-btn--on { background:var(--deep); color:var(--cream); }
.tc-nums { display:flex; gap:22px; }
.tc-nums dd { font-size:26px; font-weight:900; line-height:1; }
.tc-nums dt { font-size:13px; }
.tc-book { padding:clamp(60px,8vw,120px) var(--edge); }
.tc-book header { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:10px; margin-bottom:30px; }
.tc h2 { font-size:clamp(44px,7vw,110px); font-weight:900; letter-spacing:-.045em; line-height:1; }
.tc-face--b h2 { font-size:clamp(30px,3vw,48px); }
.tc-book__g { display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(10px,1.4vw,22px); align-items:start; }
.tc-book figure { will-change:transform; }
.tc-book figure img { aspect-ratio:4/5; height:auto; }
.tc-book figcaption { padding-top:8px; font-size:14px; font-weight:500; }
.w1 { grid-column:1/6; } .w2 { grid-column:7/13; margin-top:12vw!important; } .w3 { grid-column:2/5; margin-top:-8vw!important; } .w4 { grid-column:5/9; margin-top:4vw!important; } .w5 { grid-column:9/13; margin-top:-2vw!important; }
.tc-avail { background:var(--deep); color:var(--cream); padding:clamp(50px,7vw,100px) var(--edge); }
.tc-avail__l { margin:8px 0 26px!important; font-size:18px; }
.tc-days { display:grid; grid-template-columns:repeat(15,1fr); gap:6px; }
.tc-days button { aspect-ratio:1; border:0; border-radius:50%; background:var(--green); color:#fff; font:700 clamp(13px,1.4vw,20px) "Schibsted Grotesk",sans-serif; cursor:pointer; transition:transform .2s,background .2s; }
.tc-days button:hover:not(:disabled) { transform:scale(1.12); }
.tc-days button.is-on { background:var(--coral); color:var(--deep); }
.tc-days button:disabled { background:none; color:#f7f1e6a6; box-shadow:inset 0 0 0 1px #f7f1e640; cursor:not-allowed; }
.tc-days__msg { min-height:28px; margin-top:16px!important; font-size:18px; font-weight:700; color:var(--coral); }
.tc-credits { padding:clamp(60px,8vw,120px) var(--edge); }
.tc-credits ol { list-style:none; margin-top:26px; }
.tc-credits li { display:grid; grid-template-columns:3fr 3fr 4fr auto; gap:14px; align-items:baseline; padding:15px 0; border-top:1.5px solid var(--ink); }
.tc-credits strong { font-size:clamp(20px,2vw,28px); font-weight:900; letter-spacing:-.02em; }
.tc :focus-visible { outline:3px solid var(--deep); outline-offset:3px; }
.tc-avail :focus-visible { outline-color:var(--cream); }
@media (max-width:900px) {
  .tc-hero { display:flex; flex-direction:column; gap:20px; align-items:stretch; }
  .tc-name { font-size:21vw; }
  .tc-card { width:min(100%,380px); height:auto; max-height:none; }
  .tc-side { width:100%; padding:0; }
  .tc-book__g figure { margin-top:0!important; transform:none!important; }
  .w1,.w2 { grid-column:span 6; } .w3,.w4,.w5 { grid-column:span 4; }
  .tc-days { grid-template-columns:repeat(8,1fr); }
  .tc-credits li { grid-template-columns:1fr auto; }
  .tc-credits li span { grid-column:1/-1; }
  .tc-credits li time { grid-row:1; grid-column:2; }
}
@media (prefers-reduced-motion:reduce) { .tc-card__in { transition:none; } }