/* Spoločný štýl osobného webu. Všetky komponenty rozširuj tu. Pozri STAVEBNICA.md. */
:root{--coral:#f88379;--ink:#2d2b29;--muted:#635c57;--paper:#fffdf9;--cream:#f6f1eb;--pale:#ffebe6;--rule:#dbd1c7;--white:#fff;--web:#e9f3f3;--life:#fff3c4;--accent:#a33f36;--body:Arial,Helvetica,sans-serif;--heading:Georgia,'Times New Roman',serif;--max:1160px;--radius:4px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:115px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.7}p{margin:0 0 22px;max-width:700px}a{color:inherit;text-decoration:none}a,button,input,textarea{ -webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.wrap{max-width:var(--max);width:calc(100% - 96px);margin-inline:auto}.preview-note{background:var(--ink);color:var(--white);text-align:center;font-size:12px;padding:7px 16px;letter-spacing:.02em}.preview-note span{padding:0 8px}.header{background:var(--paper);border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:5}.nav-wrap{display:flex;align-items:center;justify-content:space-between;min-height:100px}.brand{position:relative;display:block;width:275px;height:76px;overflow:hidden;flex-shrink:0}.brand img{position:absolute;width:310px;height:auto;left:-16px;top:-44px;mix-blend-mode:multiply}nav{display:flex;gap:36px;align-items:center}nav a{font-size:15px;padding:12px 0}nav a:last-child{border-bottom:1px solid var(--ink)}nav a:hover{color:var(--accent)}nav span{margin-left:12px}.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:36px 64px;padding-top:68px;padding-bottom:70px}.eyebrow{font-size:12px;letter-spacing:.18em;font-weight:700;margin-bottom:23px}.hero h1{font-family:var(--heading);font-weight:400;font-size:clamp(54px,5.6vw,79px);line-height:1.05;letter-spacing:-.045em;margin:0 0 26px}em{font-family:var(--heading);font-weight:400}.hero h1 em{color:var(--accent)}.motto{font-family:var(--heading);font-style:italic;font-size:25px;line-height:1.45;margin-bottom:26px}.hero-copy>p:not(.eyebrow):not(.motto){max-width:520px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:50px;background:var(--coral);color:var(--ink);border:1px solid transparent;border-radius:var(--radius);font:700 16px var(--body);padding:18px 24px;min-height:58px;cursor:pointer;transition:background .2s,transform .2s}.button:hover{background:#f99c94;transform:translateY(-2px)}.button span{font-size:23px;line-height:1}.hero-picture{position:relative;margin:30px 0 0;align-self:start;padding:0 20px 22px 0}.portrait-frame{position:relative;z-index:1;overflow:hidden;border-radius:200px 200px 8px 8px;aspect-ratio:.85;background:var(--cream)}.portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:57% center}.hero-picture:before{content:'';position:absolute;background:var(--coral);inset:22px 0 23px 26px;border-radius:200px 200px 8px 8px}.hero-picture figcaption{position:relative;z-index:2;display:inline-block;background:var(--paper);font:italic 23px var(--heading);padding:15px 25px;transform:rotate(-4deg);margin:-18px 0 0 -20px}.picture-dot{position:absolute;z-index:2;right:-5px;top:50px;width:60px;height:60px;border-radius:50%;background:var(--coral)}.hero-invitation{grid-column:1/-1;display:flex;align-items:flex-start;gap:34px;padding-top:25px;max-width:960px;margin:auto}.hero-invitation .line{width:72px;height:2px;background:var(--coral);margin-top:15px;flex-shrink:0}.hero-invitation p{max-width:810px;margin:0;font-size:18px}.hero-invitation strong{font-weight:400}.section{padding-top:100px;padding-bottom:100px}h2{font-family:var(--heading);font-size:clamp(36px,3.8vw,53px);font-weight:400;line-height:1.17;letter-spacing:-.03em;margin:0 0 32px}h2 em{color:var(--accent)}.about{background:var(--cream)}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.about-photo img{display:block;width:100%;height:auto;border-radius:var(--radius)}.photo-caption{font:italic 21px var(--heading);margin:22px 0 0}.photo-caption span{display:block;font:12px var(--body);letter-spacing:.03em;color:var(--muted);margin-top:9px}.about-copy p:last-child{margin-bottom:0}.section-top{text-align:center;margin-bottom:50px}.section-top .eyebrow{margin-inline:auto}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.project{padding:30px 28px;display:flex;flex-direction:column;border-radius:var(--radius)}.project-web{background:var(--web)}.project-club{background:var(--pale)}.project-life{background:var(--life)}.project-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:33px}.number{font:italic 28px var(--heading)}.project-category{font-size:9px;font-weight:700;letter-spacing:.07em}.project h3{font-family:var(--heading);font-size:39px;line-height:1.13;font-weight:400;letter-spacing:-.035em;margin:0 0 26px}.project p{font-size:18px;line-height:1.65;margin-bottom:32px}.project a{border-top:1px solid #0003;padding-top:19px;margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:14px;font-size:14px;font-weight:700;min-height:48px}.project a:hover{text-decoration:underline}.project a>span[aria-hidden]{font-size:24px}.contact{background:var(--pale)}.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px}.contact h2{font-size:61px}.contact p{max-width:390px}.signature{width:250px;height:auto;margin-top:20px;mix-blend-mode:multiply}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.field{margin-bottom:22px}label{display:block;font-size:14px;margin-bottom:8px;font-weight:700}input,textarea{display:block;width:100%;background:var(--paper);border:1px solid #bd918a;border-radius:var(--radius);padding:14px;font:18px var(--body);color:var(--ink)}textarea{resize:vertical;min-height:140px}.contact .form-note{max-width:100%;font-size:13px;line-height:1.6;color:var(--muted)}button:disabled{cursor:not-allowed;opacity:.65}button:disabled:hover{transform:none;background:var(--coral)}.footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:34px;font-size:13px}.footer p{margin:0;font-size:13px;color:var(--muted)}.footer-name{font:italic 24px var(--heading)}.footer a:last-child{padding:12px 0}.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip:focus{position:fixed;z-index:10;top:10px;left:10px;padding:15px;background:white}
@media(min-width:1440px){.hero{padding-top:85px}}
@media(max-width:1000px){.wrap{width:calc(100% - 56px)}.hero{gap:36px}.about-grid{gap:40px}.contact-grid{gap:40px}.project{padding:25px 20px}.project-category{font-size:8px}.project h3{font-size:34px}}
@media(max-width:760px){html{scroll-padding-top:130px}.wrap{width:calc(100% - 40px)}.preview-note{font-size:10px}.preview-note span{padding:0 3px}.nav-wrap{flex-direction:column;min-height:110px;padding-bottom:10px}.brand{width:231px;height:64px}.brand img{width:270px;top:-38px;left:-18px}nav{width:100%;justify-content:center;gap:32px}nav a{font-size:13px;padding:5px 0;min-height:32px}nav span{margin-left:3px}.hero{grid-template-columns:1fr;padding-top:39px;padding-bottom:50px;gap:25px}.hero h1{font-size:57px;line-height:1.07}.hero .eyebrow{margin-bottom:20px}.motto{font-size:23px}.hero-copy>p:not(.eyebrow):not(.motto){font-size:18px}.hero-picture{margin:10px 20px 0;max-width:440px}.portrait-frame{aspect-ratio:1}.hero-picture figcaption{font-size:21px}.picture-dot{width:45px;height:45px}.hero-invitation{padding-top:15px;gap:16px}.hero-invitation .line{width:22px}.section{padding-block:60px}.about-grid{grid-template-columns:1fr;gap:38px}.about-photo{order:2}.about-copy h2{font-size:38px}.about-copy h2 br{display:none}.about-copy h2 br:after{content:' '}.about-copy p{font-size:18px}.project-grid{grid-template-columns:1fr;gap:20px}.section-top{text-align:left;margin-bottom:30px}.section-top h2{font-size:38px}.section-top h2 br{display:none}.section-top .eyebrow{margin-left:0}.project{padding:30px}.project-top{margin-bottom:23px}.project-category{font-size:10px}.project h3{font-size:42px}.project h3 br{display:none}.project h3 em:before{content:' '}.contact-grid{grid-template-columns:1fr;gap:30px}.contact h2{font-size:48px}.signature{width:200px;margin-top:0}.field-row{grid-template-columns:1fr;gap:0}.footer{flex-direction:column;gap:7px;text-align:center}.button{min-height:56px}nav a{min-height:44px;display:flex;align-items:center}.about-copy h2{max-width:340px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Aktuálny portrét: jednoduchá fotografia bez ozdobného rámu. */
.hero-picture{padding:0;margin-top:30px}.portrait-frame{border-radius:8px;aspect-ratio:1014/1234}.portrait-frame img{object-position:center}.hero-picture:before{content:none}.hero-picture figcaption{display:block;background:none;transform:none;margin:14px 0 0;padding:0;font-size:19px}.contact .privacy-note{max-width:100%;font-size:15px;line-height:1.6}.contact .form-note{font-size:13px}
@media(max-width:760px){.hero-picture{margin:10px 0 0}.portrait-frame{aspect-ratio:1014/1234}.contact .privacy-note{font-size:16px}}

/* Vzdušnejší portrét a neutrálne zakončenie stránky. */
.hero{grid-template-columns:1fr 1.1fr;gap:36px 48px}.hero-picture{margin:0}.portrait-frame{aspect-ratio:.88;border-radius:43% 57% 46% 54% / 36% 41% 59% 64%}.portrait-frame img{object-position:center 52%}.hero-picture figcaption{text-align:center}.contact{background:#fcf7ef}.footer{border-top:1px solid var(--rule)}
@media(max-width:760px){.hero{grid-template-columns:1fr;gap:25px}.hero-picture{margin:0}.portrait-frame{aspect-ratio:.85}}

.playful{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px;margin-top:80px;padding-top:70px;border-top:1px solid var(--rule)}.playful figure{margin:0}.playful img{display:block;width:100%;max-width:420px;height:auto;border-radius:8px}.playful figcaption{font-size:14px;color:var(--muted);margin-top:14px}.playful h2{font-size:56px}@media(max-width:760px){.playful{grid-template-columns:1fr;gap:30px;margin-top:45px;padding-top:45px}.playful h2{font-size:40px}.playful figcaption{font-size:16px}}

/* Portrét cez okraje úvodu s plynulým prechodom do bielej. */
.hero{position:relative;isolation:isolate;max-width:none;width:100%;padding:75px max(48px,calc((100% - 1160px)/2)) 0;display:block;background:#fff;overflow:hidden}.hero-copy{position:relative;z-index:2;width:49%;min-height:640px;padding-bottom:55px}.hero-picture{position:absolute;z-index:-1;top:0;right:0;width:59%;height:715px;margin:0}.portrait-frame{width:100%;height:100%;aspect-ratio:auto;border-radius:0;mask-image:linear-gradient(to right,transparent 0%,#000 38%);-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 38%)}.portrait-frame img{object-fit:cover;object-position:center 47%}.hero-picture figcaption{display:none}.hero-invitation{position:relative;z-index:2;background:#fff;max-width:none;margin:0 calc(-1 * max(48px,calc((100% - 1160px)/2)));padding:45px max(48px,calc((100% - 960px)/2)) 60px}.hero .motto{max-width:480px}
@media(max-width:1000px) and (min-width:761px){.hero{padding-top:60px}.hero-copy{min-height:690px}.hero-picture{height:750px}.hero h1{font-size:54px}}
@media(max-width:760px){.hero{padding:35px 20px 0}.hero-copy{width:100%;min-height:0;padding-bottom:25px}.hero-picture{position:relative;z-index:0;width:calc(100% + 40px);height:460px;margin:0 -20px}.portrait-frame{border-radius:0;aspect-ratio:auto;mask-image:linear-gradient(to bottom,transparent,#000 18%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%)}.portrait-frame img{object-position:center 45%}.hero-invitation{margin:0 -20px;padding:35px 20px 45px}.hero h1{font-size:57px}}

.footer{background:#fcf7ef;max-width:none;width:100%;padding-inline:max(28px,calc((100% - 1160px)/2));border-top-color:#ece3d6}

.playful img{border-radius:0;mask-image:linear-gradient(to bottom,transparent 0%,black 12%,black 85%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 12%,black 85%,transparent 100%);mix-blend-mode:multiply}

.hero,.hero-invitation{background:#f6f1eb}.hero>.hero-picture .portrait-frame img{object-position:center 35%}

.hero,.hero-invitation{background:#fff}

.hero>.hero-picture{width:54%}.hero>.hero-picture .portrait-frame img{object-fit:cover;object-position:center 20%}.playful-section{background:var(--cream);padding:70px 0}.playful-section .playful{margin-top:0;padding-top:0;border:0}.playful figure{order:2}.playful>div{order:1}.playful p{font-size:18px}.playful img{max-width:100%}@media(max-width:760px){.hero>.hero-picture{width:calc(100% + 40px);height:540px}.playful figure{order:2}}

/* Výrazné odkazy a celoplošný hravý blok. */
.project a{border:1px solid currentColor;border-radius:12px;padding:14px 16px;min-height:54px;background:#ffffff50;transition:background .2s}.project a:hover{background:#fff;text-decoration:none}.playful .eyebrow{font-size:12px;letter-spacing:.18em;font-weight:700}.hero>.hero-picture{width:48%}.hero>.hero-picture .portrait-frame img{object-fit:contain;object-position:right top}.hero>.hero-picture .portrait-frame{background:#fff}.playful-section{position:relative;overflow:hidden;padding:0;background:var(--cream)}.playful-section .playful{display:block;min-height:750px;padding-block:90px}.playful>div{position:relative;z-index:2;width:43%;padding-block:45px}.playful figure{position:absolute;right:0;top:0;bottom:0;width:55%;margin:0}.playful img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;mix-blend-mode:normal;mask-image:linear-gradient(to right,transparent,#000 32%);-webkit-mask-image:linear-gradient(to right,transparent,#000 32%)}
@media(max-width:760px){.hero>.hero-picture{width:calc(100% + 40px);height:520px}.hero>.hero-picture .portrait-frame img{object-fit:contain;object-position:center}.playful-section .playful{padding-block:45px 0;min-height:0}.playful>div{width:100%;padding:0}.playful figure{position:relative;width:calc(100% + 40px);height:560px;margin:0 -20px}.playful img{mask-image:linear-gradient(to bottom,transparent,#000 18%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%)}.project a{font-size:16px}}
.hero>.hero-picture .portrait-frame{mask-image:none;-webkit-mask-image:none}.hero>.hero-picture .portrait-frame img{mask-image:linear-gradient(to right,transparent,#000 35%);-webkit-mask-image:linear-gradient(to right,transparent,#000 35%)}
@media(max-width:760px){.hero>.hero-picture .portrait-frame img{mask-image:linear-gradient(to bottom,transparent,#000 18%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%)}}
.hero>.hero-picture .portrait-frame img{display:block;width:auto;max-width:100%;height:100%;margin-left:auto}
@media(max-width:760px){.hero>.hero-picture .portrait-frame img{margin-inline:auto}}
/* Stred medzi pôvodným detailom a oddialeným portrétom. */
.hero>.hero-picture{width:55%}.hero>.hero-picture .portrait-frame img{width:100%;max-width:none;height:100%;object-fit:cover;object-position:center 31%;mask-image:linear-gradient(to right,transparent 0%,#000 37%);-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 37%)}
@media(max-width:760px){.hero>.hero-picture{width:calc(100% + 40px);height:560px}.hero>.hero-picture .portrait-frame img{object-fit:cover;object-position:center 28%;mask-image:linear-gradient(to bottom,transparent,#000 18%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%)}}

/* Autentická fotografia v hravom bloku, bez generatívnej úpravy tváre. */
.playful img{object-position:34% center;mask-image:linear-gradient(to right,transparent 0%,#000 18%);-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 18%)}
@media(max-width:760px){.playful figure{height:440px}.playful img{object-position:32% center;mask-image:linear-gradient(to bottom,transparent,#000 15%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 15%)}}

.playful img{object-position:50% 40%}@media(max-width:760px){.playful figure{height:560px}.playful img{object-position:50% 35%}}

/* Schválené biele pozadie hravého bloku. */
.playful-section{background:#fff}

/* Pozvanie je súčasťou úvodu nad hlavným tlačidlom. */
.hero-copy{padding-bottom:65px;min-height:750px}.hero>.hero-picture{height:100%}.hero-copy>p strong{font-weight:700}@media(max-width:760px){.hero-copy{min-height:0;padding-bottom:25px}.hero>.hero-picture{height:560px}}
/* Klubová fotografia od ľavého okraja s prechodom k textu. */
.about{position:relative;overflow:hidden}.about-grid{display:block;min-height:580px}.about-copy{width:46%;margin-left:auto;position:relative;z-index:1}.about-photo{position:absolute;left:0;top:0;bottom:0;width:53%;display:flex;align-items:center}.about-photo img{width:100%;height:auto;border-radius:0;mask-image:linear-gradient(to right,#000 65%,transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 65%,transparent 100%)}.about-photo .photo-caption{display:none}
@media(max-width:760px){.about-grid{display:flex;flex-direction:column;min-height:0}.about-copy{width:100%;margin:0}.about-photo{position:relative;left:auto;top:auto;bottom:auto;width:calc(100% + 40px);margin-inline:-20px;order:2}.about-photo img{mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 88%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 88%,transparent)}}

/* Celá výška klubovej fotky a profilový portrét pri kontakte. */
.about{padding-block:0}.about-grid{min-height:660px;display:flex;align-items:center}.about-copy{padding-block:65px}.about-photo img{height:100%;object-fit:cover;object-position:center}.contact-portrait{display:block;width:170px;height:170px;object-fit:cover;object-position:center 38%;border-radius:50%;margin:28px 0 0}.contact .signature{display:block;margin-top:16px}
@media(max-width:760px){.about-grid{min-height:0;gap:0}.about-copy{padding-block:50px 35px}.about-photo{height:auto;aspect-ratio:940/788;margin-bottom:0}.about-photo img{height:100%;mask-image:none;-webkit-mask-image:none}.contact-portrait{width:150px;height:150px}}

.original-photos .playful img{object-position:34% center}.original-photos .hero>.hero-picture .portrait-frame img{object-position:center 40%}

/* Produkčné právne stránky a formulár. Spoločný štýl pre celý web. */
.legal{max-width:820px;padding-top:70px;padding-bottom:80px}.legal h1{font-size:clamp(38px,6vw,64px);line-height:1.12}.legal h2{font-size:26px;margin-top:38px}.legal p{font-size:17px;line-height:1.7}.legal a,.privacy-note a{text-decoration:underline;text-underline-offset:3px}.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.footer{flex-wrap:wrap;gap:20px}.form-note:empty{display:none}
