/* La Sindrome di Mykonos — shared styles
   Design system rifatto con ui-ux-pro-max:
   Cicladi blu & bianco · font Libre Bodoni + Public Sans */
html { scroll-behavior: smooth; }
body { background: #FBFDFF; }
::selection { background: #0B6FC2; color: #FFFFFF; }

.kicker { font-family: "Public Sans", system-ui, sans-serif; text-transform: uppercase; letter-spacing: 0.28em; font-weight: 600; }

/* Drop cap */
.dropcap::first-letter {
  font-family: "Libre Bodoni", serif;
  float: left;
  font-size: 4.6rem;
  line-height: 0.78;
  padding: 0.06em 0.12em 0 0;
  color: #0B6FC2;
  font-weight: 700;
}

/* Hairline accent rule */
.rule::after { content:""; display:block; width:46px; height:2px; background:#0EA5E9; margin-top:14px; }
.rule-center::after { margin-left:auto; margin-right:auto; }

/* Photo treatment — zoom lento e quasi invisibile */
.photo { background:#EAF4FD; overflow:hidden; }
.photo img { transition: transform 1.6s cubic-bezier(.16,.84,.44,1), filter 1s ease; }
.group:hover .photo img, .zoom:hover img { transform: scale(1.04); }

/* Scroll reveal — lento ed elegante */
.reveal { opacity:0; transform: translateY(18px); transition: opacity 1.1s ease, transform 1.1s cubic-bezier(.16,.84,.44,1); }
.reveal.in { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity:1; transform:none; transition:none; }
  .photo img { transition:none; }
  html { scroll-behavior:auto; }
}

/* Animated underline links */
.ul-link { position:relative; }
.ul-link::after { content:""; position:absolute; left:0; bottom:-3px; width:0; height:1px; background:currentColor; transition:width .4s ease; }
.ul-link:hover::after { width:100%; }

/* Article body typography */
.prose-myk p { margin-bottom: 1.4em; }
.prose-myk h3 { font-family:"Libre Bodoni",serif; font-size:1.8rem; line-height:1.2; margin:2.2em 0 .7em; }
.prose-myk blockquote {
  font-family:"Libre Bodoni",serif; font-style:italic; color:#0B6FC2;
  font-size:1.7rem; line-height:1.35; margin:1.8em 0; padding-left:1.2rem;
  border-left:3px solid #0EA5E9;
}
.prose-myk em { font-style:italic; }

/* Print-grain overlay */
.grain { position:fixed; inset:0; pointer-events:none; z-index:50; opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
