/* ==========================================================================
   Yacht Mooring Services – homepage
   Όλα τα classes έχουν prefix .yms- ώστε να μη συγκρούονται με το θέμα.
   Χρώματα: άλλαξε τα variables παρακάτω αν το brand έχει συγκεκριμένες τιμές.
   ========================================================================== */

.yms-home {
	--yms-navy: #0c0c0c;
	--yms-deep: #071823;
	--yms-foam: #eef2f1;
	--yms-red: #8fa5b0;
	--yms-steel: #8fa5b0;
	--yms-ease: cubic-bezier(.22, 1, .36, 1);

	background: var(--yms-foam);
	color: var(--yms-navy);
	overflow-x: clip;
}
section.yms-services a{
    color:#8fa5b0;
}
.yms-home *,
.yms-home *::before,
.yms-home *::after { box-sizing: border-box; }

.yms-wrap {
	width: min(1320px, calc(100% - 3rem));
	margin-inline: auto;
}

/* ---------- Masked lines (text reveal) ---------- */
.yms-line {
	display: block;
	overflow: hidden;
	padding-bottom: .1em;
	margin-bottom: -.1em;
}
.yms-line-in {
	display: block;
	will-change: transform;
}

/* Κρυφή αρχική κατάσταση — ενεργή μόνο όταν υπάρχει JS (class .yms-js στο <html>) */
.yms-js .yms-line-in,
.yms-js .yms-hero__tags li,
.yms-js .yms-row__title,
.yms-js .yms-row__text { visibility: hidden; }
.yms-js .yms-hero__media { clip-path: inset(9% 9% 9% 9% round 28px); }
.yms-js .yms-about__figure { clip-path: inset(100% 0 0 0); }
.yms-js .yms-row__line { transform: scaleX(0); }

/* ---------- Hero ---------- */
.yms-hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 100vh;
	min-height: 100svh;
	background: linear-gradient(90deg, #040d4f 0, #1021c2 49%, #3f84e2);
	color: #fff;
	overflow: hidden;
}
.yms-hero__media {
	position: absolute;
	inset: 0;
	overflow: hidden;
}
.yms-hero__parallax,
.yms-hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}
.yms-hero__video { object-fit: cover; }
.yms-hero__scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(7, 24, 35, .88), rgba(7, 24, 35, .15) 55%, rgba(7, 24, 35, .5));
}
.yms-hero__content {
	position: relative;
	z-index: 2;
	width: min(1320px, calc(100% - 3rem));
	margin: 0 auto;
	padding: 8rem 0 clamp(2.5rem, 7vh, 5rem);
}
.yms-hero__title {
	margin: 0 0 clamp(1.25rem, 3vh, 2rem);
	font-size: clamp(3rem, 10vw, 10rem);
	line-height: .92;
	font-weight: 700;
	letter-spacing: -.03em;
	text-transform: uppercase;
	color: #fff;
}
.yms-hero__tags {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem 2rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: clamp(.8rem, 1.1vw, 1rem);
	font-weight: 600;
	letter-spacing: .06em;
}
.yms-hero__tags li {
	display: flex;
	align-items: center;
	gap: .6rem;
}
.yms-hero__tags li::before {
	content: "";
	width: .45rem;
	height: .45rem;
	background: var(--yms-red);
}

/* ---------- Marquee ---------- */
.yms-marquee {
	display: grid;
	gap: .25rem;
	padding: clamp(1.25rem, 3vw, 2.5rem) 0;
	background: var(--yms-navy);
	overflow: hidden;
}
.yms-marquee__track {
	display: flex;
	width: max-content;
	will-change: transform;
}
.yms-marquee__track span {
	display: flex;
	flex: none;
	align-items: center;
	padding-right: .6em;
	font-size: clamp(2.5rem, 7vw, 6.5rem);
	font-weight: 700;
	line-height: 1.1;
	text-transform: uppercase;
	white-space: nowrap;
	color: transparent;
	-webkit-text-stroke: 1px rgba(238, 242, 241, .55);
}
.yms-marquee__track span::after {
	content: "";
	width: .2em;
	height: .2em;
	margin-left: .6em;
	background: var(--yms-red);
}
.yms-marquee__track--solid span {
	color: var(--yms-foam);
	-webkit-text-stroke: 0;
}

/* ---------- About ---------- */
.yms-about { padding: clamp(5rem, 12vw, 10rem) 0; }
.yms-about__grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	column-gap: 1.5rem;
}
.yms-about__label {
	grid-column: 1 / 4;
	grid-row: 1;
	padding-top: .6rem;
}
.yms-about__label h3 {
	margin: 0 0 .35rem;
	font-size: 1.1rem;
	font-weight: 700;
}
.yms-about__label p {
	margin: 0;
	font-size: .95rem;
	color: var(--yms-steel);
}
.yms-about__lead {
	grid-column: 4 / -1;
	grid-row: 1;
	margin: 0;
	font-size: clamp(1.7rem, 3.4vw, 3.4rem);
	line-height: 1.15;
	font-weight: 600;
	letter-spacing: -.015em;
}
.yms-word { display: inline-block; }

