/* foto-metall-podrobno-guide.css — rebuild from preview (2).html */
/* 2026-09-08.01: faithful classes; wrap=1180; scoped .zp-foto-metall-guide; site harden only */

/* =====================================================
       BASE
       ===================================================== */

    .zp-foto-metall-guide{
      --white:#ffffff;

      --bg:#ffffff;
      --soft:#f8f6fa;
      --soft-purple:#f2edf7;
      --soft-warm:#faf8f5;

      --text:#211a24;
      --heading:#291630;
      --muted:#5d5561;
      --muted-2:#746c78;

      --purple:#57287e;
      --purple-hover:#431e62;
      --purple-dark:#321940;
      --purple-deep:#24122e;

      --border:#ded7e2;
      --border-strong:#c7bad0;

      --green:#315f49;
      --green-soft:#e3efe8;

      --shadow:0 17px 45px rgba(47,28,56,.08);
      --shadow-big:0 27px 64px rgba(47,28,56,.14);

      --wrap:1180px;
      --header-h:78px;
    }
.zp-foto-metall-guide {
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
  width: 100%;
  max-width: 100%;
}
.zp-foto-metall-guide, .zp-foto-metall-guide * { box-sizing: border-box; }
.zp-foto-metall-guide img {
  max-width:100%;
}
.zp-foto-metall-guide .wrap {
      width:min(var(--wrap),calc(100% - 40px));
      margin-inline:auto;
    }


.zp-foto-metall-guide .section {
      padding:76px 0;
    }


.zp-foto-metall-guide .section--soft {
      background:var(--soft);
    }


.zp-foto-metall-guide .section--purple {
      background:
        radial-gradient(
          720px 360px at 100% 0%,
          rgba(108,64,145,.08),
          transparent 65%
        ),
        var(--soft-purple);
    }


    /* =====================================================
       TYPE
       ===================================================== */

.zp-foto-metall-guide .kicker {
      display:block;

      margin:0 0 10px;

      color:#6a4b78;

      font-size:14px;
      line-height:1.3;
      font-weight:800;
    }


.zp-foto-metall-guide .h2 {
      max-width:820px;

      margin:0 0 15px;

      color:var(--heading);

      font-size:clamp(31px,3.4vw,44px);
      line-height:1.1;
      letter-spacing:-.04em;
    }


.zp-foto-metall-guide .lead {
      max-width:790px;

      margin:0;

      color:var(--muted);

      font-size:17px;
      line-height:1.68;
    }


.zp-foto-metall-guide .note {
      margin:20px 0 0;

      color:#4e4551;

      font-size:15px;
      line-height:1.62;
    }


.zp-foto-metall-guide .text-link {
      color:var(--purple);

      font-size:15px;
      font-weight:800;

      text-decoration:none;
    }


.zp-foto-metall-guide .text-link:hover {
      text-decoration:underline;
    }


    /* =====================================================
       BUTTONS
       ===================================================== */

.zp-foto-metall-guide .actions {
      display:flex;
      flex-wrap:wrap;

      gap:12px;

      margin-top:28px;
    }


.zp-foto-metall-guide .btn {
      min-height:52px;
      padding:0 22px;

      display:inline-flex;
      align-items:center;
      justify-content:center;

      border:1.5px solid transparent;
      border-radius:14px;

      font-size:16px;
      line-height:1.2;
      font-weight:800;

      text-decoration:none;

      transition:
        transform .18s ease,
        background .18s ease,
        border-color .18s ease;
    }


.zp-foto-metall-guide .btn:hover {
      transform:translateY(-1px);
      text-decoration:none;
    }


.zp-foto-metall-guide .btn--primary {
      color:#fff;
      background:var(--purple);

      box-shadow:
        0 12px 26px rgba(87,40,126,.18);
    }


.zp-foto-metall-guide .btn--primary:hover {
      color:#fff;
      background:var(--purple-hover);
    }


.zp-foto-metall-guide .btn--secondary {
      color:#432151;
      background:#fff;

      border-color:#b8a6c1;
    }


