/* Tajna jednog obećanja — izvor dizajna: ChatGPT_template/tajna-jednog-obecanja/v20 (lokalno, izvan Gita). */
@font-face{font-family:Pinyon;src:url('../fonts/tajna-jednog-obecanja/pinyon-script.woff2') format('woff2');font-display:swap}
@font-face{font-family:Playfair;src:url('../fonts/tajna-jednog-obecanja/playfair-display.woff2') format('woff2');font-weight:400 900;font-display:swap}
@font-face{font-family:Playfair;src:url('../fonts/tajna-jednog-obecanja/playfair-display-italic.woff2') format('woff2');font-style:italic;font-weight:400 900;font-display:swap}
:root{--paper:#e7d8b8;--ink:#382b23;--faded:#69523c;--red:#742e32;--line:#92714975;--script:Pinyon,cursive;--book:Playfair,Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{position:relative;margin:0;color:var(--ink);font:21px/1.6 var(--book);background:var(--paper);background-image:radial-gradient(ellipse at 0 0,#8e633f45,transparent 45%),radial-gradient(ellipse at 100% 100%,#98734438,transparent 50%),linear-gradient(90deg,#b7955a38,transparent 15%,#fff4d61c 50%,transparent 85%,#b7955a38);min-height:100vh}body:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:8;opacity:.17;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23816342' filter='url(%23n)' d='M0 0h240v240H0z'/%3E%3C/svg%3E");mix-blend-mode:multiply}a{color:inherit;text-underline-offset:5px}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--red);outline-offset:5px}button,a{touch-action:manipulation}.demo{text-align:center;font-size:13px;letter-spacing:.05em;padding:10px 18px;color:var(--faded);border-bottom:1px solid #92714930}.sheet{position:relative;max-width:1040px;margin:auto;padding:0 76px}.sheet:before,.sheet:after{content:"";position:absolute;top:32px;bottom:32px;width:5px;border-left:1px solid var(--line);border-right:1px solid #92714930;pointer-events:none}.sheet:before{left:27px}.sheet:after{right:27px}.eyebrow{font-size:13px;letter-spacing:.2em;text-transform:uppercase}.muted{color:var(--faded)}.hero{text-align:center;position:relative;padding:47px 0 55px;min-height:850px}.docket{display:flex;justify-content:space-between;gap:20px;font-size:12px;letter-spacing:.1em;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:9px 0;margin-bottom:65px}.ornament{display:block;width:240px;height:50px;margin:18px auto;color:var(--faded)}.hero .eyebrow{margin:0 0 24px}.hero h1{font:400 clamp(78px,11vw,132px)/.96 var(--script);margin:20px 0 27px;text-shadow:.4px .5px #382b2330}.hero h1 span{display:block}.hero h1 .amp{font-size:.44em;line-height:1.15;margin:3px 0 3px}.hero .subtitle{font-style:italic;font-size:25px;margin:0 0 24px}.date{font-size:32px;letter-spacing:.09em;margin:0}.calendar{display:inline-block;font-style:italic;font-size:17px;min-height:44px;padding:8px}.seal{width:116px;height:116px;margin:31px auto 22px;filter:drop-shadow(2px 5px 4px #3c1c2350);transform:rotate(-11deg)}.seal svg{width:100%;height:100%}.hero .confidential{font-size:16px;font-style:italic;margin:0}.scroll{display:block;font-size:12px;letter-spacing:.17em;text-transform:uppercase;margin-top:38px;text-decoration:none}.scroll span{display:block;font-size:22px;margin-top:5px}.section{position:relative;padding:55px 0 65px}.divider{display:flex;align-items:center;gap:18px;color:var(--faded);margin:0}.divider:before,.divider:after{content:"";height:1px;background:var(--line);flex:1}.divider span{font-size:22px;line-height:1}.section h2{font-weight:400;font-size:44px;line-height:1.1;text-align:center;margin:13px 0 36px}.section>.eyebrow{text-align:center;margin:0}.letter{max-width:620px;margin:auto}.salutation{font:38px var(--script);margin:5px 0 24px}.dropcap{float:left;font:100px/.78 Ornamental,serif;color:var(--red);margin:8px 11px 0 0;text-shadow:.4px .4px #742e3250}.letter p{margin:0 0 24px}.signature{font:39px var(--script);text-align:right;margin-top:30px!important}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;border:1px solid var(--ink);padding:10px 26px;background:transparent;text-decoration:none;cursor:pointer;font-size:18px}.button:hover{background:#742e3210;border-color:var(--red);color:var(--red)}.button.primary{background:var(--red);border-color:var(--red);color:#fff0d0}.letter .button{display:flex;width:fit-content;margin:30px auto 0}.quote{text-align:center;font-style:italic;font-size:29px;line-height:1.45;max-width:620px;margin:35px auto 6px}.quote:before{content:'„';display:block;font:70px/1 var(--script);color:var(--red);height:45px}.story-note{text-align:center;font-size:16px;color:var(--faded);margin:19px 0 0}.timeline{max-width:660px;margin:auto}.venue{display:grid;grid-template-columns:70px 34px 1fr;gap:22px;align-items:start;border-bottom:1px solid var(--line);padding:26px 0}.venue:last-child{border:0}.venue time{font-size:28px;line-height:1.2}.venue .icon{width:29px;height:29px;margin-top:3px;color:var(--faded)}.venue .eyebrow{font-size:11px;letter-spacing:.13em}.venue h3{font-weight:400;font-size:26px;line-height:1.2;margin:4px 0}.venue p{font-size:18px;margin:0}.venue a{font-style:italic;font-size:16px;display:inline-flex;align-items:center;min-height:44px}.countdown{text-align:center;padding:45px 0 50px}.countdown .eyebrow{margin-bottom:15px}.clock{display:flex;justify-content:center;gap:45px}.clock b{font-size:45px;line-height:1.2;font-weight:400;display:block}.clock span{display:block;font-size:12px;letter-spacing:.12em}.rsvp{max-width:650px;margin:auto}.rsvp-intro{text-align:center;max-width:480px;margin:0 auto 30px}.rsvp form{display:grid;gap:19px}.row{display:grid;grid-template-columns:1fr 1fr;gap:22px}label,legend{font-size:17px}label{display:block}input:not([type=radio]),select,textarea{display:block;width:100%;border:0;border-bottom:1px solid var(--faded);border-radius:0;background:#fff5da28;min-height:48px;padding:9px 12px;margin-top:6px;font-size:19px}textarea{resize:vertical;min-height:100px}fieldset{margin:0;padding:0;border:0}.choices{display:flex;gap:25px;padding-top:8px}.choices label{min-height:44px;display:flex;align-items:center;gap:9px}input[type=radio]{accent-color:var(--red);width:18px;height:18px}.privacy{font-size:14px;color:var(--faded);line-height:1.5;margin:0}.status{font-size:17px;margin:0;min-height:27px}.contacts{display:flex;justify-content:center;gap:65px;border-top:1px solid var(--line);padding-top:30px;margin-top:25px;text-align:center}.contacts p{margin:0 0 5px;font:32px var(--script)}.contacts a{font-size:15px;display:inline-flex;min-height:44px;align-items:center;margin:0 5px}.closing{text-align:center;padding:50px 0 40px}.closing .script{font:53px/1.2 var(--script);margin:15px 0}.closing p{font-size:17px}.folio{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:14px;margin-top:45px;font-size:11px;letter-spacing:.12em;text-transform:uppercase}.blood{position:absolute;width:13px;height:16px;border-radius:58% 45% 55% 45%;background:radial-gradient(ellipse at 28% 24%,#d2796d 0,#91322e 16%,#5c151c 58%,#320f17 91%);box-shadow:1px 2px 2px #4a172235,inset 0 -1px 2px #260a11;transform:rotate(23deg);pointer-events:none}.blood:after{content:"";position:absolute;left:20px;top:21px;width:5px;height:6px;border-radius:50%;background:#6a2425;box-shadow:8px -17px 0 -1px #7b2929}.blood.one{top:238px;right:15px}.blood.two{bottom:100px;left:8px;width:9px;height:10px;opacity:.9}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}
@media(min-width:1200px){.hero{min-height:900px}.hero h1 span{display:inline}.hero h1 .amp{display:inline-block;margin:0 18px;vertical-align:middle}.hero h1{margin:55px -20px 40px}.hero .seal{margin-top:42px}.section{padding:65px 0 75px}}
@media(max-width:650px){body{font-size:20px}.sheet{padding:0 30px}.sheet:before{left:11px}.sheet:after{right:11px}.demo{font-size:11px;padding-inline:20px}.docket{font-size:9px;letter-spacing:.07em;margin-bottom:47px}.hero{padding-top:27px;min-height:850px}.hero h1{font-size:94px;margin:24px 0}.hero .subtitle{font-size:22px;max-width:240px;margin:0 auto 22px}.hero .eyebrow{font-size:11px;letter-spacing:.17em}.date{font-size:28px}.ornament{width:200px;margin:12px auto}.hero .seal{width:105px;height:105px;margin-top:28px}.section{padding:40px 3px 50px}.section h2{font-size:36px;margin-bottom:28px}.section>.eyebrow{font-size:10px}.salutation{font-size:33px}.dropcap{font-size:91px}.quote{font-size:25px}.venue{grid-template-columns:58px 22px 1fr;gap:10px;padding:24px 0}.venue time{font-size:24px}.venue .icon{width:21px;height:25px}.venue h3{font-size:23px}.venue p{font-size:17px}.venue .eyebrow{font-size:10px;letter-spacing:.06em}.clock{gap:25px}.clock b{font-size:35px}.clock span{font-size:10px}.countdown{padding:35px 0 40px}.row{grid-template-columns:1fr;gap:19px}.choices{gap:18px}.contacts{gap:25px}.contacts a{margin:0 4px;font-size:14px}.closing .script{font-size:43px}.blood.one{right:-8px;top:210px}.blood.two{left:-8px}.folio{font-size:9px;letter-spacing:.06em}.button{font-size:17px}.rsvp form>.button{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}@media print{.demo,.scroll,.button,form,.contacts,.calendar{display:none}.sheet{max-width:none}.hero{min-height:0}.section{break-inside:avoid}}

/* v2: jedna papirna površina, bez ponavljanja rubova po sekcijama. */
:root{--paper:#f1e3c8;--ink:#34271f;--faded:#654d35;--line:#97764760}
body{background:#28241e;color:var(--ink);font-size:18px;line-height:1.85;padding-bottom:35px}
body:before{display:none}
.demo{background:#28241e;color:#d6c5a9;border:0;font-family:Playfair,serif;font-size:13px;padding:11px 20px}
.sheet{isolation:isolate;width:calc(100% - 60px);max-width:1040px;margin:18px auto 0;padding:0 86px;background:var(--paper) url('../images/templates/tajna-jednog-obecanja/papir-rub.webp') center center/100% 100% no-repeat;box-shadow:0 12px 65px #0007;border-radius:7px}
.sheet:before,.sheet:after{top:31px;bottom:31px;border-color:#95734d55;z-index:-1}.sheet:before{left:29px}.sheet:after{right:29px}
.hero{padding-top:42px;min-height:0;padding-bottom:50px}
.docket{font-size:10px;letter-spacing:.08em;margin-bottom:30px;padding:10px 0}
.hero .eyebrow{font-size:12px;margin-bottom:20px}
.initials{display:flex;align-items:center;justify-content:center;gap:17px;margin:0 auto 28px;pointer-events:none}
.initials img{width:80px;height:80px;object-fit:contain;mix-blend-mode:multiply}
.initials span{font:29px var(--script);color:#8a704c}
.hero h1{font-size:clamp(80px,10vw,118px);margin:25px -20px 35px}
.hero h1 span{display:inline}.hero h1 .amp{display:inline-block;margin:0 13px;vertical-align:middle;font-size:.4em}
.hero .subtitle{font-size:21px;margin:0 auto 25px;max-width:540px;line-height:1.65}
.date{font-size:19px;letter-spacing:.13em;text-transform:uppercase;font-weight:500}
.calendar{font-size:15px;margin-top:4px}
.hero .seal{width:150px;height:150px;margin:32px auto 20px;transform:rotate(-9deg);filter:drop-shadow(2px 5px 4px #3c1c2345)}
.seal img{display:block;width:100%;height:100%;object-fit:contain}
.hero .confidential{font-size:15px}.scroll{font-size:10px;margin-top:29px}
.section{padding:55px 0 65px}.section h2{font-size:38px;line-height:1.3;margin-bottom:31px}.section>.eyebrow{font-size:11px}
.letter{max-width:650px}.letter p{margin-bottom:24px}.salutation{font-size:38px;line-height:1.3}
.dropcap{width:110px;height:125px;display:block;float:left;margin:5px 18px 5px 0;font:inherit;text-shadow:none;position:relative}
.dropcap img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;pointer-events:none}
.signature{font-size:39px}.quote{font-size:25px;line-height:1.65}.story-note{font-size:15px}
.venue{grid-template-columns:70px 29px 1fr;gap:18px}.venue time{font-size:24px}.venue h3{font-size:23px}.venue p{font-size:16px}.venue a{font-size:15px}.venue .eyebrow{font-size:10px;letter-spacing:.1em}
.rsvp-intro{font-size:17px}.choices{flex-wrap:wrap;gap:5px 25px}.choices label{font-size:15px}label,legend{font-size:15px}input:not([type=radio]),select,textarea{font-size:16px}.button{font-size:16px}.privacy{font-size:13px}.status{font-size:15px}
.clock b{font-size:39px}.clock span{font-size:10px}.closing p{font-size:15px}.closing .script{font-size:51px}.folio{font-size:9px}
@media(max-width:700px){body{font-size:17px;line-height:1.85;padding-bottom:16px}.sheet{width:calc(100% - 20px);margin:6px auto 0;padding:0 29px;border-radius:5px;box-shadow:0 7px 20px #0005}.sheet:before{left:13px}.sheet:after{right:13px}.sheet:before,.sheet:after{top:22px;bottom:22px;width:3px}.demo{font-size:11px;line-height:1.5;padding:10px 18px}.hero{padding-top:27px;padding-bottom:34px}.docket{font-size:8px;letter-spacing:.02em;margin-bottom:28px;gap:10px}.hero .eyebrow{font-size:10px;letter-spacing:.15em;margin-bottom:18px}.initials{gap:14px;margin-bottom:21px}.initials img{width:66px;height:66px}.initials span{font-size:24px}.hero h1{font-size:90px;margin:18px -6px 25px}.hero h1 span{display:block}.hero h1 .amp{display:block;font-size:.38em;line-height:1.1;margin:8px 0}.hero .subtitle{font-size:18px;max-width:270px;line-height:1.75;margin-bottom:22px}.date{font-size:16px;letter-spacing:.09em}.calendar{font-size:14px}.hero .seal{width:132px;height:132px;margin-top:24px}.hero .confidential{font-size:13px}.scroll{font-size:9px;margin-top:23px}.blood.one{right:-10px;top:240px}.section{padding:39px 1px 47px}.section>.eyebrow{font-size:9px;letter-spacing:.15em}.section h2{font-size:29px;line-height:1.35;margin-bottom:24px}.salutation{font-size:31px;line-height:1.3}.dropcap{width:84px;height:102px;margin:5px 12px 2px 0}.signature{font-size:34px}.quote{font-size:21px}.story-note{font-size:13px}.venue{grid-template-columns:54px 20px 1fr;gap:9px;padding:23px 0}.venue time{font-size:20px}.venue h3{font-size:20px;line-height:1.4}.venue p{font-size:14px;line-height:1.8}.venue .eyebrow{font-size:8px;letter-spacing:.06em}.venue a{font-size:13px}.venue .icon{width:20px}.clock{gap:21px}.clock b{font-size:29px}.clock span{font-size:9px}.countdown .eyebrow{font-size:9px;letter-spacing:.1em}.rsvp-intro{font-size:15px}.choices{display:grid;grid-template-columns:1fr;gap:0}.choices label{font-size:14px}.contacts{gap:28px}.contacts a{font-size:12px;margin-inline:3px}.closing p{font-size:13px}.closing .script{font-size:41px}.folio{font-size:8px;letter-spacing:.04em}.privacy{font-size:12px}.status{font-size:14px}.button{font-size:14px}.blood.two{left:-11px}.rsvp form{gap:17px}}
@media print{body{background:#fff;padding:0}.sheet{width:100%;margin:0;box-shadow:none}.hero{min-height:0}}
/* Realistic paper grain at its natural scale; the source page supplies only its outer rim. */
.sheet{background:var(--paper) url('../images/templates/tajna-jednog-obecanja/papir-tekstura.webp') center top/620px 620px repeat;background-clip:padding-box;border:10px solid transparent;border-image-source:url('../images/templates/tajna-jednog-obecanja/papir-rub.webp');border-image-slice:45;border-image-repeat:stretch;border-image-width:13px;padding-inline:76px;border-radius:0}
.sheet:before,.sheet:after{box-shadow:0 0 24px 9px #bc8b4535}
@media(max-width:700px){.sheet{border-width:7px;border-image-width:9px;padding-inline:22px;background-size:450px 450px;border-radius:0}.sheet:before{left:6px}.sheet:after{right:6px}.sheet:before,.sheet:after{box-shadow:0 0 14px 4px #bc8b4530}}/* v3: larger corner initials; only the main names change typeface. */
@media(min-width:701px){.blood.one{top:350px;right:-43px}}

html{overflow-y:scroll;scrollbar-gutter:stable;scrollbar-width:auto;scrollbar-color:#bba17a #28241e}
html::-webkit-scrollbar{width:15px}html::-webkit-scrollbar-track{background:#28241e}html::-webkit-scrollbar-thumb{background:#bba17a;border:3px solid #28241e;border-radius:10px}html::-webkit-scrollbar-thumb:hover{background:#e5cba3}
.hero-corners{position:relative;height:170px;margin:0 -42px 7px}
.hero-corners .initials{position:absolute;inset:0;margin:0;justify-content:space-between;align-items:center;gap:0}
.hero-corners .initials img{width:150px;height:150px}
.hero-corners .eyebrow{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:210px;line-height:1.7;margin:0}
.hero h1>span:not(.amp){font-family:Monsieur,cursive;font-weight:400}
.hero h1{font-size:clamp(96px,11vw,145px);line-height:1.3;margin:12px -30px 21px}
.hero h1 .amp{font-family:Pinyon,cursive}
@media(max-width:700px){.hero-corners{height:146px;margin:0 -20px 6px}.hero-corners .initials img{width:116px;height:132px}.hero-corners .eyebrow{width:92px;font-size:9px;letter-spacing:.1em;line-height:1.9}.docket{margin-bottom:13px}.hero h1{font-size:108px;line-height:1.1;margin:8px -12px 26px}.hero h1 .amp{margin:0;line-height:1.1;font-size:.32em}}
@media(min-width:701px) and (max-width:1000px){.hero h1 span{display:block}.hero h1 .amp{display:block;margin:0;line-height:1;font-size:.3em}.hero h1{font-size:115px;line-height:1.1}}
/* v4: original lettering, blood-red ornamental initials and an itinerary dossier. */
.hero h1>span:not(.amp){font-family:Pinyon,cursive}
.hero h1{font-size:clamp(80px,10vw,118px);line-height:.96;margin:25px -20px 35px}
.hero h1 span{display:inline}.hero h1 .amp{display:inline-block;margin:0 13px;line-height:1.15;font-size:.4em;vertical-align:middle}
.initials img,.dropcap img{filter:url('#tjo-tinta');mix-blend-mode:multiply}
.quote:before{content:none;display:none}
.divider{gap:0;min-height:1px}.divider:before,.divider:after{height:1px}
.hero{padding-bottom:41px}.hero .seal{margin-bottom:4px}
.case-route{display:grid;grid-template-columns:1fr 1fr;column-gap:46px;row-gap:39px;max-width:760px;margin:42px auto 0;counter-reset:clue}
.case-file{position:relative;min-width:0;padding:0 5px 21px;border-bottom:1px solid var(--line)}
.case-file:after{content:"";position:absolute;bottom:4px;left:0;right:0;border-bottom:1px solid #92714930;pointer-events:none}
.case-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;min-height:58px;margin-bottom:17px}
.clue{color:#811b24;font-style:italic;font-size:19px;letter-spacing:.07em}
.time-stamp{display:inline-block;font:500 24px/1.1 Playfair,serif;letter-spacing:.035em;color:#721a24;border:1px solid #721a2499;outline:1px solid #721a2438;outline-offset:3px;padding:9px 12px;transform:rotate(-4deg);font-variant-numeric:tabular-nums}
.case-file:nth-child(even) .time-stamp{transform:rotate(3deg)}
.case-kind{font-size:10px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 8px;color:var(--faded)}
.case-file h3{font-weight:400;font-size:25px;line-height:1.35;margin:0 0 8px}
.case-address{font-size:16px;line-height:1.6;margin:0}
.case-map{display:flex;justify-content:space-between;align-items:center;min-height:44px;width:100%;font-style:italic;font-size:15px;margin-top:13px;text-decoration:none}
.case-map span{font-size:21px}.case-map:hover{color:#811b24;text-decoration:underline}
.case-file.ceremony h3{color:#721a24}.case-file:last-child{grid-column:1/-1;max-width:440px;width:100%;justify-self:center;text-align:center}
.case-file:last-child .case-heading{justify-content:center;gap:35px}.case-file:last-child .case-map{justify-content:center;gap:20px}
@media(max-width:700px){.hero h1{font-size:90px;line-height:.96;margin:18px -6px 25px}.hero h1 span{display:block}.hero h1 .amp{display:block;font-size:.38em;line-height:1.1;margin:8px 0}.hero{padding-bottom:30px}.hero .seal{margin-bottom:0}.sheet{margin-top:16px}.case-route{grid-template-columns:1fr;gap:30px;margin-top:33px}.case-file{padding:0 5px 18px}.case-heading{margin-bottom:13px;min-height:53px}.clue{font-size:18px}.time-stamp{font-size:23px;padding:8px 12px}.case-kind{font-size:9px;letter-spacing:.12em}.case-file h3{font-size:23px}.case-address{font-size:15px}.case-map{font-size:14px;margin-top:10px}.case-file:last-child{grid-column:auto;max-width:none;text-align:left}.case-file:last-child .case-heading{justify-content:space-between;gap:15px}.case-file:last-child .case-map{justify-content:space-between;gap:15px}}
@media(min-width:701px) and (max-width:1000px){.hero h1{font-size:clamp(76px,11vw,100px)}.hero h1 span{display:inline}.hero h1 .amp{display:inline-block;margin:0 10px;font-size:.4em}.case-route{column-gap:27px}.case-file h3{font-size:22px}}

/* v5: clear section labels, breathing room around initials, and quieter dividers. */
.docket{display:block;text-align:center;font:34px/1.4 Pinyon,cursive;letter-spacing:0;padding:12px 0;margin-bottom:20px}
.hero-corners{margin:0 -6px 7px;height:170px}.hero-corners .initials{inset:0 10px}
.section>.section-label{font:400 17px/1.6 Playfair,serif;letter-spacing:.13em;text-transform:uppercase;text-align:center;margin:0 0 34px}
#prica .letter p:last-child{margin-bottom:0}#prica .letter:after{content:"";display:block;clear:both}
.case-route{margin-top:0}.case-heading{justify-content:flex-end;min-height:54px;margin-bottom:13px}
.case-file:last-child .case-heading{justify-content:center}
.case-file:after{display:none}.case-file:last-child{border-bottom:0;padding-bottom:0}
.closing .closing-signature{font:34px/1.5 Pinyon,cursive;margin:22px 0 0}
@media(max-width:700px){.docket{font-size:29px;padding:10px 0;margin-bottom:15px}.hero-corners{height:146px;margin:0 0 6px}.hero-corners .initials{inset:0 6px}.hero-corners .initials img{width:110px;height:132px}.section>.section-label{font-size:14px;letter-spacing:.12em;line-height:1.7;margin-bottom:27px}.case-heading{justify-content:flex-end;margin-bottom:13px}.case-file:last-child .case-heading{justify-content:flex-end}.closing .closing-signature{font-size:28px;line-height:1.7}.case-route{margin-top:0}}

/* v6: compact letterhead, closer drop caps and staggered parchment notes. */
.docket{display:grid;grid-template-columns:75px minmax(0,1fr) 75px;align-items:center;gap:18px;padding:10px 8px;margin-bottom:25px;font-size:34px}
.heading-initial{display:block;line-height:0;pointer-events:none}.heading-initial img{display:block;width:75px;height:75px;object-fit:contain;filter:url('#tjo-tinta');mix-blend-mode:multiply}
.hero h1{margin-top:22px}.blood.one{top:230px}
.dropcap{width:89px;height:108px;margin:3px 6px 1px 0}
.dropcap img{width:100%;height:100%;object-fit:contain;object-position:right center}
.case-route{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 35px;max-width:760px;padding:9px 4px;margin:0 auto}
.case-file,.case-file:last-child{grid-column:auto;max-width:none;width:auto;justify-self:stretch;text-align:left;padding:22px 23px 17px;border:1px solid #9971438c;background:linear-gradient(115deg,#b78b4f26,#9b6b2e19),url('../images/templates/tajna-jednog-obecanja/papir-tekstura.webp') center/440px 440px;box-shadow:2px 5px 9px #58351523,inset 0 0 23px #9b6b3038;position:relative}
.case-file:before{content:"";position:absolute;inset:5px;border:1px solid #9f784329;pointer-events:none}
.case-file:nth-child(even){transform:translateY(calc(50% + 14px))}
.case-heading,.case-file:last-child .case-heading{display:flex;align-items:center;justify-content:space-between;gap:13px;min-height:37px;margin:0 0 16px}
.case-kind{margin:0;font-size:10px;line-height:1.6;letter-spacing:.1em;max-width:65%}
.time-stamp{font-size:21px;padding:6px 7px;outline-offset:2px;white-space:nowrap}
.case-file h3{font-size:25px;line-height:1.4;margin-bottom:9px}.case-address{font-size:16px;line-height:1.7}
.case-map,.case-file:last-child .case-map{justify-content:space-between;gap:10px;font-size:14px;margin-top:12px;min-height:44px}
@media(max-width:700px){.docket{grid-template-columns:55px minmax(0,1fr) 55px;gap:8px;padding:8px 0;margin-bottom:25px;font-size:24px;line-height:1.2}.heading-initial img{width:55px;height:66px}.hero h1{margin-top:18px}.blood.one{top:200px}.dropcap{width:66px;height:89px;margin:2px 5px 0 0}.case-route{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px;margin:0 -17px;padding:6px 0;max-width:none}.case-file,.case-file:last-child{padding:14px 11px 10px;border:1px solid #9971438c;text-align:left}.case-file:nth-child(even){transform:translateY(calc(50% + 9px))}.case-file:before{inset:3px}.case-heading,.case-file:last-child .case-heading{gap:6px;min-height:31px;margin-bottom:10px;align-items:flex-start;justify-content:space-between}.case-kind{font-size:8px;letter-spacing:.03em;line-height:1.5;max-width:61%;padding-top:4px}.time-stamp{font-size:15px;line-height:1.1;padding:5px 4px;outline-offset:2px;letter-spacing:0}.case-file h3{font-size:17px;line-height:1.35;margin-bottom:8px;overflow-wrap:normal}.case-address{font-size:12px;line-height:1.65}.case-map,.case-file:last-child .case-map{font-size:11px;margin-top:5px;min-height:44px;gap:4px;justify-content:space-between}.case-map span{font-size:17px}}
/* v7: independent deckled paper notes. Existing typography and geometry are preserved. */
.case-file,.case-file:last-child{background:none;border-color:transparent;box-shadow:none;isolation:isolate}
.case-file:before{content:"";display:block;position:absolute;inset:-6px;border:0;background:url('../images/templates/tajna-jednog-obecanja/biljeska-papir.webp') center/100% 100% no-repeat;z-index:-1;pointer-events:none;filter:drop-shadow(1px 4px 3px #64411c66)}
@media(max-width:700px){.case-file,.case-file:last-child{background:none;border-color:transparent;box-shadow:none}.case-file:before{inset:-5px}}/* Requested small adjustment directly in v7: category closer to location name. */
.case-heading,.case-file:last-child .case-heading{margin-bottom:5px;min-height:0}
@media(max-width:700px){.case-heading,.case-file:last-child .case-heading{margin-bottom:3px;min-height:0}}/* v8: slightly narrower notes; unframed upper-left time with a small diamond rule. */
.case-file,.case-file:last-child{width:94%;justify-self:start}
.case-file:nth-child(even){justify-self:end}
.case-heading,.case-file:last-child .case-heading{flex-direction:column-reverse;align-items:flex-start;justify-content:flex-start;gap:10px;margin-bottom:4px;min-height:0}
.case-kind{max-width:100%;padding-top:0}
.time-stamp,.case-file:nth-child(even) .time-stamp{position:relative;border:0;border-bottom:1px solid #8b253764;outline:0;padding:0 2px 7px;transform:none;line-height:1.1;font-weight:600;letter-spacing:0;color:#83172c}
.time-stamp:after{content:"";position:absolute;left:50%;bottom:-3px;width:5px;height:5px;background:#83172c;transform:translateX(-50%) rotate(45deg);box-shadow:0 0 0 2px #eddfc5}
@media(max-width:700px){.case-file,.case-file:last-child{width:94%;justify-self:start}.case-file:nth-child(even){justify-self:end}.case-heading,.case-file:last-child .case-heading{flex-direction:column-reverse;align-items:flex-start;gap:8px;margin-bottom:3px}.time-stamp,.case-file:nth-child(even) .time-stamp{font-size:19px;padding:0 1px 6px;transform:none;border:0;border-bottom:1px solid #8b253764;outline:0}.case-kind{max-width:100%;padding-top:0}.time-stamp:after{width:4px;height:4px;bottom:-2px}}/* v9: closing signature and a small wax seal between the final inscriptions. */
.closing-date{white-space:nowrap}
.folio{display:grid;grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr);align-items:center;gap:14px}
.folio>span:first-child{text-align:left}.folio>span:last-child{text-align:right}
.folio-seal{display:block;width:48px;height:48px;object-fit:contain;transform:rotate(-11deg);filter:drop-shadow(1px 2px 2px #3c1c2340)}
@media(max-width:700px){.closing-names,.closing-date{display:block}.closing-dot{display:none}.folio{grid-template-columns:minmax(0,1fr) 36px minmax(0,1fr);gap:8px}.folio-seal{width:36px;height:36px}}
/* Requested direct v9 adjustment: larger closing flourish and wax seal. */
.closing .ornament{width:276px;height:58px;max-width:100%}
.folio{grid-template-columns:minmax(0,1fr) 52.8px minmax(0,1fr)}
.folio-seal{width:52.8px;height:52.8px}
@media(max-width:700px){.folio{grid-template-columns:minmax(0,1fr) 39.6px minmax(0,1fr)}.folio-seal{width:39.6px;height:39.6px}}

/* v10: a quiet time ledger, personal correspondence, and a closed paper border. */
.hero .countdown{padding:0;margin:23px auto 0;max-width:360px}
.hero .countdown #clock-title{font:italic 14px/1.5 Playfair,serif;margin:0 0 14px;color:var(--faded)}
.hero .clock{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.hero .clock>div+div{border-left:1px solid var(--line)}
.hero .clock b{font:400 30px/1.2 Playfair,serif;color:#83172c;font-variant-numeric:tabular-nums}
.hero .clock span{font:11px/1.7 Playfair,serif;letter-spacing:.08em;margin-top:4px}
.hero .seal{margin-top:24px}
.contact-section{margin-top:32px;padding-top:28px;border-top:1px solid var(--line)}
.contact-section h3{font:400 15px/1.5 Playfair,serif;letter-spacing:.12em;text-transform:uppercase;text-align:center;margin:0 0 22px}
.contacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:35px;border:0;padding:0;margin:0}
.contacts p{font:400 46px/1.3 Pinyon,cursive;margin:0 0 8px}
.contacts a{display:flex;width:fit-content;min-height:44px;margin:0 auto;font:italic 14px/1.6 Playfair,serif;text-decoration-thickness:1px;text-underline-offset:4px}
.closing{position:relative;padding-bottom:24px}
.closing-ornament{display:block;width:244px;max-width:100%;height:60px;margin:0 auto 22px;color:#866945}
.folio{margin-top:28px}
.sheet:before,.sheet:after{bottom:14px}
.closing:after{content:"";position:absolute;left:-57px;right:-57px;bottom:14px;height:5px;border-top:1px solid #95734d55;border-bottom:1px solid #92714930;pointer-events:none}
@media(max-width:700px){.hero .countdown{max-width:260px;margin-top:20px}.hero .clock b{font-size:25px}.hero .clock span{font-size:10px}.hero .countdown #clock-title{font-size:12px;margin-bottom:12px}.contact-section{margin-top:26px;padding-top:24px}.contact-section h3{font-size:12px;margin-bottom:18px}.contacts{gap:14px}.contacts p{font-size:40px}.contacts a{font-size:12px}.closing{padding-bottom:24px}.closing-ornament{width:220px;height:55px;margin-bottom:18px}.folio{margin-top:24px}.sheet:before,.sheet:after{bottom:14px}.closing:after{left:-16px;right:-16px}}


/* Complete continuous double frame, including the top; four countdown units. */
.sheet:before,.sheet:after{width:auto;height:auto;border:1px solid #95734d55;pointer-events:none}
.sheet:before{top:31px;right:29px;bottom:14px;left:29px}
.sheet:after{top:35px;right:33px;bottom:18px;left:33px;border-color:#92714930}
.closing:after{display:none}
.hero .clock{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:700px){.sheet:before{top:22px;right:13px;bottom:14px;left:13px}.sheet:after{top:25px;right:16px;bottom:17px;left:16px}.hero .clock b{font-size:24px}.hero .clock span{font-size:9px}}

/* Direct v10 contact revision: visible telephone numbers and framed actions. */
.contacts .contact-number{font:400 15px/1.6 Playfair,serif;letter-spacing:.025em;white-space:nowrap;margin:0 0 18px}
.contact-actions{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}
.contacts .contact-actions a{display:inline-flex;justify-content:center;align-items:center;min-height:44px;margin:0;padding:8px 15px;border:1px solid #9776478c;background:#fff5da28;font:400 13px/1.4 Playfair,serif;text-decoration:none}
.contacts .contact-actions a:hover{color:#83172c;border-color:#83172c;background:#83172c08}
@media(max-width:700px){.contacts .contact-number{font-size:11px;letter-spacing:0;margin-bottom:14px}.contact-actions{display:grid;gap:8px}.contacts .contact-actions a{width:100%;padding:8px 9px;font-size:12px}}

/* Two-line closing signature on every screen. */
.closing-names,.closing-date{display:block}.closing-dot{display:none}
/* RSVP stationery panel with clearly bounded writing fields. */
.rsvp form{padding:30px;background:#f9efd9e8;border:1px solid #99764d9c;box-shadow:inset 0 0 0 4px #f8edd7,inset 0 0 0 5px #99764d38,0 5px 16px #6745251c;gap:22px}
.rsvp form label,.rsvp form legend{color:#34271f}
.rsvp form input:not([type=radio]),.rsvp form select,.rsvp form textarea{border:1px solid #8e735785;background:#fffbf2d9;margin-top:9px;padding:11px 12px;color:#34271f;box-shadow:inset 0 1px 3px #6745250a}
.rsvp form input::placeholder,.rsvp form textarea::placeholder{color:#796650;opacity:1}
.rsvp form textarea{min-height:125px}
.rsvp form input:focus-visible,.rsvp form select:focus-visible,.rsvp form textarea:focus-visible{outline:2px solid #83172c;outline-offset:2px;border-color:#83172c;background:#fffcf5}
.rsvp form .choices{gap:10px;margin-top:7px;padding-top:0}
.rsvp form .choices label{padding:10px 13px;min-height:46px;border:1px solid #99764d66;background:#fffbf28c}
.rsvp form .choices label:has(input:checked){border-color:#83172c;background:#83172c0b}
.rsvp form>.primary{margin-top:3px}
@media(max-width:700px){.rsvp form{padding:21px 16px;gap:19px}.rsvp form .choices{display:grid;grid-template-columns:1fr;gap:8px}.rsvp form .choices label{padding:10px;font-size:13px}.rsvp form input:not([type=radio]),.rsvp form select,.rsvp form textarea{font-size:16px;padding:10px}.rsvp form .row{gap:19px}}

/* Refined v11: a separate cream RSVP card and light contact links. */
.rsvp form{background:#F2E4C8;background-image:radial-gradient(ellipse at 20% 0,#fff8e618,transparent 70%);border:1px solid #a78b589c;border-radius:2px;box-shadow:0 4px 13px #67452518}
.rsvp form input:not([type=radio]),.rsvp form select,.rsvp form textarea{background:#F8EFDD;border:1px solid #9d836180;border-radius:2px;box-shadow:none}
.rsvp form .choices label{background:#F8EFDD;border:1px solid #9d836166;border-radius:2px}
.rsvp form .choices label:has(input:checked){background:#ecd9cb;border-color:#83172c}
.contact-actions{display:grid;justify-content:center;gap:0}
.contacts .contact-actions a{display:flex;justify-content:flex-start;gap:10px;min-height:44px;width:auto;padding:4px 0;border:0;background:transparent;font-size:13px}
.contacts .contact-actions a:hover{background:transparent;color:#83172c;text-decoration:underline;text-underline-offset:4px}
.contact-actions svg{display:block;flex:0 0 20px;width:20px;height:20px;color:#806b49}
.contacts .contact-number{margin-bottom:10px}
@media(max-width:700px){.contacts .contact-actions a{font-size:11px;padding:4px 0;gap:7px;width:auto}.contact-actions svg{flex-basis:18px;width:18px;height:18px}}

/* Contact proportions aligned with the latest reference. */
.contact-section{padding-top:32px}
.contact-section h3{font-size:17px;letter-spacing:.14em;margin-bottom:32px}
.contacts{gap:45px}
.contacts p{font-size:70px;line-height:1.3;margin-bottom:16px}
.contacts .contact-number{font-size:17px;letter-spacing:.03em;margin-bottom:22px}
.contact-actions{gap:5px}
.contacts .contact-actions a{font-size:17px;gap:15px;min-height:48px}
.contact-actions svg{flex-basis:27px;width:27px;height:27px;color:var(--ink);stroke-width:1.25}
@media(max-width:700px){.contact-section{padding-top:28px}.contact-section h3{font-size:13px;margin-bottom:25px}.contacts{gap:16px}.contacts p{font-size:44px;margin-bottom:12px}.contacts .contact-number{font-size:11px;letter-spacing:0;margin-bottom:16px}.contact-actions{gap:3px}.contacts .contact-actions a{font-size:12px;gap:8px;min-height:44px}.contact-actions svg{flex-basis:20px;width:20px;height:20px}}

/* Contacts continue the RSVP block without a separate heading or divider. */
.contact-section{border-top:0;padding-top:0;margin-top:30px}
@media(max-width:700px){.contact-section{padding-top:0;margin-top:26px}}
/* Raised ornamental initials; only the first three text lines wrap beside them. */
.dropcap{height:calc(3lh - 1px);margin:0 6px 0 0}
.dropcap img{position:absolute;top:-10px;right:0;width:100%;height:108px;object-fit:contain}
@media(max-width:700px){.dropcap{height:calc(3lh - 1px);margin:0 5px 0 0}.dropcap img{top:-8px;height:89px}}

/* Mobile initials occupy only two text lines; desktop remains unchanged. */
@media(max-width:700px){.dropcap{height:calc(2lh - 1px)}}
/* ===== v15: viktorijanska proza, kapljice u papiru i na papiru, animacije ===== */
@font-face{font-family:Garamond;src:url('../fonts/tajna-jednog-obecanja/eb-garamond.woff2') format('woff2');font-weight:400 800;font-display:swap}
@font-face{font-family:Garamond;src:url('../fonts/tajna-jednog-obecanja/eb-garamond-italic.woff2') format('woff2');font-style:italic;font-weight:400 800;font-display:swap}
:root{--prose:Garamond,'EB Garamond',Georgia,serif}

/* Tipografija: knjizna proza u EB Garamondu (stare brojke, ligature), Playfair ostaje za datume, vremena i kontrole. */
.letter p,.quote,.rsvp-intro,.hero .subtitle,.closing-line{font-family:var(--prose);font-feature-settings:"liga","onum";font-kerning:normal;hanging-punctuation:first}
.letter p{font-size:21px;line-height:1.72;text-wrap:pretty;hyphens:manual}
.letter p+p{text-indent:0}
.hero .subtitle{font-style:italic;font-size:24px;line-height:1.5;max-width:520px;color:#4a372a}
.quote{font-style:italic;font-size:27px;line-height:1.55;color:#4a372a;max-width:600px;margin-top:42px}
.rsvp-intro{font-size:20px;line-height:1.6;font-style:italic}
.section>.section-label,.section>.eyebrow{font-family:var(--prose);font-variant-caps:all-small-caps;font-feature-settings:"c2sc","smcp","onum";text-transform:none;letter-spacing:.2em;font-size:20px}
.section h2:not(.section-label){font-family:var(--prose);font-style:italic;font-weight:400;text-wrap:balance}
#clock-title{font-family:var(--prose)!important;font-size:16px!important}
.closing .closing-line{font-style:italic;font-size:18px;line-height:1.6;color:var(--faded);margin:-4px auto 0;max-width:420px}
.date{font-feature-settings:"lnum"}

/* Potpis u dva retka: vise ne izlazi iz papira na mobitelu. */
.letter p.signature{position:relative;font:39px/1.15 var(--script);font-feature-settings:normal;margin-top:34px!important}
.signature>span{display:block}
.signature>span+span{margin-top:2px}

/* Gumbi: kratka povratna informacija. */
.button{transition:background-color .3s ease,color .3s ease,border-color .3s ease,transform .18s ease,box-shadow .3s ease}
.button.primary:hover{background:#6a1f25;color:#fff3dc;box-shadow:0 6px 16px -8px #4a141c90}
.button:active{transform:translateY(1px) scale(.985)}
.rsvp form .choices label{transition:background-color .25s ease,border-color .25s ease}
.case-map{transition:color .25s ease}

@media(max-width:700px){
 .letter p{font-size:19.5px;line-height:1.68}
 .letter p.signature{font-size:34px}
 .hero .subtitle{font-size:20.5px;max-width:280px;line-height:1.5}
 .quote{font-size:22.5px;line-height:1.5;margin-top:34px}
 .rsvp-intro{font-size:17.5px}
 .section>.section-label,.section>.eyebrow{font-size:16px;letter-spacing:.16em}
 #clock-title{font-size:14px!important}
 .closing .closing-line{font-size:16px;max-width:260px}
}

/* ----- Animacije: samo uz JS i kad korisnik ne trazi smanjeno kretanje ----- */
@media (prefers-reduced-motion:no-preference){
 /* Uvod: imena se ispisuju tintom slijeva nadesno, pecat se utiskuje. */
 .js .hero h1>span{clip-path:inset(-30% 100% -30% -12%);transition:clip-path 0.744s cubic-bezier(.45,.05,.3,1)}
 .js .hero.is-ready h1>span{clip-path:inset(-30% -12% -30% -12%)}
 .js .hero.is-ready h1>span:nth-child(1){transition-delay:0.144s}
 .js .hero.is-ready h1>span:nth-child(2){transition-delay:0.624s;transition-duration:0.36s}
 .js .hero.is-ready h1>span:nth-child(3){transition-delay:0.792s;transition-duration:0.84s}
 .js .hero .heading-initial,.js .hero .docket>span:nth-child(2),.js .hero .subtitle,.js .hero .date,.js .hero .calendar,.js .hero .countdown{opacity:0;translate:0 10px;transition:opacity 1.2s ease,translate 1.2s cubic-bezier(.2,.7,.2,1)}
 .js .hero.is-ready .heading-initial,.js .hero.is-ready .docket>span:nth-child(2),.js .hero.is-ready .subtitle,.js .hero.is-ready .date,.js .hero.is-ready .calendar,.js .hero.is-ready .countdown{opacity:1;translate:0 0}
 .js .hero.is-ready .docket>span:nth-child(2){transition-delay:0.075s}
 .js .hero.is-ready .subtitle{transition-delay:1.275s}
 .js .hero.is-ready .date{transition-delay:1.176s}
 .js .hero.is-ready .calendar{transition-delay:1.272s}
 .js .hero.is-ready .countdown{transition-delay:1.68s}
 .js .hero .seal img{opacity:0;scale:1.35;rotate:-14deg}
 .js .hero.is-ready .seal img{animation:utisni 1.125s cubic-bezier(.3,.6,.2,1) 1.575s both}
 @keyframes utisni{0%{opacity:0;scale:1.35;rotate:-14deg}60%{opacity:1;scale:.96;rotate:2deg}80%{scale:1.015}100%{opacity:1;scale:1;rotate:0deg}}
 /* Jednokratno otkrivanje sekcija. */
 .js .rv{opacity:0;translate:0 16px;transition:opacity 1.62s ease,translate 1.62s cubic-bezier(.2,.7,.2,1)}
 .js .rv.is-visible{opacity:1;translate:0 0}
 .js .letter p.rv:nth-child(2){transition-delay:0.144s}.js .letter p.rv:nth-child(3){transition-delay:0.216s}
 /* Inicijal S/N procvjeta kao tinta. */
 .js .dropcap img{opacity:0;scale:1.12;transition:opacity 1.98s ease 0.27s,scale 2.34s cubic-bezier(.2,.7,.2,1) 0.27s}
 .js .is-visible .dropcap img{opacity:1;scale:1}
 /* Potpis se ispisuje. */
 .js .signature>span{clip-path:inset(-30% 100% -30% -10%);transition:clip-path 1.44s cubic-bezier(.45,.05,.3,1)}
 .js .signature.is-visible>span{clip-path:inset(-30% -10% -30% -10%)}
 .js .signature.is-visible>span+span{transition-delay:0.81s}
 .js .signature.rv{translate:0 0}
 /* Razdjelnice se sire iz sredine. */
 .js .divider{scale:0 1;transition:scale 2.16s cubic-bezier(.2,.7,.2,1)}
 .js .divider.is-visible{scale:1 1}
 /* Biljeske lokacija dolaze naizmjence, kao papiri spusteni na stol. */
 .js .case-file{opacity:0;translate:-22px 10px;rotate:-1.6deg;transition:opacity 1.53s ease,translate 1.62s cubic-bezier(.2,.7,.2,1),rotate 1.62s cubic-bezier(.2,.7,.2,1)}
 .js .case-file:nth-child(even){translate:22px 10px;rotate:1.6deg}
 .js .case-file.is-visible{opacity:1;translate:0 0;rotate:0deg}
 /* Zavrsni ukras se iscrtava perom. */
 .js .closing-ornament path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 3.96s cubic-bezier(.45,.05,.3,1)}
 .js .closing-ornament path:nth-child(2){transition-delay:0.63s}.js .closing-ornament path:nth-child(3){transition-delay:2.52s;transition-duration:1.08s}
 .js .closing-ornament.is-visible path{stroke-dashoffset:0}
 .js .folio-seal{opacity:0;scale:1.3;transition:opacity 1.08s ease 0.9s,scale 1.08s cubic-bezier(.3,1.4,.5,1) 0.9s}
 .js .folio.is-visible .folio-seal{opacity:1;scale:1}
}
@media print{.js .rv,.js .case-file,.js .drop,.js .hero *{opacity:1!important;translate:none!important;clip-path:none!important;animation:none!important}}


/* ===== v18: uvod kao pismo koje se polako otvara ===== */
@media (prefers-reduced-motion:no-preference){
 /* 1. Zaglavlje: „Poziv za vjencanje” se ispisuje perom, inicijali u kutovima procvjetaju, crta se razvuce iz sredine. */
 .js .hero .docket{position:relative;border-bottom-color:transparent}
 .js .hero .docket::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--line);scale:0 1;transition:scale 2.1s cubic-bezier(.2,.7,.2,1) .9s}
 .js .hero.is-ready .docket::after{scale:1 1}
 .js .hero .docket>span:nth-child(2){opacity:1;translate:none;clip-path:inset(-45% 100% -45% -6%);transition:clip-path 1.75s cubic-bezier(.45,.05,.3,1) .25s}
 .js .hero.is-ready .docket>span:nth-child(2){clip-path:inset(-45% -6% -45% -6%);transition-delay:.25s}
 .js .hero .heading-initial{opacity:0;translate:none;scale:1.22;rotate:-4deg;filter:blur(6px);transition:opacity 1.9s ease,scale 2.2s cubic-bezier(.2,.7,.2,1),rotate 2.2s cubic-bezier(.2,.7,.2,1),filter 1.9s ease}
 .js .hero .heading-initial:last-child{rotate:4deg}
 .js .hero.is-ready .heading-initial{opacity:1;scale:1;rotate:0deg;filter:blur(0)}
 .js .hero.is-ready .heading-initial:first-child{transition-delay:.45s}
 .js .hero.is-ready .heading-initial:last-child{transition-delay:.75s}

 /* 2. Podnaslov: rijec po rijec, kao tinta koja se upija u papir (nakon imena). */
 .js .hero .subtitle{opacity:1;translate:none;transition:none}
 .js .hero .subtitle .rijec{display:inline-block;opacity:0;filter:blur(5px);translate:0 7px;transition:opacity 0.8s ease,filter 0.88s ease,translate 0.88s cubic-bezier(.2,.7,.2,1);transition-delay:calc(1.68s + var(--i) * 0.056s)}
 .js .hero.is-ready .subtitle .rijec{opacity:1;filter:blur(0);translate:0 0}

 /* 3. Datum se „slegne”: razmak slova se stisne na mjesto. */
 .js .hero .date{translate:none}
 .js .hero.is-ready .date{transition:opacity 1.04s ease 2.1s,letter-spacing 1.52s cubic-bezier(.2,.7,.2,1) 2.1s}
 .js .hero:not(.is-ready) .date{letter-spacing:.42em}
 .js .hero .calendar{translate:0 6px}
 .js .hero.is-ready .calendar{translate:0 0;transition:opacity 0.88s ease 2.5s,translate 0.88s cubic-bezier(.2,.7,.2,1) 2.5s}

 /* 4. Odbrojavanje: naslov, pa stupci jedan za drugim. */
 .js .hero .countdown{opacity:1;translate:none;transition:none}
 .js .hero #clock-title,.js .hero .clock>div{opacity:0;translate:0 8px;transition:opacity 0.84s ease,translate 0.84s cubic-bezier(.2,.7,.2,1)}
 .js .hero.is-ready #clock-title,.js .hero.is-ready .clock>div{opacity:1;translate:0 0}
 .js .hero.is-ready #clock-title{transition-delay:3.1s}
 .js .hero.is-ready .clock>div:nth-child(1){transition-delay:3.26s}
 .js .hero.is-ready .clock>div:nth-child(2){transition-delay:3.38s}
 .js .hero.is-ready .clock>div:nth-child(3){transition-delay:3.5s}
 .js .hero.is-ready .clock>div:nth-child(4){transition-delay:3.62s}

 /* 5. Pecat: spusti se, utisne u vosak i papir, a pritisak se razlije kao blagi trag. */
 .js .hero .seal{position:relative}
 .js .hero.is-ready .seal img{animation:utisni18 1.2s cubic-bezier(.3,.6,.2,1) 4.8s both}
 @keyframes utisni18{0%{opacity:0;scale:1.55;rotate:-18deg;translate:0 -10px}45%{opacity:1}58%{scale:.94;rotate:2deg;translate:0 0}74%{scale:1.02;rotate:-.5deg}100%{opacity:1;scale:1;rotate:0deg;translate:0 0}}
 .js .hero .seal::after{content:"";position:absolute;inset:4%;border-radius:50%;z-index:-1;background:radial-gradient(closest-side,#5a1a2000 55%,#5a1a2030 78%,#5a1a2000);opacity:0;scale:.85;pointer-events:none}
 .js .hero.is-ready .seal::after{animation:trag18 1.2s ease-out 5.48s both}
 @keyframes trag18{0%{opacity:0;scale:.85}25%{opacity:1}100%{opacity:0;scale:1.45}}
}
/* v20: vise zraka iznad imena, samo desktop. */
@media(min-width:701px){.hero h1{margin-top:58px}}

/* ===== Produkcija (app): elementi koje lokalne verzije nisu imale ===== */
.tjo-sr,.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.honeypot{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.countdown-done{font:italic 15px/1.6 var(--prose);color:var(--faded);margin:12px 0 0}
.hero .heading-initial img[hidden],.dropcap--prazno{display:none}
.party-note{font-size:13px;color:var(--faded);margin:-8px 0 0}
.form-error{margin:0 0 18px;padding:12px 14px;border:1px solid #83172c;background:#83172c0d;color:#5f1020;font-size:15px;line-height:1.5}
.rsvp-done{padding:30px;background:#F2E4C8;border:1px solid #a78b589c;text-align:center}
.rsvp-done h3{font:italic 400 28px/1.3 var(--prose);margin:0 0 10px}
.rsvp-done p{margin:0 0 18px}
.rsvp form .privacy a{color:inherit}
.tjo-form label>span{color:var(--faded)}
.contacts .contact-number a{text-decoration:none}
@media(max-width:700px){.rsvp-done{padding:22px 16px}.rsvp-done h3{font-size:24px}.form-error{font-size:14px}}
/* Inicijal: slovo ostaje u tekstu, ali se vizualno skriva iza slike. */
.ima-inicijal::first-letter{font-size:0;color:transparent;letter-spacing:0}
.tjo-dvoslov{font-size:0;color:transparent}
.letter p.ima-inicijal{display:flow-root}
.contacts .contact-actions a.tjo-ogled{cursor:default}.contacts .contact-actions a.tjo-ogled:hover{color:inherit;text-decoration:none}

/* Mobile notes must stay inside the sheet's inner frame, including padding and paper edges. */
@media(max-width:700px){
 .case-route{width:100%;max-width:100%;margin:0 auto;padding:6px;box-sizing:border-box;align-items:start}
 .case-file,.case-file:last-child{width:100%;max-width:100%;min-width:0;box-sizing:border-box;justify-self:stretch;translate:none!important;rotate:none!important}
 .case-file:nth-child(even){transform:none;justify-self:stretch}
 .case-file h3,.case-address{overflow-wrap:anywhere}
}

/* Mobilne bilješke lokacija iste veličine (2026-10-15): svi redovi jednake
   visine (najviša bilješka), bilješka ispunjava ćeliju, a „Otvori kartu” sjeda
   na dno — da se kartice ne razlikuju po visini zbog duljine naziva/adrese ili
   zato što neka nema vrijeme. Pomaci i animacije ostaju kakvi jesu. */
@media(max-width:700px){
 .case-route{grid-auto-rows:1fr;align-items:stretch}
 .case-file,.case-file:last-child{display:flex;flex-direction:column;height:100%}
 .case-file .case-map{margin-top:auto}
}