.yms-about__figure {
	grid-column: 1 / -1;
	margin: clamp(3rem, 7vw, 6rem) 0 0;
	aspect-ratio: 21 / 9;
	overflow: hidden;
}
.yms-about__figure img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	will-change: transform;
}
.yms-about__p {
	margin: clamp(2rem, 4vw, 3.5rem) 0 0;
	font-size: clamp(1rem, 1.15vw, 1.15rem);
	line-height: 1.7;
	max-width: 36rem;
}
.yms-about__p--1 { grid-column: 4 / 8; }
.yms-about__p--2 { grid-column: 9 / -1; margin-top: clamp(4rem, 8vw, 7rem); }

/* ---------- Services ---------- */
.yms-services {
	padding: clamp(5rem, 12vw, 10rem) 0;
	background: var(--yms-navy);
	color: var(--yms-foam);
}
.yms-services__title {
	margin: 0 0 clamp(2.5rem, 6vw, 5rem);
	font-size: clamp(2rem, 4vw, 3.5rem);
	font-weight: 600;
	letter-spacing: -.02em;
}
.yms-rows { margin: 0; padding: 0; list-style: none; }
.yms-row {
	position: relative;
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	column-gap: 1.5rem;
	align-items: start;
	padding: clamp(2rem, 4vw, 3.5rem) 0;
}
.yms-row__line {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: rgba(238, 242, 241, .3);
	transform-origin: left center;
}
.yms-row:last-child::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: rgba(238, 242, 241, .3);
}
.yms-row__title {
	grid-column: 1 / 7;
	display: flex;
	align-items: center;
	gap: .35em;
	margin: 0;
	font-size: clamp(2rem, 5vw, 4.5rem);
	line-height: 1;
	font-weight: 700;
	letter-spacing: -.02em;
	transition: transform .7s var(--yms-ease);
}
.yms-row__tick {
	display: inline-grid;
	place-items: center;
	width: .42em;
	height: .42em;
	color: var(--yms-red);
	transition: transform .7s var(--yms-ease);
}
.yms-row__tick svg { width: 100%; height: 100%; fill: currentColor; }
.yms-row__text {
	grid-column: 8 / -1;
	margin: .4rem 0 0;
	font-size: clamp(1rem, 1.15vw, 1.15rem);
	line-height: 1.7;
	color: rgba(238, 242, 241, .82);
	max-width: 34rem;
}
@media (hover: hover) {
	.yms-row:hover .yms-row__title { transform: translateX(1rem); }
	.yms-row:hover .yms-row__tick { transform: rotate(-12deg) scale(1.2); }
}

.yms-link {
	display: inline-block;
	margin-top: clamp(2.5rem, 5vw, 4rem);
	padding-bottom: .35rem;
	border-bottom: 1px solid currentColor;
	color: inherit;
	font-weight: 600;
	text-decoration: none;
	transition: color .3s, border-color .3s;
}
.yms-link:hover,
.yms-link:focus-visible { color: #fff; border-color: var(--yms-red); }

/* ---------- Contact ---------- */
.yms-contact { padding: clamp(5rem, 12vw, 10rem) 0; }
.yms-contact__grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	column-gap: 1.5rem;
	row-gap: 2.5rem;
}
.yms-contact__title {
	grid-column: 1 / -1;
	margin: 0;
	font-size: clamp(3rem, 9vw, 8.5rem);
	line-height: .95;
	font-weight: 700;
	letter-spacing: -.03em;
}
.yms-contact__text {
	grid-column: 1 / 7;
	margin: 0;
	max-width: 34rem;
	font-size: clamp(1rem, 1.15vw, 1.15rem);
	line-height: 1.7;
}
.yms-contact__links {
	grid-column: 7 / -1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: .6rem;
}
.yms-big {
	color: inherit;
	font-size: clamp(1.5rem, 3vw, 2.8rem);
	font-weight: 600;
	letter-spacing: -.01em;
	text-decoration: none;
	border-bottom: 2px solid transparent;
	transition: border-color .3s;
}
.yms-big:hover,
.yms-big:focus-visible { border-color: var(--yms-red); }