.zp-foto-metall-guide .btn--secondary:hover {
      background:#f1ecf4;
    }


    /* =====================================================
       HEADER
       ===================================================== */











.zp-foto-metall-guide .site-nav {
      display:flex;
      align-items:center;

      gap:24px;
    }


.zp-foto-metall-guide .site-nav a {
      color:#443b47;

      font-size:14px;
      font-weight:700;

      text-decoration:none;
    }


.zp-foto-metall-guide .site-nav a:hover {
      color:var(--purple);
    }


















    /* =====================================================
       HERO
       ===================================================== */

.zp-foto-metall-guide .hero {
      padding:42px 0 58px;

      background:
        radial-gradient(
          850px 430px at 100% -8%,
          rgba(110,64,149,.13),
          transparent 65%
        ),
        linear-gradient(
          180deg,
          #faf8fb 0%,
          #fff 100%
        );
    }


.zp-foto-metall-guide .breadcrumbs {
      display:flex;
      flex-wrap:wrap;

      gap:8px;

      margin:0 0 29px;

      color:#6e6671;

      font-size:14px;
    }


.zp-foto-metall-guide .breadcrumbs a {
      color:#514852;
      text-decoration:none;
    }


.zp-foto-metall-guide .hero__grid {
      display:grid;

      grid-template-columns:
        minmax(0,1.05fr)
        minmax(390px,.95fr);

      gap:56px;
      align-items:center;
    }


.zp-foto-metall-guide .hero__label {
      display:block;

      margin:0 0 11px;

      color:#684775;

      font-size:14px;
      font-weight:800;
    }


.zp-foto-metall-guide .hero h1 {
      max-width:830px;

      margin:0;

      color:var(--heading);

      font-size:clamp(39px,4.7vw,59px);
      line-height:1.045;
      letter-spacing:-.052em;
    }


.zp-foto-metall-guide .hero__lead {
      max-width:730px;

      margin:22px 0 0;

      color:#4f4652;

      font-size:18px;
      line-height:1.64;
    }


.zp-foto-metall-guide .hero__safe {
      max-width:680px;

      margin-top:21px;
      padding:16px 18px;

      border:1px solid #ddcfe4;
      border-radius:14px;

      background:#f0eaf4;

      color:#403344;

      font-size:15px;
      line-height:1.58;
    }


.zp-foto-metall-guide .hero__safe strong {
      color:#302037;
    }


.zp-foto-metall-guide .hero-photo {
      position:relative;

      margin:0;

      overflow:hidden;

      border-radius:28px;

      background:#eee9ef;

      box-shadow:var(--shadow-big);
    }


.zp-foto-metall-guide .hero-photo img {
      display:block;

      width:100%;
      height:510px;

      object-fit:cover;
    }


.zp-foto-metall-guide .hero-photo figcaption {
      position:absolute;
      left:16px;
      bottom:16px;

      padding:9px 12px;

      border-radius:10px;

      background:#291c2e;
      color:#fff;

      font-size:13px;
      line-height:1.35;
      font-weight:800;
    }


    /* =====================================================
       TRUST
       ===================================================== */

.zp-foto-metall-guide .trust-strip {
      background:#fff;

      border-top:1px solid var(--border);
      border-bottom:1px solid var(--border);
    }


.zp-foto-metall-guide .trust-strip__grid {
      display:grid;
      grid-template-columns:repeat(4,1fr);
    }


.zp-foto-metall-guide .trust-item {
      min-height:80px;

      display:flex;
      align-items:center;

      padding:17px 21px;

      border-right:1px solid var(--border);

      color:#443b47;

      font-size:14px;
      line-height:1.45;
      font-weight:750;
    }


.zp-foto-metall-guide .trust-item:last-child {
      border-right:0;
    }


.zp-foto-metall-guide .trust-check {
      width:23px;
      height:23px;

      display:grid;
      place-items:center;

      flex:0 0 23px;

      margin-right:11px;

      border-radius:50%;

      background:var(--green-soft);
      color:var(--green);

      font-size:11px;
      font-weight:900;
    }


    /* =====================================================
       ANCHORS
       ===================================================== */

