/* PayMap Europe v2.8 — dedicated mobile-only layout system
   This file is linked AFTER styles.css with a new filename so browser/Cloudflare cache cannot keep the old mobile CSS.
   Mobile uses one physical content standard: viewport -> page edge -> block -> inner content. */
@media screen and (max-width: 767px){
  :root{
    --pm-phone-edge: 14px;
    --pm-phone-block-pad: 15px;
    --pm-phone-radius: 18px;
  }
  @supports (padding: max(0px)){
    :root{ --pm-phone-edge: max(12px, env(safe-area-inset-left)); }
  }
  html,body{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-text-size-adjust:100%!important;
  }
  body{ position:relative!important; }
  *,*::before,*::after{ box-sizing:border-box!important; }

  /* ONE MOBILE PAGE COLUMN. Containers provide the only page-side padding. */
  .container,
  header .container,
  footer .container,
  main > .container,
  .hero > .container,
  .page-hero > .container,
  .section > .container,
  .site-footer > .container,
  .trust-strip-lite.container,
  .container.hero-grid,
  .container.page-layout,
  .container.grid,
  .container.footer-grid{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:var(--pm-phone-edge)!important;
    padding-right:var(--pm-phone-edge)!important;
  }

  main,.hero,.page-hero,.section,.site-footer,.site-header,header,footer{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:clip!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  .hero,.page-hero{ padding-top:28px!important; padding-bottom:24px!important; }
  .section{ padding-top:30px!important; padding-bottom:30px!important; }

  /* Layouts become one column. */
  .hero-grid,
  .page-layout,
  .footer-grid,
  .grid,
  .grid.cols-2,
  .grid.cols-3,
  .grid.cols-4,
  .grid.cols-5,
  .form-grid,
  .quick-tool,
  .breakdown,
  .kpi-grid,
  .result-grid,
  .result-board,
  .answer-grid,
  .amount-link-grid,
  .path-grid,
  .source-matrix,
  .source-grid-mini,
  .route-grid,
  .move-grid,
  .calendar-kpi-grid,
  .city-metric-grid,
  .snapshot-grid,
  .quality-strip,
  .mini-link-list,
  .calendar-tool-list,
  .compare-columns,
  .holiday-list,
  .authority-grid,
  .country-switch{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  article,aside,.sidebar,.page-layout > *{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
    position:static!important;
  }

  /* MOBILE-SPECIFIC BLOCK STANDARD: every visual module gets exactly the same outer width. */
  #calculator,
  #calculator > .calculator,
  .calculator,
  .interactive-calculator,
  .calculator-card,
  .content-block,
  .answer-panel,
  .check-panel,
  .scenario-panel,
  .source-panel,
  .method-panel,
  .decision-panel,
  .hub-guide,
  .trust-panel,
  .authority-guide,
  .utility-callout,
  .notice,
  .result-card,
  .table-card,
  .media-card,
  .hero-card,
  .cta-strip,
  .ad-slot,
  .ad-slot__box,
  .faq-item,
  .source-link,
  .card,
  .amount-link-card,
  .city-link-card,
  .tools-mini-card,
  .working-days-card,
  .trust-strip-lite,
  .kpi,
  .snapshot-card,
  .city-metric-card,
  .calendar-kpi,
  .move-card,
  .route-step{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    padding:var(--pm-phone-block-pad)!important;
    border-radius:var(--pm-phone-radius)!important;
    overflow:clip!important;
    box-sizing:border-box!important;
  }
  .content-block,
  .calculator,
  .interactive-calculator,
  .calculator-card,
  .card,
  .table-card,
  .media-card,
  .result-card,
  .notice,
  .faq-item{
    background:rgba(255,255,255,.94)!important;
    border:1px solid rgba(203,213,225,.88)!important;
  }
  .content-block,
  .calculator,
  .interactive-calculator,
  .calculator-card,
  .notice,
  .table-card,
  .media-card,
  .result-card,
  .cta-strip,
  .ad-slot{ margin-top:16px!important; margin-bottom:16px!important; }

  /* Remove previous transparent mobile exceptions and double outer gutters. */
  .content-block:has(.grid),
  .content-block:has(.amount-link-grid),
  .content-block:has(.mini-link-list),
  .content-block:has(.calendar-tool-list),
  .content-block:has(.source-grid-mini),
  .content-block:has(.city-metric-grid),
  .content-block:has(.snapshot-grid),
  .content-block:has(.route-grid),
  .content-block:has(.move-grid),
  .content-block:has(.answer-grid),
  .content-block:has(.table-card),
  .content-block:has(.table-scroll),
  .content-block:has(table){
    background:rgba(255,255,255,.94)!important;
    border:1px solid rgba(203,213,225,.88)!important;
    box-shadow:none!important;
    padding:var(--pm-phone-block-pad)!important;
    border-radius:var(--pm-phone-radius)!important;
    overflow:clip!important;
  }

  /* Inner elements are parent-bound, never viewport-bound. */
  #calculator *,
  .calculator *,
  .interactive-calculator *,
  .calculator-card *,
  .content-block *,
  .answer-panel *,
  .check-panel *,
  .scenario-panel *,
  .source-panel *,
  .method-panel *,
  .decision-panel *,
  .card *,
  .table-card *,
  .media-card *,
  .cta-strip *,
  .site-footer *{
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }

  /* Forms/calculators: dedicated phone UI. */
  form,.field,label,.field label,
  input,select,textarea,
  .field input,.field select,
  .calculator-actions,.hero-actions,.tool-tabs{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  input,select,textarea,.field input,.field select{
    min-height:46px!important;
    padding:12px 13px!important;
    border-radius:14px!important;
    font-size:16px!important;
  }
  .calculator-actions,.hero-actions,.tool-tabs{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
  }
  .btn,.button,.tool-tabs button,.hero-actions .btn,.calculator-actions .btn,.interactive-calculator .btn,form .btn{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:46px!important;
    padding:11px 14px!important;
    border-radius:999px!important;
    white-space:normal!important;
    text-align:center!important;
    justify-content:center!important;
  }

  /* Results: never become wider than the calculator. */
  .result-main{font-size:2rem!important;line-height:1.05!important;overflow-wrap:anywhere!important;}
  .breakdown div,.result-grid > *,.result-board > *{width:100%!important;max-width:100%!important;min-width:0!important;}

  /* Tables become mobile cards, not horizontal tables. */
  .table-scroll,.table-wrap,.authority-table-wrap{width:100%!important;max-width:100%!important;overflow:visible!important;touch-action:pan-y pinch-zoom!important;overscroll-behavior:auto!important;-webkit-overflow-scrolling:auto!important;}
  table{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;border-collapse:separate!important;border-spacing:0!important;}
  thead{display:none!important;}
  tbody{display:block!important;width:100%!important;}
  tr{display:block!important;width:100%!important;max-width:100%!important;margin:0 0 10px!important;border:1px solid rgba(203,213,225,.88)!important;border-radius:14px!important;background:#fff!important;overflow:clip!important;}
  th,td{display:flex!important;width:100%!important;max-width:100%!important;min-width:0!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important;padding:10px 12px!important;border-bottom:1px solid rgba(226,232,240,.9)!important;text-align:right!important;}
  td:last-child{border-bottom:0!important;}
  td::before{content:attr(data-label);flex:0 0 44%;max-width:44%;text-align:left!important;font-weight:800;color:#334155;overflow-wrap:anywhere;}
  td:empty::before{content:'';}

  /* Media is parent-bound. */
  img,picture,svg,video,canvas,iframe{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;height:auto!important;}
  .media-card img,.hero-card img,.card img,.content-block img,.calculator img{object-fit:cover!important;border-radius:14px!important;}

  /* Typography and long localized words. */
  h1,h2,h3,h4,p,li,a,span,strong,small,em,button,label,figcaption,td,th,.result-main{
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    hyphens:auto!important;
  }
  .hero h1,.page-hero h1{font-size:2.15rem!important;line-height:1.08!important;letter-spacing:0!important;}
  .section h2,.content-block h2{font-size:1.65rem!important;line-height:1.18!important;letter-spacing:0!important;}
  .lead{font-size:1.02rem!important;}

  /* Header/footer phone cleanup. */
  .nav{height:auto!important;min-height:62px!important;padding-top:8px!important;padding-bottom:8px!important;gap:8px!important;}
  .brand{min-width:0!important;flex:1 1 auto!important;}
  .brand img{width:min(142px,42vw)!important;max-width:42vw!important;}
  .nav-actions{gap:6px!important;flex:0 0 auto!important;}
  .language-current{max-width:92px!important;min-width:0!important;padding:8px 9px!important;}
  .language-current__text{display:none!important;}
  .menu-toggle{padding:9px!important;}
  .language-menu{left:var(--pm-phone-edge)!important;right:var(--pm-phone-edge)!important;width:auto!important;max-width:none!important;max-height:70vh!important;overflow:auto!important;}
  .footer-grid{gap:18px!important;}
  .site-footer{padding-top:34px!important;padding-bottom:24px!important;}

  html{scroll-behavior:auto!important;touch-action:pan-y pinch-zoom!important;}
  body{touch-action:pan-y pinch-zoom!important;overscroll-behavior-y:auto!important;}
  main,section,article,.container,.page-layout,.hero-grid,.grid,.content-block,.card,.calculator,.interactive-calculator,.media-card,.table-card,.site-footer{
    touch-action:pan-y pinch-zoom!important;
  }
  a,button,input,select,textarea,label,.btn,.button,.quick-tool,.quick-tool *{
    touch-action:manipulation!important;
  }
  .tool-feature-card::after{
    display:none!important;
  }
  .scroll-top{right:14px!important;bottom:14px!important;width:44px!important;height:44px!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important;}
}
@media screen and (max-width: 360px){
  :root{--pm-phone-edge:10px;--pm-phone-block-pad:12px;--pm-phone-radius:16px;}
  .brand img{width:min(122px,40vw)!important;}
  .hero h1,.page-hero h1{font-size:1.95rem!important;}
}