/* OPHIR — minimalistyczna strona zapowiadająca otwarcie, v5, 25.10.2026 */
:root{
  --paper:#FBF9F5;
  --ink:#342b25;
  --gold:#A2804A;
  --serif:"Cormorant Garamond","GFS Baskerville",Georgia,serif;
  --sans:"Manrope",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:280px;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
.page{max-width:1680px;min-height:100svh;margin:0 auto;display:grid;grid-template-columns:minmax(0,44fr) minmax(0,56fr);gap:clamp(32px,4.2vw,68px);padding:clamp(16px,2.5vh,30px) clamp(24px,3vw,48px);align-items:center}
.visual{margin:0;align-self:center;width:100%;height:min(780px, calc(100svh - 2 * clamp(16px,2.5vh,30px)));min-height:0;max-height:820px;overflow:hidden;background:#aa8a73}
.visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 52%}
.content{width:100%;max-width:600px;padding:0 clamp(8px,1.5vw,26px) 0 0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:clamp(16px,2.4vh,25px)}
.brand{text-align:center;align-self:center;max-width:330px;width:100%}
.brand-title{margin:0}
.logo{display:block;width:min(100%,270px);height:auto;margin:0 auto -14px}
.tagline{font-family:var(--serif);font-size:clamp(16px,1.1vw,19px);font-weight:300;letter-spacing:.20em;line-height:1.1;margin:0}
.brand::after,.story::after{content:"";display:block;background:var(--gold);height:1px;width:43px;opacity:.85}
.brand::after{margin:clamp(12px,2vh,20px) auto 0}
.story{font-family:var(--serif);font-size:clamp(22px,1.55vw,26px);font-weight:300;line-height:1.18;letter-spacing:0;max-width:530px}
.story p{margin:0}
.story p + p{margin-top:.75em}
.story::after{margin:clamp(13px,2vh,21px) auto 0}
.contact{max-width:540px;width:100%}
.contact h2{font-family:var(--serif);font-weight:300;font-size:clamp(26px,2vw,32px);line-height:1.1;letter-spacing:0;margin:0 0 7px}
.contact>p{font-family:var(--serif);font-size:clamp(20px,1.38vw,23px);font-weight:300;line-height:1.18;margin:0}
.social{margin-top:clamp(9px,1.5vh,15px);display:flex;flex-wrap:wrap;align-items:center;gap:clamp(14px,1.8vw,22px)}
.social a{font-family:var(--sans);font-size:12px;letter-spacing:.012em;text-decoration:none;color:var(--ink);display:inline-flex;align-items:center;gap:7px;line-height:1.35;padding:5px 0;transition:color .16s ease}
.social svg{color:var(--gold);width:19px;height:19px;flex-shrink:0}
.social a span{border-bottom:1px solid rgba(52,43,37,.45);padding-bottom:3px}
.social a:hover{color:#80623e}
.social a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
@media(max-width:1100px) and (min-width:761px){
  .page{grid-template-columns:minmax(0,45fr) minmax(0,55fr);gap:clamp(25px,3vw,44px);padding:clamp(16px,2.5vh,23px)}
  .content{padding-right:0;gap:clamp(13px,2vh,21px)}
  .story{font-size:clamp(21px,2.1vw,24px)}
  .contact h2{font-size:clamp(25px,2.8vw,30px)}.contact>p{font-size:clamp(20px,2.1vw,22px)}
  .visual{height:calc(100svh - 2 * clamp(16px,2.5vh,23px))}
  .brand::after{margin-top:17px}.story::after{margin-top:16px}
}
@media(min-width:761px) and (max-height:740px){
  .page{padding-block:14px}
  .visual{height:calc(100svh - 28px)}
  .content{gap:14px}
  .logo{width:min(100%,230px);margin-bottom:-11px}
  .tagline{font-size:15px}
  .brand::after{margin-top:12px}
  .story{font-size:clamp(20px,1.42vw,23px);line-height:1.15}
  .story p + p{margin-top:.55em}
  .story::after{margin-top:14px}
  .contact h2{font-size:26px}
  .contact>p{font-size:20px;line-height:1.15}
  .social{margin-top:8px}
}
@media(max-width:760px){
  .page{display:flex;flex-direction:column;min-height:0;padding:0;gap:0}
  .content{display:contents}
  .brand{order:0;max-width:none;width:100%;padding:23px 18px 22px}
  .logo{width:clamp(180px,52vw,260px);margin:0 auto -15px}
  .tagline{font-size:16px;letter-spacing:.19em}
  .brand::after{display:none}
  .visual{order:1;align-self:auto;width:100%;height:clamp(340px,108vw,540px);min-height:0;max-height:none}
  .visual img{min-height:0;height:100%;object-fit:cover;object-position:center 60%}
  .story{order:2;max-width:640px;padding:0 30px;margin:37px auto 0;font-size:clamp(23px,5.9vw,29px);line-height:1.25;letter-spacing:0}
  .story::after{margin:34px auto 0}
  .contact{order:3;padding:0 30px 43px;margin:35px auto 0;max-width:640px}
  .contact h2{font-size:clamp(26px,6.7vw,30px)}
  .contact>p{font-size:clamp(21px,5.55vw,24px);line-height:1.26}
  .social{margin-top:21px;column-gap:17px;row-gap:8px}
}
@media(max-width:360px){.story,.contact{padding-inline:24px}.story{font-size:23px}.contact>p{font-size:21px}.social{gap:14px}.social a{font-size:11px}.social svg{width:19px;height:19px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.social a{transition:none}}

/* Autorskie łamanie wersów na dużym ekranie; na mniejszych ekranach tekst płynie naturalnie. */
.editorial-break{display:none}
@media (min-width:1600px) and (min-height:800px){
  .editorial-break{display:block}
  .story{max-width:100%;width:100%;font-size:21px}
}
