/* One alternating rhythm for the product overview and every illustrated story. */
.story-step.story-illustrated{
  --story-title-size:clamp(44px,4.3vw,64px);
  padding:80px 0;
}
.story-illustrated .story-shell{width:min(1320px,calc(100% - 112px))}
.story-step.story-illustrated .story-grid{
  grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  gap:clamp(40px,5vw,80px);
  align-items:center;
}
.story-illustrated .story-copy{min-width:0;max-width:560px;order:0}
.story-illustrated .story-copy h2{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:48px;font-weight:400;line-height:1.2;letter-spacing:-.025em}
.story-illustrated .story-copy h2>span{color:inherit}
.platform-illustrated .story-copy{container-type:inline-size}
.platform-illustrated .story-copy h2{font-size:clamp(24px,3.1vw,48px)}
.platform-title-line{white-space:nowrap}
@supports(font-size:1cqi){
  .platform-illustrated .story-copy h2{font-size:min(var(--story-title-size),9cqi)}
}
.story-illustrated .story-copy>.story-kicker{
  display:block;margin:0 0 24px;color:var(--accent);
  font-size:var(--story-title-size);font-weight:500;line-height:1.1;letter-spacing:-.05em;
}
/* Keep reporting and the combined competition/analysis label at the same type scale. */
#alan-raporlama .story-copy,body[data-page="index"] #alan-rekabet .story-copy{container-type:inline-size}
#alan-raporlama .story-copy>.story-kicker,body[data-page="index"] #alan-rekabet .story-copy>.story-kicker{white-space:nowrap;font-size:min(var(--story-title-size),10.5cqi)}
#alan-raporlama .reporting-separator,body[data-page="index"] #alan-rekabet .reporting-separator{font:inherit;letter-spacing:inherit;color:#b8c3cd}
.story-illustrated .story-copy>.campus-brand-heading{display:flex;align-items:center;gap:.45em;font-size:min(var(--story-title-size),9vw,56px)}
.story-illustrated .campus-brand-heading>span{font-weight:inherit;letter-spacing:inherit;color:inherit}
.campus-brand-logo{display:block;position:relative;flex:0 0 4.8em;width:4.8em;height:.7em;overflow:hidden}
.campus-brand-logo img{display:block;width:100%;height:auto;max-width:none}
/* Headings echo the original logo's cyan-to-blue ink. */
.story-illustrated .story-copy>.story-kicker,.hub-presentation .hub-motto>span,
.operation-comparison .story-illustration:last-child figcaption>span{color:#00c5f5}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  .story-illustrated .story-copy>.story-kicker,.hub-presentation .hub-motto>span,
  .operation-comparison .story-illustration:last-child figcaption>span{
    background-image:linear-gradient(180deg,#00d5ed 0%,#009aff 48%,#0755ff 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  #alan-raporlama .reporting-separator,body[data-page="index"] #alan-rekabet .reporting-separator{
    background-image:linear-gradient(180deg,#f1f5f8 0%,#b8c3cd 40%,#7e8d9b 60%,#c5cdd4 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
}
@media(forced-colors:active){
  .story-illustrated .story-copy>.story-kicker,.hub-presentation .hub-motto>span,
  .operation-comparison .story-illustration:last-child figcaption>span{background-image:none;color:CanvasText}
  #alan-raporlama .reporting-separator,body[data-page="index"] #alan-rekabet .reporting-separator{background-image:none;color:CanvasText}
}
.story-illustrated .story-copy>p:not(.eyebrow){max-width:480px;margin-top:28px;font-size:16px;line-height:1.85}
.story-art{margin:0;min-width:0;order:1}
.story-illustration{margin:0;min-width:0}
.story-illustration img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
.story-step.story-visual-left .story-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.story-visual-left .story-copy{order:1}
.story-visual-left .story-art{order:0}

/* A diagonal comparison: the lower-right scene sits in front of the upper-left. */
.story-step.story-operation .story-grid{grid-template-columns:minmax(0,.88fr) minmax(0,1.22fr)}
.story-illustrated .operation-comparison{--operation-split-top:77.4%;--operation-split-bottom:7.4%;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:0;width:100%;max-width:none;justify-self:end;align-items:start;position:relative;isolation:isolate}
.operation-color-filter{position:absolute;width:0;height:0;pointer-events:none}
.operation-comparison .story-illustration{position:relative}
.operation-comparison picture{display:block;transform:rotate(-4deg);transform-origin:center}
.operation-comparison .story-illustration:last-child img{filter:url(#operation-medai-blue) drop-shadow(0 0 1px rgba(0,184,246,.35))}
.operation-comparison .story-illustration:first-child{grid-column:1/-1;grid-row:1;margin-top:0;align-self:stretch;clip-path:polygon(-5% 0,var(--operation-split-top) 0,var(--operation-split-bottom) 100%,-5% 100%);z-index:1}
.operation-comparison .story-illustration:first-child figcaption{width:60%;transform:translateX(-20px)}
.operation-comparison .story-illustration:first-child picture{width:60%;transform:translateX(-20px) rotate(-4deg)}
.operation-comparison .story-illustration:last-child{grid-column:5/span 6;grid-row:1;margin-top:clamp(150px,12vw,180px);z-index:3}
.operation-comparison .story-illustration:last-child figcaption{margin-left:30%;position:relative;z-index:1;background:var(--navy);box-shadow:0 0 14px 8px var(--navy)}
.operation-comparison .story-illustration:last-child picture{display:block;position:relative;isolation:isolate}
/* The separator and the rear scene share the same cut, so no rear artwork crosses it. */
.operation-comparison::after{content:"";position:absolute;inset:0;clip-path:polygon(calc(var(--operation-split-top) - 1.25px) 0,calc(var(--operation-split-top) + 1.25px) 0,calc(var(--operation-split-bottom) + 1.25px) 100%,calc(var(--operation-split-bottom) - 1.25px) 100%);background:linear-gradient(180deg,transparent,#00b8f6 12%,#8be2ff 50%,#00b8f6 88%,transparent);z-index:2;pointer-events:none}
.operation-comparison figcaption{font-size:18px;font-weight:500;line-height:1.5;letter-spacing:-.02em;margin-bottom:12px}
.operation-comparison figcaption>span{display:block;margin-bottom:8px;font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--muted)}
.operation-comparison .story-illustration:last-child figcaption>span{width:fit-content}

@media(max-width:1100px){
  .story-step.story-illustrated{--story-title-size:clamp(40px,4.6vw,50px);padding:64px 0}
  .story-illustrated .story-shell{width:calc(100% - 72px)}
  .story-step.story-illustrated .story-grid{gap:36px}
  .story-illustrated .story-copy>p:not(.eyebrow){font-size:15px}
}
@media(max-width:900px){
  .story-step.story-illustrated{--story-title-size:clamp(38px,6.2vw,56px)}
  .story-illustrated .story-shell{width:calc(100% - 48px)}
  .story-step.story-illustrated .story-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .story-illustrated .story-copy{order:0;max-width:650px}
  .story-illustrated .story-copy h2{font-size:40px}
  .story-illustrated .story-art{order:1;width:min(100%,650px);margin:0 auto}
  .story-illustrated .story-copy>p:not(.eyebrow){max-width:600px}
  .story-illustrated .operation-comparison{width:100%;max-width:560px;justify-self:center}
  .operation-comparison .story-illustration:first-child figcaption{width:70%;transform:none}
  .operation-comparison .story-illustration:first-child picture{width:70%;transform:rotate(-4deg)}
  .operation-comparison .story-illustration:last-child{grid-column:4/span 7;margin-top:clamp(110px,21vw,160px)}
  .operation-comparison .story-illustration:last-child figcaption{margin-left:26%}
}
@media(max-width:650px){
  .story-step.story-illustrated{padding:48px 0}
  .story-illustrated .story-shell{width:calc(100% - 40px)}
  .story-illustrated .story-copy>.story-kicker{margin-bottom:18px}
  .story-illustrated .story-copy h2{font-size:32px}
  .story-illustrated .story-copy>p:not(.eyebrow){font-size:14px;margin-top:22px}
  .story-illustrated .story-art{width:100%}
  .operation-comparison figcaption{font-size:16px;line-height:1.4}
  .operation-comparison .story-illustration:last-child figcaption{margin-left:15%}
  .operation-comparison figcaption>span{font-size:11px}
}

/* The contact heading uses the same original wordmark as the campus heading. */
.contact-hero #contact-title .contact-brand-logo{display:inline-block;width:4.8em;max-width:100%;height:.7em;overflow:hidden;vertical-align:-.02em;transform:translateX(.075em)}
.contact-hero #contact-title .contact-brand-logo img{display:block;width:100%;height:auto;max-width:none}

/* Planned education area is clearly distinguished from available tools. */
@media(max-width:900px){.contact-hero #contact-title .contact-brand-logo{display:block;margin-bottom:.22em}}