/* Mobile process chapters: one coherent reading surface per frame.
   These rules follow the presentation styles and leave laptop layouts intact. */
@media screen and (max-width:760px) {
  #put .journey-pin,
  #seo .seo-pin,
  #lokalno .local-pin,
  #aeo.aeo-motion .aeo-pin,
  #sadrzaj.content-process .content-pin,
  #plan .plan-pin {
    height:100dvh;
    min-height:0;
    max-height:100dvh;
    padding-top:calc(var(--header,70px) + 12px);
    padding-bottom:max(14px,env(safe-area-inset-bottom));
  }

  #put .journey-pin > .section-label,
  #lokalno .local-pin > .section-label,
  #sadrzaj.content-process .content-pin > .section-label,
  #plan .plan-pin > .section-label { margin-bottom:14px; }

  /* The proposed form stays at reading size, within one continuous stage. */
  #put.journey-flow .journey-stage {
    gap:14px;
    padding:2px 2px 16px;
    overflow:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  #put.journey-flow .journey-tabs { min-height:68px; }
  #put.journey-flow .journey-tab { min-height:66px;gap:8px; }
  #put.journey-flow .journey-tab .journey-node-label { font-size:14px;line-height:1.3; }
  #put.journey-flow .journey-tab > span:first-child { width:30px;height:30px;font-size:14px; }
  #put.journey-flow .journey-flow-path { top:13px; }
  #put.journey-flow .journey-visual { overflow:visible; }
  #put.journey-flow .concept-device { height:auto;min-height:0;max-height:none; }
  #put.journey-flow .device-top { height:40px;padding:0 16px; }
  #put.journey-flow .device-top > span { font-size:14px; }
  #put.journey-flow .device-top img { width:62px;height:27px; }
  #put.journey-flow .concept-screen { padding:18px 16px;overflow:visible;height:auto; }
  #put.journey-flow .screen-content { height:auto;gap:15px; }
  #put.journey-flow .concept-screen h4,
  #put.journey-flow .concept-screen[data-screen="2"] h4,
  #put.journey-flow .concept-screen[data-screen="3"] h4 { font-size:27px;line-height:1.12;margin-bottom:10px; }
  #put.journey-flow .concept-screen p,
  #put.journey-flow .concept-screen[data-screen="2"] p:not(.mock-kicker) { font-size:14px;line-height:1.5; }
  #put.journey-flow .journey-screen-controls { gap:9px; }
  #put.journey-flow .mock-option,
  #put.journey-flow .mock-cta { min-height:44px;padding:10px 12px;font-size:14px;line-height:1.45; }
  #put.journey-flow .mock-details { margin-top:0;padding-bottom:10px;font-size:14px;gap:12px; }
  #put.journey-flow .mock-detail-label { font-size:14px; }
  #put.journey-flow .mock-doctor { height:145px; }
  #put.journey-flow .mock-fields,
  #put.journey-flow .concept-screen[data-screen="3"] .mock-fields { grid-template-columns:1fr;gap:8px; }
  #put.journey-flow .mock-fields > span,
  #put.journey-flow .concept-screen[data-screen="3"] .mock-fields > span:first-child { display:flex;min-height:44px;padding:10px 12px;font-size:14px; }
  #put.journey-flow .mock-summary,
  #put.journey-flow .mock-confirm { font-size:14px;line-height:1.45; }
  #put.journey-flow .journey-panel { margin:0;padding:0 1px; }
  #put.journey-flow .journey-panel h3 { font-size:23px;line-height:1.2; }
  #put.journey-flow .journey-panel p { font-size:14px;line-height:1.5;margin-top:9px; }
  #put.journey-flow .scene-bottom { padding-top:6px; }
  #put.journey-flow .scene-bottom .text-button { min-height:44px;font-size:14px;line-height:1.4; }

  /* Intro scenes receive the full canvas. Invisible controls reserve no space. */
  #seo.seo-motion .seo-bottom.is-intro {
    position:absolute;
    left:var(--gutter,24px);
    right:var(--gutter,24px);
    bottom:max(14px,env(safe-area-inset-bottom));
  }
  #seo.seo-motion .seo-stage { min-height:0; }
  #seo.seo-motion .seo-title-scene h2 { font-size:clamp(42px,11vw,62px);line-height:1.09; }
  #seo.seo-motion .seo-google { margin-bottom:28px; }
  #seo.seo-motion .seo-google img { width:min(220px,73%); }
  #seo.seo-motion .seo-query { min-height:58px;padding:16px 13px;gap:10px;font-size:clamp(14px,3.9vw,18px); }
  #seo.seo-motion .seo-query svg { width:16px;height:16px; }
  #seo.seo-motion .seo-query i { margin-left:-7px; }
  #seo.seo-motion .seo-number-scene { gap:13px;padding:10px 3px 15px 0;overflow:auto; }
  #seo.seo-motion .seo-number-block,
  #seo.seo-motion .seo-metric-copy { flex:none; }
  #seo.seo-motion .seo-metric-kicker { font-size:14px;line-height:1.4;margin:0 0 10px;padding:6px 10px; }
  #seo.seo-motion .seo-metric-value { font-size:clamp(102px,30vw,142px);line-height:.95; }
  #seo.seo-motion .seo-number-scene:last-child .seo-metric-value { font-size:clamp(90px,25vw,125px); }
  #seo.seo-motion .seo-metric-copy h3 { font-size:26px;line-height:1.15; }
  #seo.seo-motion .seo-metric-copy > p,
  #seo.seo-motion .seo-metric-copy .seo-metric-note,
  #seo.seo-motion .seo-metric-copy .seo-metric-action { display:block;font-size:14px;line-height:1.5;margin-top:12px; }
  #seo.seo-motion .seo-metric-action > span { font-size:14px;line-height:1.4;margin-bottom:5px;letter-spacing:.04em; }
  #seo.seo-motion .seo-story-navigation { grid-template-columns:repeat(3,minmax(0,1fr));gap:0 12px; }
  #seo.seo-motion .seo-story-navigation button { min-height:46px;font-size:14px;line-height:1.3;padding:8px 0;white-space:normal; }
  #seo.seo-motion .seo-story-navigation button > span { display:none; }
  #seo.seo-motion .seo-footer { gap:12px;margin-top:6px; }
  #seo.seo-motion .seo-footer .text-button,
  #seo.seo-motion .seo-details-trigger { min-height:44px;font-size:14px;line-height:1.4;padding:7px 0; }

  /* Map and current city share a vertical flow, rather than overlapping percentages. */
  #lokalno.local-motion .local-pin {
    overflow:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  #lokalno.local-motion .local-pin > * { flex-shrink:0; }
  #lokalno.local-motion .local-theater { display:flex;flex-direction:column;flex:none;min-height:0;gap:8px; }
  #lokalno.local-motion .map-window {
    position:relative;
    flex:none;
    inset:auto;
    right:auto;
    top:auto;
    width:calc(100% + 40px);
    height:clamp(200px,29dvh,270px);
    margin:-10px -20px -3px;
  }
  #lokalno.local-motion .map-world { height:clamp(330px,48dvh,430px);min-height:0; }
  #lokalno.local-motion .balkans-map { mask-image:radial-gradient(ellipse at 50% 50%,#000 42%,transparent 74%); }
  #lokalno.local-motion .map-city-label { font-size:14px; }
  #lokalno.local-motion .local-narrative { flex:none;position:relative;width:100%;height:auto;min-height:0;margin:0; }
  #lokalno.local-motion .local-frame { position:absolute;inset:0;justify-content:flex-start;padding:0;overflow:hidden; }
  #lokalno.local-motion .local-frame[aria-hidden="false"] { position:relative;inset:auto;overflow:visible; }
  #lokalno.local-motion .local-step { font-size:14px;line-height:1.4;margin-bottom:12px;padding:6px 10px; }
  #lokalno.local-motion .local-frame h3 { font-size:clamp(42px,12vw,58px); }
  #lokalno.local-motion .local-payoff h2 { font-size:clamp(35px,10vw,44px);line-height:1.1; }
  #lokalno.local-motion .local-frame > p,
  #lokalno.local-motion .local-query { font-size:14px;line-height:1.5;max-width:100%;margin-top:12px; }
  #lokalno.local-motion .story-bottom { display:block;flex:none;margin-top:20px; }
  #lokalno.local-motion .story-controls { gap:10px; }
  #lokalno.local-motion .story-controls button { min-height:62px;font-size:14px;line-height:1.35;padding:10px 0; }
  #lokalno.local-motion .story-controls button > span { font-size:14px;margin-bottom:6px; }
  #lokalno.local-motion .story-bottom > .text-button { font-size:14px;min-height:44px;line-height:1.45;margin-top:3px; }

  /* Only the visible AEO example contributes height; no phantom card-sized gap. */
  #aeo.aeo-motion .aeo-pin { overflow:auto;overscroll-behavior:contain; }
  #aeo.aeo-motion .aeo-pin > * { flex-shrink:0; }
  #aeo.aeo-motion .aeo-theater { flex:none;gap:14px;padding:14px 2px 16px 0;min-height:0;overflow:visible; }
  #aeo.aeo-motion h2 { font-size:clamp(31px,8.5vw,40px);line-height:1.1; }
  #aeo.aeo-motion .aeo-step-controls > button { min-height:77px;gap:8px;padding:0 3px 3px;font-size:14px;line-height:1.3; }
  #aeo.aeo-motion .aeo-route-node { width:34px;height:34px;font-size:14px; }
  #aeo.aeo-motion .aeo-route-track { top:17px; }
  #aeo.aeo-motion .aeo-stage-graphic { display:block;min-height:0; }
  #aeo.aeo-motion .aeo-process-scene { position:relative;min-height:0;gap:10px; }
  #aeo.aeo-motion .aeo-process-scene[aria-hidden="true"] { position:absolute;inset:0;overflow:hidden; }
  #aeo.aeo-motion .aeo-question > span { font-size:14px;letter-spacing:.07em; }
  #aeo.aeo-motion .aeo-question p { font-size:21px;line-height:1.3;margin-top:5px; }
  #aeo.aeo-motion .aeo-connection { height:18px; }
  #aeo.aeo-motion .aeo-example-card { padding:16px;border-radius:12px; }
  #aeo.aeo-motion .aeo-card-label { font-size:14px;line-height:1.4;margin-bottom:9px;letter-spacing:.055em; }
  #aeo.aeo-motion .aeo-example-card > p { font-size:16px;line-height:1.5; }
  #aeo.aeo-motion .aeo-trust-example .aeo-example-card > p { font-size:26px;line-height:1.2; }
  #aeo.aeo-motion .aeo-verification { gap:8px;margin-top:14px;padding-top:14px; }
  #aeo.aeo-motion .aeo-verification > span { font-size:14px;line-height:1.4; }
  #aeo.aeo-motion .aeo-address { font-size:14px;line-height:1.4;overflow-wrap:anywhere;padding-bottom:10px;margin-bottom:12px; }
  #aeo.aeo-motion .aeo-code-card > p { font-size:16px; }
  #aeo.aeo-motion .aeo-code-card > p > span { font-size:14px; }
  #aeo.aeo-motion .aeo-graphic-caption,
  #aeo.aeo-motion .aeo-illustration-label { font-size:14px;line-height:1.4;margin-top:9px;letter-spacing:0; }
  #aeo.aeo-motion .aeo-step-copy { grid-template-columns:52px 1fr;gap:7px 9px; }
  #aeo.aeo-motion .aeo-active-number { white-space:nowrap;font-size:12px;letter-spacing:0; }
  #aeo.aeo-motion .aeo-step-copy h3 { font-size:24px;line-height:1.2; }
  #aeo.aeo-motion .aeo-step-copy p { font-size:14px;line-height:1.5; }
  #aeo.aeo-motion .aeo-closing { gap:4px 14px;padding-top:10px; }
  #aeo.aeo-motion .aeo-closing p { font-size:14px;line-height:1.45; }
  #aeo.aeo-motion .aeo-closing .text-button { font-size:14px;min-height:44px; }

  /* The entire month is a single reader at every phone height. */
  #sadrzaj.content-process .content-pin {
    display:flex;
    flex-direction:column;
    overflow:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  #sadrzaj.content-process .content-pin > * { flex-shrink:0; }
  #sadrzaj.content-process .content-heading { display:flex;flex-direction:column;align-items:stretch;gap:16px; }
  #sadrzaj.content-process .content-heading h2 { font-size:clamp(31px,8.8vw,39px);line-height:1.1;max-width:none; }
  #sadrzaj.content-process .content-heading h2 br { display:none; }
  #sadrzaj.content-process .content-plan-subtitle { font-size:14px;line-height:1.45;max-width:none;margin-top:9px; }
  #sadrzaj.content-process .content-output-controls { display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:100%;gap:14px; }
  #sadrzaj.content-process .publishing-number { display:flex;flex-direction:row;align-items:center;gap:12px;text-align:left; }
  #sadrzaj.content-process .publishing-number > span { font-size:60px;line-height:1; }
  #sadrzaj.content-process .publishing-number p { max-width:112px;font-size:14px;line-height:1.4;margin:0; }
  #sadrzaj.content-process .cadence-toggle { display:flex;flex-direction:column;gap:5px;width:auto; }
  #sadrzaj.content-process .cadence-toggle button { min-height:44px;font-size:14px;line-height:1.35;padding:8px 12px; }
  #sadrzaj.content-process .month-tabs { margin-top:20px;gap:0; }
  #sadrzaj.content-process .month-tab { min-height:65px;gap:7px;padding:0 1px 4px; }
  #sadrzaj.content-process .content-route-node { width:30px;height:30px;font-size:14px; }
  #sadrzaj.content-process .content-route-track { top:15px; }
  #sadrzaj.content-process .content-route-name { min-height:20px;font-size:0;line-height:0; }
  #sadrzaj.content-process .content-route-name::after { font-size:14px;line-height:1.4; }
  #sadrzaj.content-process .editorial-stage { display:block;flex:none;min-height:0;overflow:visible;padding:16px 0 18px;text-align:left; }
  #sadrzaj.content-process .month-panel { display:block;min-height:0;width:100%;margin:0;padding:0;text-align:left; }
  #sadrzaj.content-process .month-caption { font-size:14px;line-height:1.4;padding:6px 10px;margin-bottom:12px;letter-spacing:.035em; }
  #sadrzaj.content-process .month-panel h3 { font-size:29px;line-height:1.15;margin-bottom:10px; }
  #sadrzaj.content-process .month-focus { font-size:14px;line-height:1.5; }
  #sadrzaj.content-process .month-topics { display:block;margin-top:15px; }
  #sadrzaj.content-process .month-topics li { font-size:14px;line-height:1.5;padding-top:9px;margin-top:9px; }
  #sadrzaj.content-process .cadence-row { margin-top:16px;text-align:left; }
  #sadrzaj.content-process .cadence-row > p { font-size:14px;line-height:1.5; }
  #sadrzaj.content-process .content-footnote { display:block;padding-top:12px;margin-top:0; }
  #sadrzaj.content-process .content-footnote p { font-size:14px;line-height:1.5; }
  #sadrzaj.content-process .content-footnote .text-button { font-size:14px;min-height:44px;line-height:1.4;margin-top:4px; }

  /* A real phase panel replaces the drifting decorative background number. */
  #plan .plan-intro { display:block;flex:none;margin:0; }
  #plan .plan-intro > p { font-size:17px;line-height:1.45; }
  #plan .plan-intro > p br { display:none; }
  #plan .plan-intro > p strong::before { content:' '; }
  #plan .plan-intro > span { display:block;max-width:none;font-size:14px;line-height:1.5;margin-top:8px; }
  #plan .plan-intro > span br { display:none; }
  #plan .plan-pin { overflow:auto;overscroll-behavior:contain; }
  #plan .plan-pin > * { flex-shrink:0; }
  #plan .plan-theater { display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:22px;flex:none;min-height:0;padding:28px 2px 22px;overflow:visible; }
  #plan .plan-theater > * { flex-shrink:0; }
  #plan .phase-number { display:none; }
  #plan .phase-content { position:relative;margin:0;max-width:100%; }
  #plan .phase-label { font-size:14px;line-height:1.4;margin-bottom:14px;padding:6px 10px; }
  #plan .phase-content h2 { font-size:clamp(44px,14vw,58px);line-height:1.07; }
  #plan .phase-content p { font-size:14px;line-height:1.5;max-width:100%;margin-top:16px; }
  #plan .phase-content > span:last-child { font-size:14px;line-height:1.5;letter-spacing:0;max-width:100%;margin-top:16px;padding-left:12px;border-left:1px solid rgba(var(--accent),.5); }
  #plan .phase-index { position:static;inset:auto;transform:none;display:flex;flex-direction:row;justify-content:flex-start;gap:12px;margin:0; }
  #plan .phase-index button { width:44px;height:44px;font-size:14px; }
  #plan .scene-bottom { display:block;flex:none;padding-top:10px; }
  #plan .scene-bottom .scroll-instruction,
  #plan .scene-bottom .scene-progress { display:none; }
  #plan .plan-note { display:block;font-size:14px;line-height:1.45; }
}

@media screen and (max-width:760px) and (max-height:700px) {
  #lokalno.local-motion .map-window { height:210px;margin-top:-5px; }
  #plan .plan-theater { justify-content:flex-start;padding-top:20px; }
}

@media screen and (max-width:360px) {
  #put.journey-flow .journey-tab .journey-node-label { font-size:11px; }
  #put.journey-flow .concept-screen h4,
  #put.journey-flow .concept-screen[data-screen="2"] h4,
  #put.journey-flow .concept-screen[data-screen="3"] h4 { font-size:25px; }
  #sadrzaj.content-process .content-output-controls { gap:10px; }
  #sadrzaj.content-process .publishing-number { gap:9px; }
  #sadrzaj.content-process .publishing-number > span { font-size:51px; }
  #sadrzaj.content-process .publishing-number p { max-width:104px; }
  #sadrzaj.content-process .cadence-toggle button { padding-inline:9px; }
}