.zp-foto-metall-guide .anchor-nav {
      background:#fff;

      border-bottom:1px solid var(--border);
    }


.zp-foto-metall-guide .anchor-nav__inner {
      min-height:59px;

      display:flex;
      align-items:center;

      gap:27px;

      overflow-x:auto;
      scrollbar-width:none;
    }


.zp-foto-metall-guide .anchor-nav__inner::-webkit-scrollbar {
      display:none;
    }


.zp-foto-metall-guide .anchor-nav a {
      flex:0 0 auto;

      padding:18px 0;

      color:#493f4c;

      font-size:14px;
      font-weight:800;

      text-decoration:none;
    }


.zp-foto-metall-guide .anchor-nav a:hover {
      color:var(--purple);
    }


    /* =====================================================
       PLACEHOLDERS / MEDIA
       ===================================================== */

.zp-foto-metall-guide .photo-placeholder {
      min-height:320px;

      display:grid;
      place-items:center;

      padding:28px;

      border:1px dashed #c8bbcf;
      border-radius:21px;

      background:
        linear-gradient(
          135deg,
          #f7f4f9,
          #eee8f2
        );

      color:#675b6d;

      text-align:center;

      font-size:14px;
      line-height:1.55;
    }


.zp-foto-metall-guide .photo-placeholder strong {
      display:block;

      margin-bottom:6px;

      color:#38283f;

      font-size:16px;
    }


    /* =====================================================
       SPLIT
       ===================================================== */

.zp-foto-metall-guide .split {
      display:grid;

      grid-template-columns:
        minmax(0,.9fr)
        minmax(440px,1.1fr);

      gap:55px;
      align-items:center;
    }


.zp-foto-metall-guide .copy p {
      color:var(--muted);

      font-size:16px;
      line-height:1.7;
    }


.zp-foto-metall-guide .copy strong {
      color:#34243b;
    }


    /* =====================================================
       QUALITY
       ===================================================== */

.zp-foto-metall-guide .quality-grid {
      display:grid;

      grid-template-columns:
        minmax(0,1fr)
        minmax(360px,.78fr);

      gap:55px;
      align-items:center;
    }


.zp-foto-metall-guide .quality-note {
      margin-top:21px;
      padding:18px 20px;

      border-left:4px solid var(--purple);
      border-radius:0 14px 14px 0;

      background:#fff;

      color:#493e4c;

      font-size:15px;
      line-height:1.62;
    }


.zp-foto-metall-guide .quality-note strong {
      color:#342039;
    }


.zp-foto-metall-guide .quality-step {
      display:grid;

      grid-template-columns:45px 1fr;

      gap:14px;
      align-items:center;

      padding:18px;

      border:1px solid #d8cede;
      border-radius:17px;

      background:#fff;
    }


.zp-foto-metall-guide .quality-step + .quality-step {
      margin-top:11px;
    }


.zp-foto-metall-guide .quality-step__n {
      width:45px;
      height:45px;

      display:grid;
      place-items:center;

      border-radius:13px;

      background:var(--purple);
      color:#fff !important;

      font-size:14px;
      font-weight:900;
    }


.zp-foto-metall-guide .quality-step strong {
      display:block;

      margin-bottom:3px;

      color:#332039;
    }


/* text under title — not the number badge */
.zp-foto-metall-guide .quality-step > div > span,
.zp-foto-metall-guide .quality-step > div span:not(.quality-step__n) {
      color:#625a65;

      font-size:14px;
      line-height:1.45;
    }


    /* =====================================================
       SOFT CARD
       ===================================================== */

.zp-foto-metall-guide .soft-card {
      margin-top:26px;
      padding:25px 27px;

      border:1px solid var(--border);
      border-radius:21px;

      background:#fff;
    }


.zp-foto-metall-guide .soft-card h3 {
      margin:0 0 9px;

      color:#332039;

      font-size:21px;
    }


