/* Punto Cabrera theme — layout and brand styling. Component styles come from the Punto Cabrera Core plugin. */

:root {
	--punto-wide: var(--wp--style--global--wide-size, 1200px);
	--punto-gutter: clamp(1rem, 4vw, 2rem);
	--punto-header-h: 84px;
	--punto-sticky-top: var(--punto-header-h);
	--punto-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40c120-26 240-26 360 0s240 26 360 0 240-26 360 0 240 26 360 0v40H0z' fill='%23fffcf5'/%3E%3C/svg%3E");
}

html { scroll-padding-top: calc(var(--punto-header-h) + 1rem); }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; }
::selection { background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--wp--preset--color--ocean); outline-offset: 3px; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-site-blocks { padding-top: 0; padding-bottom: 0; }
p { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }
img { height: auto; }

.skip-link.screen-reader-text:focus { background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); font-weight: 800; z-index: 1000; }

/* -------- Header -------- */
.punto-site-header { position: sticky; top: 0; z-index: 50; }
.admin-bar .punto-site-header { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { .admin-bar .punto-site-header { top: 0; } }
.punto-header {
	background: var(--wp--preset--color--cream); /* no backdrop-filter: it would trap the fixed mobile menu overlay */
	border-bottom: 1px solid rgba(10, 34, 64, .1); padding-top: .55rem !important; padding-bottom: .55rem !important;
}
.punto-header__bar { gap: 1rem; }
.punto-header__actions { gap: clamp(.5rem, 1.5vw, 1.25rem); flex-wrap: nowrap; }
.punto-header__actions > * { flex: none; }
.punto-header .punto-brand img { width: 58px; height: 58px; }
.punto-header .punto-lang { color: var(--wp--preset--color--navy); }
.punto-header .punto-btn-row { margin: 0; flex-wrap: nowrap; }
.punto-header .punto-btn { min-height: 44px; padding: .5rem 1rem; background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); }
.punto-header .punto-btn:hover { background: var(--wp--preset--color--gold-soft); }
.punto-nav .wp-block-navigation-item__content { padding: .5rem .2rem; color: var(--wp--preset--color--navy); text-decoration: none; position: relative; }
.punto-nav .wp-block-navigation-item__content::after {
	content: ""; position: absolute; left: .2rem; right: .2rem; bottom: .15rem; height: 3px; border-radius: 3px;
	background: var(--wp--preset--color--turquoise); transform: scaleX(0); transform-origin: left; transition: transform .25s;
}
.punto-nav .wp-block-navigation-item__content:hover::after,
.punto-nav .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
.punto-nav .wp-block-navigation__container { gap: clamp(.75rem, 2vw, 1.6rem); }
.punto-nav .wp-block-navigation__responsive-container-open { width: 46px; height: 46px; border-radius: 50%; background: var(--wp--preset--color--navy); color: var(--wp--preset--color--gold); align-items: center; justify-content: center; }
@media (max-width: 599px) { .punto-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; } }
.punto-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 1.5rem; background: var(--wp--preset--color--navy) !important; }
.punto-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 4rem; }
.punto-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { color: var(--wp--preset--color--cream); font-family: var(--wp--preset--font-family--display); font-size: 2rem; font-weight: 400; }
.punto-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 1rem; align-items: flex-start; }
.punto-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start; }
.punto-nav .wp-block-navigation__responsive-container-close { color: var(--wp--preset--color--gold); }

@media (max-width: 781px) {
	:root { --punto-header-h: 72px; }
	.punto-brand__text { display: none; }
	.punto-header .punto-brand img { width: 52px; height: 52px; }
	.punto-header .punto-btn span:not(.screen-reader-text) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.punto-header .punto-btn { width: 46px; height: 46px; min-height: 46px; padding: 0; justify-content: center; }
	.punto-header__actions { flex-direction: row-reverse; }
}
@media (min-width: 782px) and (max-width: 1080px) {
	.punto-header .punto-btn span:not(.screen-reader-text) { display: none; }
	.punto-header .punto-btn { width: 46px; padding: 0; justify-content: center; }
}

