/* Vzhled stránky Badante. Tento soubor NENÍ potřeba upravovat. */

:root{
    --paper:#d5c3a1;
    --paper-light:#e6dac2;
    --ink:#3a281a;
    --ink-strong:#4a2410;
    --gold:#9a7b3f;
    --rose:#c98f8f;
    --rule:rgba(110,80,45,.32);
    --script:"Great Vibes","Segoe Script","Brush Script MT",cursive;
    --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
    --body:"Lora",Georgia,"Times New Roman",serif;
  }
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{
    margin:0;
    font-family:var(--body);
    color:var(--ink);
    font-size:clamp(1rem,.95rem + .35vw,1.15rem);
    line-height:1.65;
    background-color:var(--paper);
    background-image:url("img/pozadi-papir.jpg");
    background-size:340px 340px;
  }
  .sheet{
    max-width:1120px;
    margin:0 auto;
    padding:clamp(1.5rem,4vw,4rem) clamp(1.25rem,4vw,3.5rem) clamp(2rem,4vw,3rem);
    position:relative;
    overflow:hidden;
  }
  /* soft parchment lighting so the tiled texture doesn't read as a flat swatch */
  .sheet::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:
      radial-gradient(120% 80% at 50% 0%,rgba(255,250,235,.55),rgba(255,250,235,0) 60%),
      radial-gradient(90% 70% at 10% 100%,rgba(120,85,45,.16),rgba(120,85,45,0) 70%);
  }
  .sheet > *{position:relative}

  a{color:var(--ink-strong)}
  a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}

  /* ---------- decorative sprigs ---------- */
  .sprig{position:absolute;pointer-events:none;opacity:.9;z-index:0}

  /* ---------- hero ---------- */
  .hero{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
  .portrait{margin:0}
  .portrait img{
    display:block;width:100%;height:auto;
    -webkit-mask-image:radial-gradient(ellipse 78% 78% at 50% 50%,#000 55%,transparent 100%);
            mask-image:radial-gradient(ellipse 78% 78% at 50% 50%,#000 55%,transparent 100%);
  }
  .brand{text-align:center}
  .logo{
    font-family:var(--script);
    font-size:clamp(3.4rem,9vw,6.2rem);
    line-height:.95;
    color:#4a2b14;
    margin:0;
    font-weight:400;
    text-shadow:0 1px 0 rgba(255,245,225,.5);
  }
  .logo-rule{display:flex;align-items:center;justify-content:center;gap:.6rem;margin:.5rem auto .35rem;max-width:16rem}
  .logo-rule::before,.logo-rule::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--rule),transparent)}
  .logo-rule span{width:5px;height:5px;border-radius:50%;background:var(--rose)}
  .kicker{
    font-family:var(--display);
    font-size:clamp(1rem,.88rem + .7vw,1.4rem);
    letter-spacing:.14em;
    text-transform:none;
    color:#5c4224;
    margin:0 0 clamp(1.2rem,3vw,2.2rem);
    text-wrap:balance;
  }
  .hero h1{
    font-family:var(--display);
    font-weight:600;
    font-size:clamp(1.9rem,1.2rem + 3.2vw,3.4rem);
    line-height:1.12;
    color:var(--ink-strong);
    margin:0 0 .5rem;
    text-wrap:balance;
  }
  .hero .lede{
    font-family:var(--display);
    font-size:clamp(1.1rem,.95rem + .9vw,1.6rem);
    line-height:1.35;
    margin:0;
    color:#4d3520;
    text-wrap:balance;
  }

  /* ---------- services ---------- */
  .services{margin-top:clamp(2.5rem,7vw,5rem)}
  .service{max-width:34rem}
  .service h2{
    font-family:var(--display);
    font-weight:700;
    font-size:clamp(1.4rem,1.1rem + 1.5vw,2.1rem);
    color:var(--ink-strong);
    margin:0 0 .7rem;
    display:flex;gap:.55rem;align-items:baseline;
  }
  .service h2 .tick{color:var(--gold);font-family:var(--body);font-size:.85em;line-height:1}
  .service ul{list-style:none;margin:0;padding:0 0 0 .35rem}
  .service li{position:relative;padding-left:1.4rem;margin:.45rem 0}
  .service li::before{
    content:"";position:absolute;left:.15rem;top:.68em;
    width:6px;height:6px;border-radius:50%;background:#7a3f2a;
  }
  .divider{display:block;margin:clamp(1.8rem,4vw,2.8rem) 0;width:min(22rem,70%);height:auto;opacity:.85}
  .with-photo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);gap:clamp(1rem,3vw,2.5rem);align-items:center}
  .with-photo .portrait img{
    -webkit-mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,#000 58%,transparent 100%);
            mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,#000 58%,transparent 100%);
  }

  /* ---------- signature / contact ---------- */
  .signature{margin-top:clamp(2.5rem,7vw,4.5rem);max-width:34rem}
  .signature .name{
    font-family:var(--script);
    font-size:clamp(2.4rem,1.4rem + 4vw,4rem);
    line-height:1.05;
    color:#3d2410;
    margin:0;
    font-weight:400;
  }
  .signature .role{
    font-family:var(--display);
    font-style:italic;
    font-size:clamp(1.05rem,.95rem + .6vw,1.4rem);
    margin:.1rem 0 1.3rem;
    color:#4d3520;
  }
  .contact{list-style:none;margin:0;padding:0;display:grid;gap:.85rem}
  .contact li{display:flex;align-items:center;gap:.85rem}
  .contact a{text-decoration:none;border-bottom:1px solid rgba(110,80,45,.35);transition:border-color .2s,color .2s}
  .contact a:hover{color:#7a3f2a;border-bottom-color:#7a3f2a}
  .contact .value{font-size:clamp(1.05rem,1rem + .4vw,1.3rem);letter-spacing:.01em}
  .ico{
    flex:0 0 auto;width:2.05rem;height:2.05rem;border-radius:50%;
    display:grid;place-items:center;
    background:#4a2b14;color:#efe3cb;
    box-shadow:0 1px 2px rgba(60,40,20,.3);
  }
  .ico svg{width:1.05rem;height:1.05rem;fill:currentColor}

  .actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.9rem}
  .btn{
    font-family:var(--display);font-weight:600;
    font-size:1.05rem;letter-spacing:.04em;
    text-decoration:none;
    padding:.7rem 1.6rem;
    border:1px solid #8a6534;
    color:#3d2410;
    background:rgba(255,248,232,.35);
    transition:background .2s,color .2s,border-color .2s;
  }
  .btn:hover{background:#4a2b14;color:#f2e7d1;border-color:#4a2b14}
  .btn--quiet{background:transparent}

  /* ---------- pricing ---------- */
  .pricing{margin-top:clamp(2.5rem,7vw,4.5rem);max-width:34rem}
  .pricing h2{
    font-family:var(--display);
    font-weight:700;
    font-size:clamp(1.4rem,1.1rem + 1.5vw,2.1rem);
    color:var(--ink-strong);
    margin:0 0 1.2rem;
  }
  .price-list{list-style:none;margin:0;padding:0}
  .price-list li{
    display:flex;align-items:baseline;gap:.6rem;
    padding:.6rem 0;
    border-bottom:1px dotted rgba(110,80,45,.4);
  }
  .price-list li:last-child{border-bottom:0}
  .price-list .item{flex:1 1 auto}
  .price-list .amount{
    font-family:var(--display);
    font-weight:600;
    font-size:clamp(1.15rem,1rem + .6vw,1.5rem);
    color:var(--ink-strong);
    white-space:nowrap;
  }
  .price-note{
    font-family:var(--display);
    font-style:italic;
    font-size:1.02rem;
    color:#5c4224;
    margin:1.1rem 0 0;
  }

  /* ---------- closing ---------- */
  .closing{
    margin:clamp(2.5rem,7vw,4.5rem) auto 0;
    padding-top:clamp(1.2rem,3vw,2rem);
    max-width:44rem;text-align:center;
    font-family:var(--display);font-style:italic;
    font-size:clamp(1.1rem,.95rem + .9vw,1.6rem);
    color:#4a3220;
    border-top:1px solid var(--rule);
    text-wrap:balance;
  }
  footer{
    text-align:center;font-size:.82rem;letter-spacing:.04em;
    color:rgba(58,40,26,.7);padding:2.5rem 1rem 3rem;
  }

  /* ---------- responsive ---------- */
  @media (max-width:820px){
    .hero,.with-photo{grid-template-columns:1fr}
    .hero{gap:1rem}
    .portrait{max-width:26rem;margin-inline:auto}
    .brand{order:-1}
    .service h2{display:block}
    .service h2 .tick{margin-right:.4rem}
    .divider{margin-inline:auto;width:min(18rem,80%)}
    .service,.signature{max-width:none}
    .sprig{display:none}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation:none !important;transition:none !important}
  }
  @media print{
    body{background:#fff}
    .actions{display:none}
  }