.zp-foto-metall-guide .soft-card p {
      margin:0;

      color:var(--muted);

      font-size:15px;
      line-height:1.65;
    }


    /* =====================================================
       TRANSFORM
       ===================================================== */

.zp-foto-metall-guide .transform {
      display:grid;

      grid-template-columns:
        1fr 48px 1fr 48px 1fr;

      gap:12px;
      align-items:center;

      margin-top:32px;
    }


.zp-foto-metall-guide .transform__arrow {
      display:grid;
      place-items:center;

      color:#7c6688;

      font-size:25px;
    }


.zp-foto-metall-guide .transform__visual {
      overflow:hidden;

      min-height:275px;

      border:1px solid var(--border);
      border-radius:19px;

      background:#f4eff6;
    }


.zp-foto-metall-guide .transform__visual img {
      display:block;

      width:100%;
      height:275px;

      object-fit:cover;
    }


.zp-foto-metall-guide .transform__placeholder {
      min-height:275px;

      display:grid;
      place-items:center;

      padding:22px;

      color:#665b6c;

      text-align:center;

      font-size:14px;
    }


.zp-foto-metall-guide .transform__placeholder strong {
      display:block;

      margin-bottom:5px;

      color:#37263e;

      font-size:16px;
    }


.zp-foto-metall-guide .transform__label {
      margin-top:10px;

      color:#3e3343;

      text-align:center;

      font-size:14px;
      font-weight:800;
    }


    /* =====================================================
       DARK MOCKUP
       ===================================================== */

.zp-foto-metall-guide .mockup-section {
      padding:78px 0;

      background:
        radial-gradient(
          720px 400px at 100% 10%,
          rgba(181,134,208,.20),
          transparent 65%
        ),
        #321940;

      color:#fff;
    }


.zp-foto-metall-guide .mockup-section .kicker {
      color:#ddcce8;
    }


.zp-foto-metall-guide .mockup-section .h2 {
      color:#fff;
    }


.zp-foto-metall-guide .mockup-section .lead {
      color:#ece3ef;
    }


.zp-foto-metall-guide .mockup-section p {
      color:#ece3ef;
    }


.zp-foto-metall-guide .mockup-section strong {
      color:#fff;
    }


.zp-foto-metall-guide .mockup-grid {
      display:grid;

      grid-template-columns:
        minmax(0,.86fr)
        minmax(430px,1.14fr);

      gap:52px;
      align-items:center;
    }


.zp-foto-metall-guide .mockup-points {
      display:grid;
      grid-template-columns:1fr 1fr;

      gap:10px;

      margin-top:25px;
    }


.zp-foto-metall-guide .mockup-point {
      padding:15px;

      border:1px solid rgba(255,255,255,.15);
      border-radius:14px;

      background:rgba(255,255,255,.08);

      color:#f5eff7;

      font-size:14px;
      line-height:1.45;
    }


.zp-foto-metall-guide .mockup-point strong {
      display:block;

      margin-bottom:4px;

      color:#fff;
    }


    /* =====================================================
       FEATURES
       ===================================================== */

.zp-foto-metall-guide .features {
      display:grid;
      grid-template-columns:repeat(4,1fr);

      gap:14px;

      margin-top:32px;
    }


.zp-foto-metall-guide .feature {
      padding:22px;

      border:1px solid var(--border);
      border-radius:18px;

      background:#fff;
    }


.zp-foto-metall-guide .feature__icon {
      width:34px;
      height:34px;

      display:grid;
      place-items:center;

      margin-bottom:14px;

      border-radius:11px;

      background:#f0eaf4;
      color:#5b3670;

      font-size:14px;
      font-weight:900;
    }


.zp-foto-metall-guide .feature h3 {
      margin:0 0 7px;

      color:#332039;

      font-size:17px;
    }


.zp-foto-metall-guide .feature p {
      margin:0;

      color:var(--muted);

      font-size:14px;
      line-height:1.55;
    }


    /* =====================================================
       PHOTO CATEGORIES
       ===================================================== */