/* ---------- Mobile ---------- */
@media (max-width: 899px) {
	.yms-about__label,
	.yms-about__lead,
	.yms-about__p--1,
	.yms-about__p--2,
	.yms-row__title,
	.yms-row__text,
	.yms-contact__text,
	.yms-contact__links { grid-column: 1 / -1; grid-row: auto; }

	.yms-about__label { margin-bottom: 1.5rem; }
	.yms-about__figure { aspect-ratio: 4 / 3; }
	.yms-about__p--2 { margin-top: 1.5rem; }
	.yms-row__text { margin-top: 1rem; }
	.yms-hero__tags { gap: .5rem 1.25rem; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	.yms-row__title,
	.yms-row__tick { transition: none; }
}
/* ==========================================================================
   Εσωτερικές σελίδες (Services κ.ά.)
   ========================================================================== */
.yms-pagehead {
	padding: clamp(8rem, 18vw, 13rem) 0 clamp(2.5rem, 6vw, 5rem);
	background: var(--yms-navy);
	color: var(--yms-foam);
}
.yms-pagehead__title {
	margin: 0;
	font-size: clamp(3rem, 9vw, 8.5rem);
	line-height: .95;
	font-weight: 700;
	letter-spacing: -.03em;
	text-transform: uppercase;
	color: var(--yms-foam);
}
/* Το services section συνεχίζει κατευθείαν κάτω από το header της σελίδας */
.yms-services--flow { padding-top: 0; }
.yms-services--flow .yms-rows { margin-top: 0; }

/* ==========================================================================
   Contact page
   ========================================================================== */
.yms-contactpage { padding: clamp(4rem, 9vw, 8rem) 0; }
.yms-contactpage__grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	column-gap: 1.5rem;
	row-gap: 3.5rem;
	align-items: start;
}

/* Στοιχεία επικοινωνίας */
.yms-info {
	grid-column: 1 / 5;
	margin: 0;
}
.yms-info__item {
	padding: 1.25rem 0 1.5rem;
	border-top: 1px solid rgba(11, 34, 48, .25);
}
.yms-info__item:last-child { border-bottom: 1px solid rgba(11, 34, 48, .25); }
.yms-info dt {
	margin: 0 0 .4rem;
	font-size: .95rem;
	font-weight: 600;
	color: var(--yms-steel);
}
.yms-info dd {
	margin: 0;
	font-size: clamp(1.15rem, 1.6vw, 1.5rem);
	line-height: 1.4;
	font-weight: 600;
}
.yms-info a {
	color: inherit;
	text-decoration: none;
	border-bottom: 2px solid transparent;
	transition: border-color .3s;
}
.yms-info a:hover,
.yms-info a:focus-visible { border-color: var(--yms-red); }

/* Φόρμα (Contact Form 7 ή ό,τι βγαίνει από the_content) */
.yms-form { grid-column: 6 / -1; }
.yms-form p { margin: 0 0 1.75rem; }
.yms-form label {
	display: block;
	font-size: .95rem;
	font-weight: 600;
}
.yms-form input[type="text"],
.yms-form input[type="email"],
.yms-form input[type="tel"],
.yms-form input[type="url"],
.yms-form input[type="number"],
.yms-form select,
.yms-form textarea {
	display: block;
	width: 100%;
	margin-top: .5rem;
	padding: .7rem 0;
	font: inherit;
	font-size: 1.1rem;
	font-weight: 400;
	color: var(--yms-navy);
	background: transparent;
	border: 0;
	border-bottom: 1px solid rgba(11, 34, 48, .4);
	border-radius: 0;
	outline: 0;
	box-shadow: none;
	transition: border-color .3s, box-shadow .3s;
}
.yms-form textarea { min-height: 9rem; resize: vertical; }
.yms-form input:focus,
.yms-form select:focus,
.yms-form textarea:focus {
	border-bottom-color: var(--yms-red);
	box-shadow: 0 1px 0 0 var(--yms-red);
}
.yms-form input[type="submit"],
.yms-form button[type="submit"] {
	display: inline-block;
	padding: 1rem 2.5rem;
	font: inherit;
	font-weight: 700;
	color: #fff;
	background: var(--yms-red);
	border: 0;
	border-radius: 0;
	cursor: pointer;
	transition: background .3s, transform .3s var(--yms-ease);
}
.yms-form input[type="submit"]:hover,
.yms-form button[type="submit"]:hover { background: var(--yms-navy); }
.yms-form input[type="submit"]:focus-visible,
.yms-form button[type="submit"]:focus-visible { outline: 2px solid var(--yms-navy); outline-offset: 3px; }
.yms-form .wpcf7-not-valid-tip { margin-top: .4rem; font-size: .9rem; color: var(--yms-red); }
.yms-form .wpcf7-not-valid { border-bottom-color: var(--yms-red); }
.yms-form .wpcf7-response-output {
	margin: 1.5rem 0 0;
	padding: 1rem 1.25rem;
	border: 1px solid var(--yms-navy);
}
.yms-form .wpcf7-spinner { margin-left: 1rem; }
.yms-form .wpcf7-acceptance label { font-weight: 400; }

/* Χάρτης */
.yms-map { background: var(--yms-navy); line-height: 0; }
.yms-map iframe {
	display: block;
	width: 100%;
	height: clamp(320px, 45vw, 520px);
	border: 0;
	filter: grayscale(1) contrast(1.05);
	transition: filter .5s;
}
.yms-map:hover iframe,
.yms-map iframe:focus { filter: none; }

@media (max-width: 899px) {
	.yms-info,
	.yms-form { grid-column: 1 / -1; }
}