/* -------- Shared section rhythm -------- */
.punto-main { padding-bottom: 0; }
.punto-main--standard { padding-top: 3rem; padding-bottom: 4rem; }
.is-layout-constrained > :is(.punto-footer, .punto-footer__bottom, .punto-menu, .punto-reserve, .punto-contact, .punto-cards, .punto-strip, .punto-specials, .punto-gallery, .wp-block-columns) { max-width: var(--punto-wide); margin-left: auto; margin-right: auto; }
.punto-section { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); }
.punto-section__inner { max-width: var(--punto-wide); margin: 0 auto; padding-inline: var(--punto-gutter); }
.punto-section--sand { background: var(--wp--preset--color--sand); }
.punto-section-title { margin: 0 0 1rem; }
.punto-signature .punto-section-title, .punto-gallery-section .punto-section-title, .punto-specials .punto-section-title { text-align: center; }
.punto-signature .punto-eyebrow, .punto-gallery-section .punto-eyebrow, .punto-specials .punto-eyebrow { text-align: center; }
.punto-eyebrow {
	font-family: var(--wp--preset--font-family--display); font-style: normal; font-size: 1.2rem; color: var(--wp--preset--color--ocean);
	margin: 0 0 .35rem; display: flex; align-items: center; gap: .6rem;
}
.punto-eyebrow::before { content: ""; width: 34px; height: 10px; flex: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 10'%3E%3Cpath d='M1 5c4-4 8-4 12 0s8 4 12 0 6-3 8-1' fill='none' stroke='%231fb3c2' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain; }
:is(.punto-signature, .punto-gallery-section, .punto-specials) .punto-eyebrow { justify-content: center; }

/* -------- Home hero: the one bold moment -------- */
.punto-hero {
	position: relative; isolation: isolate; overflow: hidden; color: #fff;
	background: radial-gradient(120% 90% at 85% 40%, #1b5d8f 0%, var(--wp--preset--color--navy-2) 35%, var(--wp--preset--color--navy) 75%);
	padding-top: clamp(2.5rem, 7vw, 5.5rem) !important; padding-bottom: clamp(6rem, 12vw, 9rem) !important;
}
.punto-hero.has-photo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, rgba(10, 34, 64, .94) 0%, rgba(10, 34, 64, .78) 48%, rgba(10, 34, 64, .35) 100%); }
.punto-hero::after {
	content: ""; position: absolute; left: -5%; right: -5%; bottom: -1px; height: clamp(50px, 7vw, 90px); z-index: 0;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0 46c160-30 320-30 480 0s320 30 480 0 320-30 480 0v44H0z' fill='%231fb3c2' fill-opacity='.55'/%3E%3C/svg%3E") repeat-x 0 0 / 50% 100%,
		var(--punto-wave) repeat-x 0 12px / 50% 100%;
}
@media (prefers-reduced-motion: no-preference) {
	.punto-hero::after { animation: punto-tide 18s linear infinite; }
	@keyframes punto-tide { from { background-position: 0 0, 0 12px; } to { background-position: 50% 0, -50% 12px; } }
	.punto-hero__cols > .wp-block-column:first-child > * { animation: punto-rise .8s cubic-bezier(.2, .7, .2, 1) both; }
	.punto-hero__cols > .wp-block-column:first-child > :nth-child(2) { animation-delay: .08s; }
	.punto-hero__cols > .wp-block-column:first-child > :nth-child(3) { animation-delay: .16s; }
	.punto-hero__cols > .wp-block-column:first-child > :nth-child(4) { animation-delay: .24s; }
	.punto-hero__logo { animation: punto-sun 1.1s cubic-bezier(.2, .7, .2, 1) both .1s; }
	@keyframes punto-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
	@keyframes punto-sun { from { opacity: 0; transform: translateY(30px) rotate(-6deg) scale(.94); } to { opacity: 1; transform: none; } }
}
.punto-hero > * { position: relative; z-index: 1; }
.punto-hero__cols { align-items: center !important; gap: clamp(1.5rem, 4vw, 4rem) !important; }
.punto-hero .punto-eyebrow { color: var(--wp--preset--color--gold); }
.punto-hero .punto-eyebrow::before { filter: brightness(1.4); }
.punto-hero__title { color: #fff; font-size: clamp(2.6rem, 6.4vw, 5rem); line-height: 1.02; margin: .2rem 0 1rem; letter-spacing: -.01em; }
.punto-hero__lead { font-size: clamp(1.08rem, 1.6vw, 1.3rem); color: #dbe7f5; max-width: 34em; }
.punto-hero .punto-btn--outline { color: #fff; }
.punto-hero__logo { margin: 0 auto; max-width: 440px; width: 100%; }
.punto-hero__logo img {
	display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; clip-path: circle(48.6%);
	box-shadow: 0 0 0 6px rgba(242, 179, 61, .55), 0 0 0 16px rgba(31, 179, 194, .14), 0 40px 80px -30px rgba(0, 0, 0, .7);
	background: #fff;
}
@media (max-width: 781px) {
	.punto-hero__cols { flex-direction: column-reverse; }
	.punto-hero__logo { max-width: 230px; }
	.punto-hero { text-align: left; }
}

/* Info strip pulls up into the wave */
.punto-strip.alignwide { margin-top: clamp(-4.5rem, -6vw, -3rem) !important; margin-bottom: 0; }

/* Signature dishes */
.punto-signature { background: var(--wp--preset--color--cream); }
.punto-cards--dishes .punto-card__title { font-family: var(--wp--preset--font-family--display); font-weight: 400; font-size: 1.45rem; }
.punto-signature .punto-card { border: 0; box-shadow: 0 1px 0 rgba(10, 34, 64, .08), 0 20px 40px -32px rgba(10, 34, 64, .55); }
.punto-specials { padding: var(--wp--preset--spacing--50) var(--punto-gutter); background: var(--wp--preset--color--sand); border-radius: 24px; margin-bottom: var(--wp--preset--spacing--50) !important; }

/* Story */
.punto-story { background: var(--wp--preset--color--sand); position: relative; }
.punto-story__cols { align-items: center !important; }
.punto-facts { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.punto-facts li { display: flex; align-items: baseline; gap: 1rem; padding: 1rem 1.25rem; background: #fff; border-radius: 14px; border-left: 5px solid var(--wp--preset--color--gold); }
.punto-facts strong { font-family: var(--wp--preset--font-family--display); font-weight: 400; font-size: 2.1rem; color: var(--wp--preset--color--navy); min-width: 3.6em; line-height: 1; }

/* Navy band */
.punto-band--navy { background: var(--wp--preset--color--navy); color: #fff; text-align: center; padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); position: relative; }
.punto-band--navy .punto-section-title { color: #fff; }
.punto-band--navy p { color: #dbe7f5; max-width: 40em; margin-inline: auto; }
.punto-band--navy .punto-btn--outline { color: #fff; }
.punto-findus .punto-section-title { max-width: var(--punto-wide); margin-inline: auto; }
.punto-contact-cols { gap: clamp(1.5rem, 4vw, 3.5rem) !important; }

/* Gallery strip */
.punto-gallery--strip { grid-template-columns: repeat(3, 1fr); }
@media (min-width: 900px) { .punto-gallery--strip { grid-template-columns: repeat(6, 1fr); } }

/* -------- Inner page hero -------- */
.punto-page-hero {
	position: relative; background: linear-gradient(160deg, var(--wp--preset--color--navy) 0%, var(--wp--preset--color--navy-2) 100%);
	color: #fff; padding-top: clamp(2.5rem, 6vw, 4.5rem) !important; padding-bottom: clamp(4rem, 8vw, 6rem) !important; overflow: hidden;
}
.punto-page-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 40px; background: var(--punto-wave) repeat-x 0 0 / 720px 100%; }
.punto-page-hero .punto-eyebrow { color: var(--wp--preset--color--gold); }
.punto-page-hero__title { color: #fff; margin: 0 0 .75rem; }
.punto-page-hero__lead { color: #dbe7f5; font-size: 1.15rem; margin-bottom: 0; }
.punto-page-hero > * { position: relative; z-index: 1; }
.punto-page-hero.is-layout-constrained > * { max-width: var(--punto-wide); }
.punto-page-hero.is-layout-constrained > .punto-page-hero__lead { max-width: 46rem; margin-left: max(0px, calc((100% - var(--punto-wide)) / 2)) !important; margin-right: auto !important; }

/* Reservations page */
.punto-reserve-cols { gap: clamp(1.5rem, 4vw, 3.5rem) !important; align-items: flex-start !important; }
.punto-aside-title { font-size: 1.6rem; }
.punto-steps { padding-left: 0; list-style: none; counter-reset: punto-step; display: grid; gap: .85rem; }
.punto-steps li { counter-increment: punto-step; position: relative; padding-left: 3rem; }
.punto-steps li::before {
	content: counter(punto-step); position: absolute; left: 0; top: -.1rem; width: 2.1rem; height: 2.1rem; border-radius: 50%;
	display: grid; place-items: center; background: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); font-weight: 800;
}
.punto-reserve-cols .punto-hours { margin-top: 2rem; }

/* About */
.punto-timeline { list-style: none; padding: 0; margin: 1.5rem 0 0; border-left: 3px solid var(--wp--preset--color--turquoise); }
.punto-timeline li { position: relative; padding: 0 0 1.1rem 1.5rem; }
.punto-timeline li::before { content: ""; position: absolute; left: -9px; top: .45rem; width: 15px; height: 15px; border-radius: 50%; background: var(--wp--preset--color--gold); border: 3px solid var(--wp--preset--color--sand); }
.punto-timeline li:last-child { padding-bottom: 0; }
.punto-timeline li:last-child::before { background: var(--wp--preset--color--navy); }
.punto-checklist { list-style: none; padding: 0; display: grid; gap: .6rem; }
.punto-checklist li { padding-left: 2rem; position: relative; }
.punto-checklist li::before { content: ""; position: absolute; left: 0; top: .35rem; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: var(--wp--preset--color--turquoise); box-shadow: inset 0 0 0 4px #fff, 0 0 0 2px var(--wp--preset--color--turquoise); }
.punto-rounded img { border-radius: 20px; }
.punto-about__logo img { border-radius: 50%; clip-path: circle(48.6%); width: 100%; max-width: min(380px, 100%); margin-inline: auto; display: block; }

/* Prose (privacy) */
.punto-prose h2 { font-size: 1.6rem; margin-top: 2rem; }

/* Menu wrapper */
.punto-menu-wrap { padding-top: var(--wp--preset--spacing--40); }

/* -------- Footer -------- */
.punto-footer-wrap { background: var(--wp--preset--color--navy); color: #dbe7f5; padding-top: var(--wp--preset--spacing--60); padding-bottom: 2rem; position: relative; }
.punto-footer-wrap::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 36px; background: var(--punto-wave) repeat-x 0 0 / 720px 100%; transform: scaleY(-1); }
.punto-footer-wrap .punto-lang { color: #fff; margin-top: .5rem; display: inline-block; }

/* Standard pages (non-Punto) */
.punto-standard-title { margin-bottom: 1.5rem; }
.punto-404 { text-align: left; }

@media print {
	.punto-site-header, .punto-footer-wrap, .punto-menu__tools, .punto-menu__cats { display: none !important; }
	.punto-hero, .punto-page-hero { background: none !important; color: #000; }
}