.zp-foto-metall-guide .photo-categories {
      display:grid;
      grid-template-columns:repeat(3,1fr);

      gap:16px;

      margin-top:31px;
    }


.zp-foto-metall-guide .photo-category {
      position:relative;

      min-height:330px;

      overflow:hidden;

      border-radius:20px;

      background:#eee9ef;
    }


.zp-foto-metall-guide .photo-category img {
      display:block;

      width:100%;
      height:330px;

      object-fit:cover;
    }


.zp-foto-metall-guide .photo-category__empty {
      height:330px;

      display:grid;
      place-items:center;

      padding:28px;

      background:
        radial-gradient(
          circle at 70% 20%,
          rgba(118,77,141,.12),
          transparent 40%
        ),
        linear-gradient(
          135deg,
          #f6f2f8,
          #ebe5ef
        );

      color:#6d6172;

      text-align:center;

      font-size:14px;
      line-height:1.5;
    }


.zp-foto-metall-guide .photo-category__label {
      position:absolute;
      left:12px;
      bottom:12px;

      padding:8px 11px;

      border-radius:9px;

      background:#291c2e;
      color:#fff;

      font-size:13px;
      font-weight:800;
    }


    /* =====================================================
       SURFACE
       ===================================================== */

.zp-foto-metall-guide .surface-grid {
      display:grid;

      grid-template-columns:
        minmax(0,.88fr)
        minmax(430px,1.12fr);

      gap:55px;
      align-items:center;
    }


.zp-foto-metall-guide .surface-note {
      margin-top:23px;
      padding:20px 22px;

      border:1px solid #ddd2e2;
      border-radius:17px;

      background:#f2edf5;
    }


.zp-foto-metall-guide .surface-note strong {
      display:block;

      margin-bottom:6px;

      color:#3a2941;
    }


.zp-foto-metall-guide .surface-note p {
      margin:0;

      color:#5b535e;

      font-size:15px;
      line-height:1.6;
    }


    /* =====================================================
       SIZE — ONLY 30×40 / 40×60 / 80×60
       ===================================================== */

.zp-foto-metall-guide .size-grid {
      display:grid;

      grid-template-columns:
        minmax(0,.9fr)
        minmax(430px,1.1fr);

      gap:55px;
      align-items:center;
    }


.zp-foto-metall-guide .size-table {
      margin-top:27px;

      border-top:1px solid var(--border);
    }


.zp-foto-metall-guide .size-row {
      display:grid;

      grid-template-columns:170px 1fr;

      gap:20px;

      padding:19px 0;

      border-bottom:1px solid var(--border);
    }


.zp-foto-metall-guide .size-row strong {
      color:#382140;

      font-size:17px;
      line-height:1.4;
    }


.zp-foto-metall-guide .size-row span {
      color:var(--muted);

      font-size:16px;
      line-height:1.55;
    }


.zp-foto-metall-guide .wall-card {
      display:grid;

      grid-template-columns:1fr auto;

      gap:28px;
      align-items:center;

      margin-top:28px;
      padding:25px 27px;

      border:1px solid #d9cce0;
      border-radius:20px;

      background:#f2edf5;
    }


.zp-foto-metall-guide .wall-card h3 {
      margin:0 0 6px;

      color:#38253f;

      font-size:19px;
    }


.zp-foto-metall-guide .wall-card p {
      margin:0;

      color:#5a515e;

      font-size:15px;
      line-height:1.58;
    }


    /* =====================================================
       PACKAGE
       ===================================================== */

.zp-foto-metall-guide .package {
      display:grid;
      grid-template-columns:repeat(3,1fr);

      gap:14px;

      margin-top:32px;
    }


.zp-foto-metall-guide .package__item {
      padding:22px;

      border:1px solid var(--border);
      border-radius:18px;

      background:#fff;
    }


.zp-foto-metall-guide .package__n {
      display:block;

      margin-bottom:12px;

      color:#765683;

      font-size:12px;
      font-weight:900;
    }


