@font-face{font-family:Bosca;src:url('./fonts/Bosca-Light.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:Bosca;src:url('./fonts/Bosca-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
:root{--ink:#143f50;--accent:#236780;--muted:#45616c;--paper:#fbfcff;--frame:20px;--space:clamp(28px,4.2vw,64px);--ease:cubic-bezier(.22,1,.36,1);color-scheme:light;font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.7 system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,p{margin:0}
a{color:inherit;text-underline-offset:5px}
svg{width:24px;height:24px;display:block;flex:none}
::selection{background:#d8e9fc;color:var(--ink)}
:focus-visible{outline:3px solid var(--accent);outline-offset:6px}
.skip-link{position:fixed;z-index:10;left:16px;top:16px;padding:12px 20px;border-radius:99px;background:var(--ink);color:white;transform:translateY(-150%)}
.skip-link:focus{transform:none}
.welcome{position:relative;isolation:isolate;overflow:hidden;width:calc(100% - var(--frame)*2);max-width:none;min-height:calc(100svh - var(--frame)*2);min-height:calc(100dvh - var(--frame)*2);margin:var(--frame);padding:var(--space);border-radius:40px;display:flex;flex-direction:column;background:radial-gradient(ellipse at 6% 0%,#fff 0%,#ffffff9c 30%,transparent 66%),radial-gradient(ellipse at 100% 25%,#e0ecff90 0%,transparent 66%),radial-gradient(ellipse at 15% 100%,#e5f3fc80 0%,transparent 60%),linear-gradient(125deg,#f8fbff,#edf4ff 55%,#e9f1ff);box-shadow:inset 0 1px 0 #fff}
.dream{position:absolute;z-index:-2;pointer-events:none;will-change:transform;border-radius:50%;filter:blur(55px);transform:translate3d(var(--dream-x,0px),var(--dream-y,0px),0);transition:transform 2s var(--ease)}
.dream--one{inset:10% auto auto 40%;width:60%;height:60%;background:radial-gradient(ellipse,#f8fbffc7,transparent 70%);animation:dream-drift 22s ease-in-out infinite alternate}
.dream--two{inset:auto auto -25% -18%;width:80%;height:85%;background:radial-gradient(ellipse,#dceafc99,transparent 68%)}
.watermark,.brand-symbol{background:var(--ink);-webkit-mask:url('./monogram.svg') center/contain no-repeat;mask:url('./monogram.svg') center/contain no-repeat}
.watermark{position:absolute;z-index:-1;pointer-events:none;right:-3%;top:17%;width:min(50vw,720px);aspect-ratio:1;opacity:.025;rotate:-12deg;translate:var(--watermark-x,0px) var(--watermark-y,0px);transition:translate .85s var(--ease)}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:32px}
.wordmark{font:300 clamp(68px,10.6vw,164px)/1.12 Bosca,Georgia,serif;letter-spacing:-.055em;white-space:nowrap;display:block;animation:wordmark-arrive 1.65s var(--ease) both}
.brand-symbol{display:block;width:clamp(70px,8.1vw,118px);height:clamp(70px,8.1vw,118px);flex:none;animation:mark-arrive 1.8s var(--ease) .15s both}
.welcome-content{display:grid;grid-template-columns:1.2fr 1fr;gap:10%;align-items:end;margin-top:clamp(60px,10svh,150px);margin-bottom:48px;flex:1}
.welcome-title{animation:content-arrive 1.35s var(--ease) .2s both}
.status{display:inline-flex;align-items:center;gap:10px;max-width:100%;font-size:16px;line-height:1.5;padding:10px 16px;border:1px solid #ffffffd4;border-radius:999px;background:#ffffff78;box-shadow:0 3px 14px #4d78a205;margin-bottom:32px}
.status-dot{width:6px;height:6px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 4px #23678008;flex:none}
h1{font:300 clamp(70px,7.5vw,112px)/.98 Bosca,Georgia,serif;letter-spacing:-.035em;max-width:650px;text-wrap:balance}
h1 span,h1 em{display:block}
h1 em{font-style:normal;font-weight:400;color:var(--accent)}
.welcome-copy{max-width:430px;animation:content-arrive 1.45s var(--ease) .4s both;padding-bottom:4px}
.welcome-copy p{line-height:1.8;max-width:390px}
.welcome-copy .intro{font-size:18px;line-height:1.75;margin-bottom:18px}
.call-button{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;text-decoration:none;margin-top:28px;min-height:78px;padding:14px 24px;border:1px solid transparent;border-radius:25px;isolation:isolate;position:relative;overflow:hidden;color:white;background:linear-gradient(110deg,#143f50,#236780);box-shadow:0 8px 22px -15px #143f5066;transition:border-color .7s,box-shadow .7s}
.call-button::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,#236780,#28788f);opacity:0;transition:opacity .85s var(--ease)}
.call-label{display:block;font-size:14px;line-height:1.5;color:#e8f1ff}
.call-number{display:block;font-size:20px;line-height:1.5;font-weight:500;white-space:nowrap}
.phone-icon{display:grid;place-items:center;width:26px;height:26px;rotate:0deg;transition:rotate .85s var(--ease)}
.phone-icon svg{width:24px;height:24px}
.social-links{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:16px}
.line-link{position:relative;display:inline-flex;align-items:center;gap:10px;padding:8px 0;text-decoration:none;min-height:44px;font-size:16px}
.line-link::after{content:'';position:absolute;left:0;right:0;bottom:7px;height:1px;background:currentColor;scale:0 1;transform-origin:right;transition:scale .7s var(--ease)}
.line-link svg{width:19px;height:19px;rotate:-45deg;transition:rotate .75s var(--ease)}
.line-link:focus-visible::after{scale:1 1;transform-origin:left}
.line-link:focus-visible svg{rotate:0deg}
.call-button:focus-visible::before{opacity:1}
.services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:8px}
.service{--service-pad:27px;--service-icon-size:26px;padding:var(--service-pad);border:1px solid #ffffffc9;border-radius:28px;background:#ffffff38;box-shadow:inset 0 1px 0 #ffffff7a;animation:content-arrive 1.35s var(--ease) .55s both;transition:background-color .8s,border-color .8s}
.service:nth-child(2){animation-delay:.68s}
.service:nth-child(3){animation-delay:.81s}
.service-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:var(--service-icon-size);margin-bottom:30px}
.service h2{font:300 36px/var(--service-icon-size) Bosca,Georgia,serif;letter-spacing:-.02em;translate:0 .22em}
.service-icon{width:var(--service-icon-size);height:var(--service-icon-size);color:var(--accent);transition:rotate 1.1s var(--ease),translate 1.1s var(--ease)}
.service p{font-size:16px;line-height:1.7;max-width:350px}
.practical{display:grid;grid-template-columns:1.1fr .65fr 1fr;gap:36px;margin:54px calc(var(--frame) + var(--space)) 40px}
.detail h2{font:500 16px/1.5 system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--accent);margin-bottom:16px}
.detail p{font-size:16px;line-height:1.75;max-width:350px}
.location-link{padding-top:0;align-items:flex-start}
.location-link svg{margin-top:5px}
.page-footer{margin:0 calc(var(--frame) + var(--space));padding:22px 0 28px;border-top:1px solid #dbe6f580;display:flex;justify-content:space-between;gap:20px;font-size:14px;color:var(--muted)}
@keyframes wordmark-arrive{from{opacity:.1;translate:0 22px;clip-path:inset(0 -5% 80% -5%)}to{opacity:1;translate:0 0;clip-path:inset(-30% -5% -30% -5%)}}
@keyframes mark-arrive{from{opacity:0;translate:12px 14px;rotate:-10deg;scale:.92}to{opacity:1;translate:0 0;rotate:0deg;scale:1}}
@keyframes content-arrive{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
@keyframes dream-drift{from{translate:-4% -3%;scale:1}to{translate:5% 7%;scale:1.08}}
@media(hover:hover) and (pointer:fine){
 .call-button:hover::before{opacity:1}
 .call-button:hover{border-color:#7eb2c3;box-shadow:0 8px 25px -15px #143f5080}
 .call-button:hover .phone-icon{rotate:-10deg}
 .line-link:hover::after{scale:1 1;transform-origin:left}
 .line-link:hover svg{rotate:0deg}
 .service:hover{background-color:#ffffff64;border-color:#fff}
 .service:hover .service-icon--flower{rotate:45deg}
 .service:hover .service-icon--waves{translate:3px 0}
 .service:hover .service-icon--leaf{rotate:12deg}
}
@media(max-width:1100px){
 :root{--frame:18px;--space:34px}
 .welcome-content{gap:7%;grid-template-columns:1.1fr 1fr;margin-top:80px;margin-bottom:40px}
 h1{font-size:clamp(66px,8vw,88px)}
 .service{--service-pad:21px}
 .service h2{font-size:34px}
 .practical{gap:28px;grid-template-columns:1.2fr .7fr 1fr}
}
@media(max-width:800px){
 :root{--space:30px}
 .wordmark{font-size:10.9vw}
 .brand-symbol{width:78px;height:78px}
 .welcome-content{margin-top:94px;gap:6%;grid-template-columns:1fr 1fr}
 h1{font-size:9.4vw}
 .welcome-copy .intro{font-size:17px}
 .call-button{gap:20px;padding:14px 19px;border-radius:23px}
 .call-number{font-size:18px}
 .social-links{gap:10px 22px}
 .services{gap:12px}
 .service{--service-pad:17px;--service-icon-size:22px;border-radius:24px}
 .service h2{font-size:31px}
 .service-heading{gap:10px;margin-bottom:36px}
 .service p{font-size:16px}
 .practical{grid-template-columns:1.2fr 1fr;gap:30px 40px;margin-top:40px}
 .detail--parking{grid-column:1/-1}
 .detail--parking p{max-width:none}
}
@media(max-width:740px){
 :root{--frame:12px;--space:24px}
 .welcome{border-radius:32px}
 .masthead{gap:16px}
 .wordmark{font-size:12.2vw;line-height:1.12;letter-spacing:-.055em}
 .brand-symbol{width:48px;height:48px}
 .watermark{width:105%;top:16%;right:-45%;opacity:.022}
 .welcome-content{display:block;margin-top:66px;margin-bottom:34px}
 .status{font-size:14px;margin-bottom:28px;padding:9px 13px;gap:9px}
 h1{font-size:clamp(66px,17vw,100px);line-height:1.02}
 .welcome-copy{max-width:none;margin-top:36px;padding-bottom:0}
 .welcome-copy .intro{font-size:17px;margin-bottom:16px}
 .welcome-copy p{max-width:none}
 .call-button{display:flex;width:100%;margin-top:24px;padding:14px 21px;border-radius:24px;min-height:80px}
 .call-number{font-size:20px}
 .social-links{gap:12px 30px;margin-top:12px}
 .services{grid-template-columns:1fr;gap:12px;margin-top:0}
 .service{--service-pad:22px;--service-icon-size:25px;border-radius:25px}
 .service-heading{margin-bottom:30px}
 .service h2{font-size:34px}
 .service p{max-width:none}
 .practical{grid-template-columns:1fr;gap:28px;margin-top:36px;margin-bottom:34px}
 .detail--parking{grid-column:auto}
 .detail h2{margin-bottom:10px}
 .page-footer{display:block;font-size:14px;padding:20px 0 24px}
 .page-footer p+p{margin-top:6px}
}
@media(max-width:359px){
 :root{--space:20px}
 .masthead{gap:12px}
 .brand-symbol{width:42px;height:42px}
 .wordmark{font-size:11.8vw}
 .welcome-content{margin-top:58px}
 h1{font-size:61px}
 .call-button{padding-inline:17px;gap:16px}
 .call-number{font-size:19px}
 .service{--service-pad:20px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .dream,.watermark{transform:none;translate:none}
}

/* Samostojna stran 404; začetna postavitev ostaja enaka. */
.error-panel .welcome-content{align-items:center;margin-bottom:0}
.error-panel h1{font-size:clamp(48px,6vw,84px)}