/* Implantodent case index. Existing brand, real photographs, direct comparison. */
.cases-page { --case-shell: min(1320px,calc(100% - 64px)); padding-top: 100px; }
.case-shell { width: var(--case-shell); margin-inline: auto; }
.cases-page [data-nosplit],.cases-page .reveal { opacity: 1; transform: none; }
.cases-page .header__bar { width: var(--case-shell); }
.cases-page :is(a,button,input,select,summary):focus-visible,.offer-cases :is(a,button,input,summary):focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.case-skip { position: fixed; top: -100px; left: 20px; z-index: 500; background: white; padding: 12px 20px; }
.case-skip:focus { top: 12px; }
.case-breadcrumb { display:flex; gap:12px; align-items:center; font-size:13px; color:var(--ink-60); margin: 12px 0 42px; }
.case-breadcrumb a:hover { text-decoration:underline; }
.case-hero__grid { display:grid; grid-template-columns:1.4fr 1fr; gap:64px; align-items:end; padding-bottom:44px; }
.case-kicker { font-size:13px; font-weight:600; color:var(--green-deep); margin-bottom:16px; }
.case-hero h1 { font-size:clamp(44px,5.7vw,80px); line-height:1; letter-spacing:-.05em; max-width:12ch; }
.case-hero__intro > p { font-size:20px; line-height:1.5; max-width:37ch; color:var(--ink-60); }
.case-hero__cta { display:inline-flex; gap:16px; align-items:center; min-height:48px; margin-top:24px; font-size:15px; font-weight:600; text-decoration:underline; text-underline-offset:6px; }
.case-hero__cta span { color:var(--green-deep); font-size:22px; }
.case-jump { display:flex; flex-wrap:wrap; gap:8px 28px; border-block:1px solid #cad0c9; padding-block:14px; }
.case-jump a { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:44px; font-size:15px; font-weight:600; }
.case-jump a span { font-size:13px; font-weight:400; color:var(--green-deep); }
.case-jump a:hover { color:var(--green-deep); }
.case-results { padding-top:56px; scroll-margin-top:100px; }
.case-anchor { display:block; height:0; scroll-margin-top:110px; }
.case-results + .case-results { margin-top:32px; padding-top:48px; border-top:1px solid #cad0c9; }
.case-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:28px; }
.case-section-head h2 { font-size:clamp(30px,3.4vw,46px); line-height:1.1; letter-spacing:-.035em; }
.case-section-head > p { max-width:37ch; font-size:16px; line-height:1.55; color:var(--ink-60); }
.case-section-head .case-kicker { margin-bottom:12px; }
.case-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px 28px; align-items:start; }
.case-tile { min-width:0; padding:20px; background:#fff; border-radius:24px; }
.case-tile__head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:0 2px 16px; }
.case-tile__head h3 { font-size:19px; letter-spacing:-.02em; line-height:1.2; }
.case-tile__head > span { color:var(--ink-60); font-size:13px; }
.case-tile__head > span { flex:none; }
.case-tile__source { display:flex; align-items:center; gap:10px; min-height:44px; padding-top:8px; font-size:14px; color:var(--green-deep); text-decoration:underline; text-underline-offset:4px; }
.case-tile__bottom { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 16px; padding-top:16px; }
.case-thumbnails { display:flex; flex-wrap:wrap; gap:6px; }
.case-thumbnails button { width:48px; height:48px; overflow:hidden; border-radius:8px; background:var(--paper); }
.case-thumbnails img { width:100%; height:100%; object-fit:cover; }
.case-thumbnails__more { color:var(--green-deep); font-size:15px; font-weight:600; }
.case-details { margin-top:16px; border-top:1px solid #e2e6df; }
.case-details > summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px; padding:14px 0 2px; cursor:pointer; list-style:none; font-size:15px; font-weight:600; }
.case-details > summary::-webkit-details-marker { display:none; }
.case-details > summary::marker { content:""; }
.case-details > summary > span { display:flex; align-items:center; flex-wrap:wrap; gap:5px 12px; }
.case-details > summary small { color:var(--ink-60); font-size:13px; font-weight:400; }
.case-details__toggle { position:relative; display:block; width:28px; height:28px; flex:none; color:var(--green-deep); }
.case-details__toggle::before,.case-details__toggle::after { content:""; position:absolute; background:currentColor; width:14px; height:2px; left:7px; top:13px; }
.case-details__toggle::after { transform:rotate(90deg); }
.case-details[open] .case-details__toggle::after { display:none; }
.case-details .case-details__open-label { display:none; }
.case-details[open] .case-details__open-label { display:inline; }
.case-details[open] .case-details__closed-label { display:none; }
.case-details__body { padding-top:20px; }
.case-details__story { color:var(--ink-60); font-size:15px; line-height:1.6; margin-bottom:24px; }
.case-details__story p { margin:0; }
.case-details__story dl { margin-top:18px; }
.case-details__story dl > div + div { margin-top:14px; }
.case-details__story dt { color:var(--ink); font-weight:600; }
.case-details__story dd { margin:3px 0 0; }
.case-expanded-photos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 12px; align-items:start; }
.case-expanded-photos > button { display:block; min-width:0; width:100%; height:auto; text-align:left; background:transparent; }
.case-expanded-photos img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; background:#f2f2ef; border-radius:9px; }
.case-expanded-photos button > span { display:block; padding-top:7px; font-size:12px; line-height:1.4; color:var(--ink-60); }
.case-expanded-photos button:hover img { outline:2px solid var(--green-deep); outline-offset:2px; }
.case-details__close { display:block; min-height:48px; padding:12px 0; margin-top:12px; font-size:14px; font-weight:600; color:var(--green-deep); text-decoration:underline; text-underline-offset:4px; }
.case-radiographs__details { margin-top:20px; }
.case-radiograph-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:start; gap:16px; }
.case-radiograph-grid > button { display:flex; flex-direction:column; align-items:stretch; width:100%; height:auto; min-width:0; min-height:0; padding:0; overflow:hidden; text-align:left; color:var(--ink); border-radius:14px; background:#fff; }
/* height:auto overrides each HTML height hint so the media box follows 16:10. */
.case-radiograph-grid img { display:block; width:100%; height:auto; min-height:0; aspect-ratio:16/10; flex:none; object-fit:contain; object-position:center; background:#101820; }
.case-radiograph-grid > button > span { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; padding:12px; font-size:14px; line-height:1.35; }
.case-radiograph-grid > button > span > span { color:var(--green-deep); }
.case-radiograph-grid > button:hover { box-shadow:0 0 0 2px var(--green-deep); }
.case-thumbnails button:hover { outline:2px solid var(--green-deep); outline-offset:2px; }
.case-open-link { display:inline-flex; min-height:44px; align-items:center; justify-content:flex-start; gap:8px; font-size:14px; font-weight:600; text-align:left; }
.case-open-link > span:last-child { margin-left:4px; color:var(--green-deep); font-size:19px; }
.case-open-link:hover { color:var(--green-deep); }
.case-photo-preview { display:grid; grid-template-columns:1fr 1fr; gap:8px; aspect-ratio:16/9; overflow:hidden; border-radius:16px; background:#f2f2ef; }
.case-photo-preview--single { grid-template-columns:1fr; }
.case-photo-preview button { min-width:0; min-height:0; width:100%; height:100%; }
.case-photo-preview img { width:100%; height:100%; object-fit:contain; }
.case-medical-note { font-size:14px; color:var(--ink-60); line-height:1.65; margin-block:28px 40px; max-width:100%; }
.case-consult { margin-block:64px; padding:40px; border-radius:24px; background:#dfe9da; display:flex; align-items:center; justify-content:space-between; gap:40px; }
.case-consult h2 { font-size:clamp(30px,3vw,42px); letter-spacing:-.035em; line-height:1.1; }
.case-consult p:not(.case-kicker) { color:#41543b; margin-top:18px; max-width:45ch; font-size:16px; }
.case-consult .btn { flex:none; min-height:48px; background:var(--green-deep); color:white; }
.case-consult .btn:hover { background:var(--blue); }
.case-studies { padding-top:16px; }
.case-study-tools { display:flex; justify-content:space-between; align-items:end; gap:24px; padding:24px 0; border-top:1px solid var(--line); margin-bottom:12px; }
.case-study-tools label { display:flex; align-items:center; gap:20px; font-size:14px; }
.case-study-tools select { font:inherit; font-size:16px; min-height:48px; border:1px solid #b9c2b7; border-radius:10px; padding:10px 38px 10px 14px; color:var(--ink); background:white; max-width:100%; }
.case-study-tools > p { color:var(--ink-60); font-size:14px; padding-bottom:12px; }
.case-study-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.case-study { display:grid; grid-template-columns:140px minmax(0,1fr); gap:22px; background:white; padding:24px; border-radius:20px; align-items:start; }
.case-study[hidden] { display:none; }
.case-study__image { display:block; aspect-ratio:1; border-radius:12px; overflow:hidden; background:var(--paper); }
.case-study__image img { width:100%; height:100%; object-fit:contain; }
.case-study__category { color:var(--green-deep); font-size:12px; line-height:1.3; margin-bottom:10px; }
.case-study h3 { font-size:20px; line-height:1.25; letter-spacing:-.025em; }
.case-study h3 a:hover { color:var(--green-deep); }
.case-study__body > p:not(.case-study__category) { font-size:14px; line-height:1.6; color:var(--ink-60); margin-top:12px; }
.case-study__body .case-open-link { margin-top:8px; }
.case-faq { margin-top:72px; padding:0; }
.case-faq .phead { max-width:none; margin-bottom:30px; }
.case-faq h2 { font-size:clamp(28px,3vw,40px); }
.case-faq .pfaq-list { background:white; border-radius:20px; padding:8px 28px; }
.case-faq .pfaq summary { min-height:56px; font-size:17px; line-height:1.4; }
.case-faq .pfaq__a { font-size:16px; line-height:1.65; }
.case-faq .eyebrow::before { display:none; }
.offer-cases .case-tile { padding:0; border-radius:0; }
.offer-cases .case-grid { gap:28px; }
.offer-cases__footer { display:flex; align-items:center; justify-content:space-between; gap:24px; border-top:1px solid var(--line); margin-top:28px; padding-top:24px; }
.offer-cases__footer > p { max-width:44ch; color:var(--ink-60); font-size:14px; line-height:1.5; }
@media(max-width:1100px) {
  .case-hero__grid { gap:32px; }
  .case-study { grid-template-columns:100px minmax(0,1fr); gap:18px; padding:20px; }
}
@media(max-width:760px) {
  .case-radiograph-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .case-tile__head { align-items:flex-start; }
  .cases-page { --case-shell:calc(100% - 32px); padding-top:90px; }
  .case-breadcrumb { margin-bottom:30px; }
  .case-hero__grid { grid-template-columns:1fr; gap:24px; padding-bottom:28px; }
  .case-hero h1 { font-size:clamp(42px,9vw,60px); }
  .case-hero__intro > p { font-size:18px; max-width:42ch; }
  .case-hero__cta { margin-top:12px; }
  .case-jump { gap:10px 24px; flex-wrap:wrap; padding-block:8px; }
  .case-jump a { font-size:13px; gap:10px; min-height:40px; }
  .case-results { padding-top:36px; }
  .case-section-head { flex-direction:column; align-items:flex-start; gap:14px; margin-bottom:22px; }
  .case-section-head > p { max-width:48ch; font-size:15px; }
  .case-section-head h2 { font-size:32px; }
  .case-grid { grid-template-columns:1fr; gap:20px; }
  .case-tile { padding:14px; border-radius:20px; }
  .case-tile__head { padding-bottom:12px; }
  .case-tile__head h3 { font-size:18px; }
  .case-tile__head > span { font-size:12px; }
  .case-tile__bottom { padding-top:12px; gap:6px 12px; }
  .case-thumbnails { gap:5px; }
  .case-thumbnails button { width:44px; height:44px; }
  .case-consult { margin-block:40px; padding:26px 22px; display:block; }
  .case-consult .btn { margin-top:24px; font-size:15px; white-space:normal; }
  .case-study-tools { display:block; padding:18px 0 8px; }
  .case-study-tools label { flex-direction:column; align-items:flex-start; gap:8px; }
  .case-study-tools select { width:100%; }
  .case-study-tools > p { padding:12px 0 0; }
  .case-study-grid { grid-template-columns:1fr; gap:16px; }
  .case-study { grid-template-columns:88px minmax(0,1fr); gap:14px; padding:18px; }
  .case-study h3 { font-size:18px; }
  .case-study__body > p:not(.case-study__category) { font-size:14px; }
  .case-faq { margin-top:40px; }
  .case-faq .pfaq-list { padding:4px 18px; }
  .offer-cases .case-grid { gap:26px; }
  .offer-cases__footer { flex-direction:column; align-items:stretch; gap:16px; }
  .offer-cases__footer > .btn { justify-content:center; }
}
@media(max-width:360px) {
  .case-tile { padding:10px; }
  .case-study { grid-template-columns:1fr; }
  .case-study__image { aspect-ratio:2; }
}