.zp-foto-metall-guide .package__item h3 {
      margin:0 0 7px;

      color:#322039;

      font-size:17px;
    }


.zp-foto-metall-guide .package__item p {
      margin:0;

      color:var(--muted);

      font-size:14px;
      line-height:1.55;
    }


    /* =====================================================
       MOUNT
       ===================================================== */

.zp-foto-metall-guide .mount-grid {
      display:grid;

      grid-template-columns:
        minmax(0,.9fr)
        minmax(430px,1.1fr);

      gap:55px;
      align-items:center;
    }


    /* =====================================================
       PROCESS
       ===================================================== */

.zp-foto-metall-guide .process {
      display:grid;
      grid-template-columns:repeat(3,1fr);

      gap:14px;

      margin-top:32px;
    }


.zp-foto-metall-guide .process__item {
      padding:23px;

      border:1px solid var(--border);
      border-radius:18px;

      background:#fff;
    }


.zp-foto-metall-guide .process__step {
      display:block;

      margin-bottom:16px;

      color:#765a83;

      font-size:12px;
      font-weight:900;
    }


.zp-foto-metall-guide .process__item h3 {
      margin:0 0 7px;

      color:#322039;

      font-size:17px;
    }


.zp-foto-metall-guide .process__item p {
      margin:0;

      color:var(--muted);

      font-size:14px;
      line-height:1.58;
    }


    /* =====================================================
       RISK
       ===================================================== */

.zp-foto-metall-guide .risks {
      display:grid;
      grid-template-columns:repeat(3,1fr);

      gap:14px;

      margin-top:32px;
    }


.zp-foto-metall-guide .risk {
      padding:22px;

      border:1px solid var(--border);
      border-radius:18px;

      background:#fff;
    }


.zp-foto-metall-guide .risk__check {
      width:25px;
      height:25px;

      display:grid;
      place-items:center;

      margin-bottom:14px;

      border-radius:50%;

      color:var(--green);
      background:var(--green-soft);

      font-size:12px;
      font-weight:900;
    }


.zp-foto-metall-guide .risk h3 {
      margin:0 0 7px;

      color:#33203b;

      font-size:17px;
    }


.zp-foto-metall-guide .risk p {
      margin:0;

      color:var(--muted);

      font-size:14px;
      line-height:1.55;
    }


    /* =====================================================
       INFO CARDS
       ===================================================== */

.zp-foto-metall-guide .two-cards {
      display:grid;
      grid-template-columns:1fr 1fr;

      gap:18px;
    }


.zp-foto-metall-guide .info-card {
      padding:30px;

      border:1px solid var(--border);
      border-radius:22px;

      background:#fff;
    }


.zp-foto-metall-guide .info-card h2 {
      margin:0 0 11px;

      color:#302039;

      font-size:26px;
      line-height:1.15;
    }


.zp-foto-metall-guide .info-card p {
      margin:0;

      color:var(--muted);

      font-size:15px;
      line-height:1.64;
    }


    /* =====================================================
       CARE
       ===================================================== */

.zp-foto-metall-guide .care {
      display:grid;
      grid-template-columns:repeat(4,1fr);

      gap:12px;

      margin-top:29px;
    }


.zp-foto-metall-guide .care__item {
      padding:18px;

      border:1px solid var(--border);
      border-radius:16px;

      background:#fff;

      color:#554d59;

      font-size:14px;
      line-height:1.5;
    }


    /* =====================================================
       TECH
       ===================================================== */

.zp-foto-metall-guide .tech {
      max-width:900px;

      margin-top:29px;

      border-top:1px solid var(--border);
      border-bottom:1px solid var(--border);
    }


.zp-foto-metall-guide .tech summary {
      position:relative;

      padding:21px 45px 21px 0;

      cursor:pointer;
      list-style:none;

      color:#322039;

      font-size:17px;
      font-weight:800;
    }


.zp-foto-metall-guide .tech summary::-webkit-details-marker {
      display:none;
    }


.zp-foto-metall-guide .tech summary::after {
      content:"+";

      position:absolute;
      right:4px;
      top:50%;

      transform:translateY(-50%);

      color:#755d82;

      font-size:27px;
    }


.zp-foto-metall-guide .tech[open] summary::after {
      content:"−";
    }


.zp-foto-metall-guide .tech__body {
      padding:0 0 23px;

      color:#59515d;

      font-size:15px;
      line-height:1.7;
    }


.zp-foto-metall-guide .tech__body p {
      margin:0 0 12px;
    }


    /* =====================================================
       FAQ
       ===================================================== */

.zp-foto-metall-guide .accordion {
      max-width:910px;

      margin-top:29px;

      border-top:1px solid var(--border);
    }


.zp-foto-metall-guide .accordion details {
      border-bottom:1px solid var(--border);
    }


.zp-foto-metall-guide .accordion summary {
      position:relative;

      padding:22px 48px 22px 0;

      cursor:pointer;
      list-style:none;

      color:#322039;

      font-size:17px;
      line-height:1.4;
      font-weight:800;
    }


.zp-foto-metall-guide .accordion summary::-webkit-details-marker {
      display:none;
    }


.zp-foto-metall-guide .accordion summary::after {
      content:"+";

      position:absolute;
      right:4px;
      top:50%;

      transform:translateY(-50%);

      color:#755d82;

      font-size:28px;
    }


.zp-foto-metall-guide .accordion details[open] summary::after {
      content:"−";
    }


.zp-foto-metall-guide .accordion__body {
      max-width:830px;

      padding:0 0 22px;

      color:#59515c;

      font-size:16px;
      line-height:1.68;
    }


    /* =====================================================
       FINAL
       ===================================================== */

.zp-foto-metall-guide .final {
      padding:74px 0 82px;
    }


.zp-foto-metall-guide .final-box {
      overflow:hidden;

      padding:54px;

      border-radius:30px;

      background:
        radial-gradient(
          520px 270px at 95% 0%,
          rgba(190,145,216,.20),
          transparent 65%
        ),
        #321940;

      color:#fff;

      box-shadow:
        0 22px 60px rgba(42,19,51,.16);
    }


.zp-foto-metall-guide .final-box .kicker {
      color:#ddcde6;
    }


.zp-foto-metall-guide .final-box h2 {
      max-width:760px;

      margin:0;

      color:#fff;

      font-size:clamp(33px,4vw,48px);
      line-height:1.075;
      letter-spacing:-.045em;
    }


.zp-foto-metall-guide .final-box p {
      max-width:700px;

      margin:15px 0 0;

      color:#f0e8f2;

      font-size:16px;
      line-height:1.64;
    }


.zp-foto-metall-guide .final-box strong {
      color:#fff;
    }


.zp-foto-metall-guide .final-box .btn--primary {
      color:#321940;
      background:#fff;

      box-shadow:none;
    }


.zp-foto-metall-guide .final-box .btn--secondary {
      color:#fff;
      background:#513260;

      border-color:#a58caf;
    }


.zp-foto-metall-guide .final-hint {
      color:#d9cade !important;

      font-size:13px !important;
    }


    /* =====================================================
       FOOTER
       ===================================================== */

















    /* =====================================================
       MOBILE BAR
       ===================================================== */



    /* =====================================================
       RESPONSIVE
       ===================================================== */

    @media(max-width:1000px){

      .site-nav,


      .hero__grid,
      .split,
      .quality-grid,
      .mockup-grid,
      .surface-grid,
      .size-grid,
      .mount-grid{
        grid-template-columns:1fr;
      }

      .trust-strip__grid{
        grid-template-columns:1fr 1fr;
      }

      .transform{
        grid-template-columns:1fr;
      }

      .transform__arrow{
        transform:rotate(90deg);
      }

      .features,
      .package,
      .process,
      .risks,
      .photo-categories{
        grid-template-columns:1fr 1fr;
      }

      .two-cards{
        grid-template-columns:1fr;
      }

      .care{
        grid-template-columns:1fr 1fr;
      }


    }


    @media(max-width:700px){

      .zp-foto-metall-guide{
        --header-h:70px;
      }

      body{
        padding-bottom:70px;
      }

      .wrap{
        width:calc(100% - 28px);
      }



      .section{
        padding:49px 0;
      }

      .h2{
        font-size:30px;
        line-height:1.12;
      }

      .lead{
        font-size:16px;
      }

      .hero{
        padding:25px 0 42px;
      }

      .hero h1{
        font-size:35px;
        line-height:1.065;
      }

      .hero__lead{
        font-size:16px;
      }

      .hero-photo img{
        height:380px;
      }

      .actions{
        flex-direction:column;
      }

      .btn{
        width:100%;
      }

      .trust-strip__grid,
      .features,
      .package,
      .process,
      .risks,
      .photo-categories,
      .care{
        grid-template-columns:1fr;
      }

      .trust-item{
        border-right:0;
        border-bottom:1px solid var(--border);
      }

      .transform__visual,
      .transform__visual img,
      .transform__placeholder{
        min-height:230px;
        height:230px;
      }

      .mockup-section{
        padding:52px 0;
      }

      .mockup-points{
        grid-template-columns:1fr;
      }

      .size-row{
        grid-template-columns:1fr;
        gap:5px;
      }

      .wall-card{
        grid-template-columns:1fr;
      }

      .final{
        padding:48px 0 58px;
      }

      .final-box{
        padding:32px 22px;
      }

      .final-box h2{
        font-size:30px;
      }






    }

/* === site collisions (canon from 2026-09-07 root-cause) === */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 110px;
}
.zp-foto-metall-guide {
  --wrap: 1180px;
}
.zp-foto-metall-guide .wrap {
  width: min(var(--wrap), calc(100% - 40px)) !important;
  margin-inline: auto !important;
  max-width: none;
}
.zp-foto-metall-guide > section.hero {
  display: block !important;
  min-height: 0 !important;
  height: auto !important;
  padding-top: 28px;
  padding-bottom: 40px;
}
.zp-foto-metall-guide section.hero > .wrap {
  display: block !important;
}
.zp-foto-metall-guide nav.anchor-nav {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  gap: normal !important;
  background: #fff;
  border-bottom: 1px solid var(--border);
}
.zp-foto-metall-guide .anchor-nav__inner {
  display: flex !important;
  align-items: center !important;
  gap: 27px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto;
  scrollbar-width: none;
  min-height: 59px;
  width: min(var(--wrap), calc(100% - 40px)) !important;
  margin-inline: auto !important;
}
.zp-foto-metall-guide .anchor-nav__inner::-webkit-scrollbar { display: none; }
.zp-foto-metall-guide .anchor-nav a {
  flex: 0 0 auto !important;
  white-space: nowrap;
  text-decoration: none !important;
  color: #49434d !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  padding: 18px 0;
}
.zp-foto-metall-guide .anchor-nav a:hover { color: var(--purple) !important; }
.zp-foto-metall-guide .anchor-nav a:after { content: none !important; display: none !important; }
.zp-foto-metall-guide .btn--primary {
  background: var(--purple) !important;
  color: #fff !important;
  border-color: transparent !important;
}
.zp-foto-metall-guide .btn--primary:hover {
  background: var(--purple-hover) !important;
  color: #fff !important;
}
.zp-foto-metall-guide .btn--secondary {
  background: #fff !important;
  color: #432151 !important;
}
.zp-foto-metall-guide .btn[data-zp-contacts-open] { cursor: pointer; }
.zp-foto-metall-guide .hero-photo img,
.zp-foto-metall-guide .transform__visual img,
.zp-foto-metall-guide .photo-category img,
.zp-foto-metall-guide .photo-placeholder img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.zp-foto-metall-guide .photo-placeholder {
  padding: 0 !important;
  overflow: hidden;
}
.zp-foto-metall-guide .photo-category__empty { display: none !important; }
@media (max-width: 700px) {
  .zp-foto-metall-guide > section.hero { padding-top: 18px; padding-bottom: 28px; }
}