/* Akinitis inner pages - native Elementor layout
   Scoped by class, not page id, so every converted page picks it up. */

.ak-native-subhero > .elementor-container{min-height:clamp(320px,42vh,460px);align-items:center}
.ak-native-subhero-column{padding:clamp(56px,7vw,96px) clamp(20px,5vw,80px)}
/* Hero photographs and video: the same wash the home page uses, so every
   hero reads at one weight across the site. */
.ak-native-subhero{
  position:relative;
  isolation:isolate;
}
.ak-native-subhero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(24,28,27,.105);
  pointer-events:none;
}
.ak-native-video-subhero:after{
  background:rgba(24,28,27,.21);
}

.ak-native-subhero .ak-native-hero-title .elementor-heading-title{
  color:#fff!important;font-family:"Open Sans",Arial,sans-serif;font-weight:300;
  font-size:clamp(34px,4vw,58px);letter-spacing:.06em;line-height:1.12;
  text-shadow:0 2px 18px rgba(12,16,15,.45)}
.ak-native-subhero .ak-native-hero-lead{max-width:640px;margin-top:18px}
.ak-native-subhero .ak-native-hero-lead p{
  color:#eef2f0!important;font-size:clamp(14px,1.2vw,17px);line-height:1.75;
  letter-spacing:.04em;text-shadow:0 1px 10px rgba(12,16,15,.4)}
.ak-native-subhero .ak-native-hero-button{margin-top:28px}

/* alternating feature rows */
.ak-native-feature > .elementor-container{align-items:stretch;min-height:clamp(340px,38vw,520px)}
.ak-native-feature-copy{
  display:flex;flex-direction:column;justify-content:center;
  padding:clamp(40px,4.5vw,76px) clamp(24px,4vw,68px);background:var(--ak-native-cream,#f6f3ed)}
.ak-native-feature-media{padding:0;position:relative;overflow:hidden}
.ak-native-feature-media .elementor-widget-wrap{padding:0}
.ak-native-feature-image,
.ak-native-feature-image .elementor-widget-container,
.ak-native-feature-image figure,
.ak-native-feature-image .elementor-image{height:100%;margin:0}
.ak-native-feature-image img{
  width:100%;height:100%;min-height:clamp(280px,34vw,520px);
  object-fit:cover;display:block}

.ak-native-eyebrow p{
  margin:0 0 14px;color:var(--ak-native-moss,#71806f)!important;
  font-size:12px;font-weight:600;letter-spacing:.34em}
.ak-native-feature .ak-native-section-title .elementor-heading-title{
  color:var(--ak-native-ink,#222725)!important;font-weight:300;
  font-size:clamp(24px,2.3vw,34px);letter-spacing:.1em;line-height:1.2;margin-bottom:16px}
.ak-native-body p{
  color:var(--ak-native-moss,#71806f)!important;
  font-size:clamp(14px,1.05vw,16px);line-height:1.85;letter-spacing:.02em;max-width:56ch}
.ak-native-text-button{margin-top:22px}
.ak-native-text-button .elementor-button{
  background:transparent!important;color:var(--ak-native-pine,#33473f)!important;
  padding:0!important;border:0;border-bottom:1px solid rgba(51,71,63,.35);border-radius:0;
  font-size:12px;letter-spacing:.22em;font-weight:600}
.ak-native-text-button .elementor-button:hover{border-bottom-color:var(--ak-native-pine,#33473f)}

/* wide CTA strip */
.ak-native-cta{background:var(--ak-native-pine,#33473f)}
.ak-native-cta > .elementor-container{align-items:center}
.ak-native-cta-copy{padding:clamp(38px,4vw,62px) clamp(24px,4vw,68px)}
.ak-native-cta-action{padding:clamp(0px,2vw,20px) clamp(24px,4vw,68px) clamp(38px,4vw,62px);display:flex;justify-content:flex-end}
.ak-native-cta .ak-native-cta-title .elementor-heading-title{
  color:#fff!important;font-weight:300;font-size:clamp(20px,2vw,28px);letter-spacing:.14em;margin:0}
.ak-native-cta-action .elementor-button{white-space:nowrap}

@media(max-width:1024px){
  .ak-native-feature > .elementor-container{flex-direction:column}
  .ak-native-feature .elementor-column{width:100%!important}
  .ak-native-feature-reverse > .elementor-container{flex-direction:column-reverse}
  .ak-native-cta > .elementor-container{flex-direction:column;align-items:flex-start}
  .ak-native-cta-action{justify-content:flex-start;padding-top:0}
}
@media(max-width:767px){
  .ak-native-subhero .ak-native-hero-title .elementor-heading-title{font-size:clamp(26px,7vw,34px)}
  .ak-native-feature-image img{min-height:240px}
}

/* narrow editorial block */
.ak-native-narrow{background:#fff}
.ak-native-narrow-column{
  max-width:860px;margin:0 auto;
  padding:clamp(56px,6vw,96px) clamp(24px,5vw,40px)}
.ak-native-narrow .ak-native-section-title .elementor-heading-title{
  color:var(--ak-native-ink,#222725)!important;font-weight:300;
  font-size:clamp(22px,2.1vw,30px);letter-spacing:.1em;line-height:1.25;
  margin:34px 0 14px}
.ak-native-narrow .elementor-widget:first-child .elementor-heading-title{margin-top:0}
.ak-native-checklist ul{list-style:none;margin:22px 0 0;padding:0}
.ak-native-checklist li{
  position:relative;padding:0 0 0 30px;margin-bottom:14px;
  color:var(--ak-native-moss,#71806f);font-size:clamp(14px,1.05vw,16px);line-height:1.7}
.ak-native-checklist li:before{
  content:"";position:absolute;left:0;top:9px;width:14px;height:7px;
  border-left:1.5px solid var(--ak-native-pine,#33473f);
  border-bottom:1.5px solid var(--ak-native-pine,#33473f);
  transform:rotate(-45deg)}

/* gallery carousel: large photos, visible arrows, swipe on touch */
.ak-native-gallery-section{background:var(--ak-native-cream,#f6f3ed)}
.ak-native-gallery-column{padding:clamp(40px,5vw,80px) clamp(16px,4vw,64px)}
.ak-native-gallery .elementor-image-carousel-wrapper{max-width:1180px;margin:0 auto}
.ak-native-gallery .swiper-slide img{
  width:100%;height:min(72vh,640px);object-fit:cover;display:block}
.ak-native-gallery .elementor-swiper-button{
  color:#fff;background:rgba(29,37,34,.55);width:46px;height:46px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  transition:background .2s}
.ak-native-gallery .elementor-swiper-button:hover{background:rgba(29,37,34,.85)}
.ak-native-gallery .swiper-pagination-bullet{background:#fff;opacity:.55}
.ak-native-gallery .swiper-pagination-bullet-active{opacity:1}
@media(max-width:767px){
  .ak-native-gallery .swiper-slide img{height:52vh}
  .ak-native-gallery .elementor-swiper-button{width:38px;height:38px}
}

/* event cards */
.ak-native-card-row{background:var(--ak-native-cream,#f6f3ed)}
.ak-native-card-row > .elementor-container{
  /* No max-width: the row spans the same measure as the copy above it, which
     is what the client asked for. Capping it left dead space either side. */
  margin:0 auto;gap:26px;
  padding:clamp(18px,2vw,30px) clamp(20px,4vw,50px)}
.ak-native-card{background:#fff;display:flex;flex-direction:column}
.ak-native-card > .elementor-widget-wrap{padding:0}
.ak-native-card-image img{width:100%;height:230px;object-fit:cover;display:block}
.ak-native-card .ak-native-card-title{padding:22px 24px 0}
.ak-native-card .ak-native-card-title .elementor-heading-title{
  color:var(--ak-native-ink,#222725)!important;font-weight:400;
  font-size:16px;letter-spacing:.16em;line-height:1.35;margin:0}
.ak-native-card-text{padding:12px 24px 0;flex:1}
.ak-native-card-text p{
  color:var(--ak-native-moss,#71806f)!important;font-size:14px;line-height:1.75;margin:0}
.ak-native-card .ak-native-text-button{padding:16px 24px 26px;margin-top:auto}


/* Landing template order — Hero > About > Facilities > Widget > FAQ > CTA.
   The alternation is restored by swapping the two tones where the tile row
   precedes the carousel; pages without a tile row are untouched. */
body:has(.ak-native-tile-row) .ak-native-tile-row{
  background:var(--ak-native-cream,#f6f3ed);
}
body:has(.ak-native-tile-row) .ak-native-gallery-section{
  background:#fff;
}

/* small linked tiles */
.ak-native-tile-row{background:#fff}
.ak-native-tile-row > .elementor-container{
  max-width:1240px;margin:0 auto;gap:18px;
  padding:clamp(30px,4vw,60px) clamp(20px,4vw,50px)}
.ak-native-tile > .elementor-widget-wrap{padding:0}
.ak-native-tile-image img{width:100%;height:150px;object-fit:cover;display:block}
.ak-native-tile-title{padding:12px 0 0;text-align:center}
.ak-native-tile-title .elementor-heading-title{
  color:var(--ak-native-pine,#33473f)!important;font-weight:600;
  font-size:11px;letter-spacing:.2em;margin:0}
.ak-native-tile-title a{color:inherit!important}

/* FAQ accordion */
.ak-native-faq-section{background:var(--ak-native-cream,#f6f3ed)}
.ak-native-faq-column{max-width:900px;margin:0 auto;padding:clamp(46px,5vw,80px) clamp(24px,4vw,40px)}
.ak-native-faq .elementor-accordion-item{
  border:0;border-bottom:1px solid rgba(34,39,37,.14);background:transparent}
.ak-native-faq .elementor-tab-title{
  background:transparent!important;padding:20px 0;
  font-size:clamp(14px,1.15vw,16px);letter-spacing:.04em}
.ak-native-faq .elementor-tab-title a{color:var(--ak-native-ink,#222725)!important;font-weight:400}
.ak-native-faq .elementor-tab-content{
  background:transparent!important;border:0;padding:0 0 22px}
.ak-native-faq .elementor-tab-content p{
  color:var(--ak-native-moss,#71806f)!important;font-size:14px;line-height:1.8;margin:0}

@media(max-width:1024px){
  .ak-native-card-row > .elementor-container,
  .ak-native-tile-row > .elementor-container{flex-wrap:wrap}
  .ak-native-card{width:calc(50% - 13px)!important}
  .ak-native-tile{width:calc(33.333% - 12px)!important}
}
@media(max-width:767px){
  .ak-native-card{width:100%!important}
  .ak-native-tile{width:calc(50% - 9px)!important}
  .ak-native-card-image img{height:200px}
}

/* card width lock: keep a short last row aligned with the full rows above */
.ak-native-card-row > .elementor-container{justify-content:flex-start}
.ak-native-card{width:calc((100% - 52px) / 3)!important;flex:0 0 auto}
@media(max-width:1024px){.ak-native-card{width:calc((100% - 26px) / 2)!important}}
@media(max-width:767px){.ak-native-card{width:100%!important}}

/* proposal form: two columns on desktop, one on mobile */
.ak-native-form{margin-top:34px}
.ak-native-form .ak-form-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:20px 24px}
.ak-native-form .ak-form-grid > label,
.ak-native-form .ak-form-grid > .ak-form-wide{
  display:flex;flex-direction:column;
  font-size:12px;letter-spacing:.16em;font-weight:600;
  color:var(--ak-native-pine,#33473f);text-transform:uppercase}
.ak-native-form .ak-form-wide{grid-column:1 / -1}
.ak-native-form input[type=text],
.ak-native-form input[type=email],
.ak-native-form input[type=tel],
.ak-native-form input[type=number],
.ak-native-form textarea{
  width:100%;margin-top:9px;padding:14px 16px;
  border:1px solid rgba(34,39,37,.22);border-radius:0;background:#fff;
  font-family:"Open Sans",Arial,sans-serif;font-size:15px;font-weight:400;
  letter-spacing:normal;text-transform:none;color:var(--ak-native-ink,#222725)}
.ak-native-form textarea{min-height:190px;resize:vertical}
.ak-native-form input:focus,
.ak-native-form textarea:focus{
  outline:none;border-color:var(--ak-native-pine,#33473f)}
.ak-native-form input[type=submit]{
  margin-top:6px;padding:16px 44px;border:0;border-radius:0;cursor:pointer;
  background:var(--ak-native-pine,#33473f);color:#fff;
  font-size:12px;font-weight:600;letter-spacing:.22em;
  transition:background .2s}
.ak-native-form input[type=submit]:hover{background:#25342e}
.ak-native-form .wpcf7-not-valid-tip{
  color:#b3261e;font-size:12px;letter-spacing:normal;text-transform:none;margin-top:6px}
.ak-native-form .wpcf7-response-output{
  grid-column:1 / -1;margin:18px 0 0;padding:14px 18px;
  border:1px solid rgba(34,39,37,.22);font-size:14px;letter-spacing:normal;text-transform:none}
@media(max-width:767px){
  .ak-native-form .ak-form-grid{grid-template-columns:1fr}
}

/* form page width: the narrow reading column is too tight for a 2-col form */
.ak-native-narrow-column:has(.ak-native-form){max-width:980px}
.ak-native-form .ak-form-grid{max-width:100%}
.ak-native-form .wpcf7{width:100%}

/* CF7 wraps fields in <p> — make that paragraph the actual grid */
.ak-native-form .ak-form-grid{display:block}
.ak-native-form .ak-form-grid > p{
  display:grid;grid-template-columns:1fr 1fr;gap:20px 24px;margin:0}
.ak-native-form .ak-form-grid > p > label{display:flex;flex-direction:column}
.ak-native-form .ak-form-grid > p > label.ak-form-wide,
.ak-native-form .ak-form-grid > p > .ak-form-wide{grid-column:1 / -1}
.ak-native-form .ak-form-grid > .ak-form-wide{margin-top:22px}
@media(max-width:767px){
  .ak-native-form .ak-form-grid > p{grid-template-columns:1fr}
}

/* Insights blog: posts grid + topics sidebar */
.ak-native-blog{background:#fff}
.ak-native-blog > .elementor-container{
  max-width:1400px;margin:0 auto;align-items:flex-start;gap:48px;
  padding:clamp(48px,5vw,84px) clamp(20px,4vw,50px)}
.ak-native-posts .elementor-post{background:#fff}
.ak-native-posts .elementor-post__thumbnail{padding-bottom:64%}
.ak-native-posts .elementor-post__text{padding:22px 24px 26px}
.ak-native-posts .elementor-post__title{margin:0 0 10px}
.ak-native-posts .elementor-post__title a{
  color:#2c3e50!important;font-weight:300;
  font-size:25px;letter-spacing:1.125px;line-height:1.35;text-transform:uppercase}
.ak-native-posts .elementor-post__excerpt p{
  color:var(--ak-native-moss,#71806f)!important;font-size:14px;line-height:1.75}
.ak-native-posts .elementor-post__meta-data{
  font-size:11px;letter-spacing:.14em;color:var(--ak-native-moss,#71806f);
  text-transform:uppercase;margin-bottom:12px}
.ak-native-posts .elementor-post__read-more{
  color:var(--ak-native-pine,#33473f)!important;font-size:12px;
  font-weight:600;letter-spacing:.2em;
  border-bottom:1px solid rgba(51,71,63,.35);padding-bottom:2px}

.ak-native-sidebar-title .elementor-heading-title{
  color:var(--ak-native-ink,#222725)!important;font-weight:400;
  font-size:12px;letter-spacing:.28em;margin:0 0 18px;
  padding-bottom:14px;border-bottom:1px solid rgba(34,39,37,.16)}
.ak-topics-list{list-style:none;margin:0;padding:0}
.ak-topics-list li{border-bottom:1px solid rgba(34,39,37,.09)}
.ak-topics-list a{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:13px 0;color:var(--ak-native-moss,#71806f)!important;
  font-size:14px;letter-spacing:.03em;transition:color .18s}
.ak-topics-list a:hover,
.ak-topics-list li.is-current a{color:var(--ak-native-pine,#33473f)!important}
.ak-topics-list span{
  font-size:11px;color:var(--ak-native-moss,#71806f);
  background:var(--ak-native-cream,#f6f3ed);padding:2px 9px;border-radius:11px}

@media(max-width:1024px){
  .ak-native-blog > .elementor-container{flex-direction:column;gap:34px}
  .ak-native-blog .elementor-column{width:100%!important}
  .ak-native-blog .ak-native-blog-side{order:-1}
  .ak-native-blog .ak-native-blog-main{order:0}
}


/* ---- footer privacy link ---------------------------------------------
   Elementor wraps every widget in its own full-width div, so the flex row
   has to be set on .elementor-widget-wrap — the actual parent of the two
   widgets. Copyright left, policy link right; stacked on phones. */
.ak-native-footer-bottom-column > .elementor-widget-wrap{
  flex-direction:row;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:8px 24px;
}
.ak-native-footer-bottom-column > .elementor-widget-wrap > .ak-native-footer-copyright,
.ak-native-footer-bottom-column > .elementor-widget-wrap > .ak-native-footer-privacy{
  width:auto;margin:0;
}
.ak-native-footer-privacy .ak-privacy-link{
  color:rgba(255,255,255,.62)!important;
  font-size:14px;letter-spacing:.04em;text-decoration:none;
  transition:color .2s ease;
}
.ak-native-footer-privacy .ak-privacy-link:hover,
.ak-native-footer-privacy .ak-privacy-link:focus{
  color:#fff!important;text-decoration:underline;
}
@media(max-width:767px){
  .ak-native-footer-bottom-column > .elementor-widget-wrap{
    flex-direction:column;align-items:flex-start;
  }
}

/* ==========================================================================
   Global header (194) and footer (200) — Theme Builder templates.
   Values below reproduce the previous hard-coded shell exactly: pine hover,
   cream dropdown, 235px minimum, the same shadow and timing.
   ========================================================================== */

:root{
  --ak-pine:#33473f;
  --ak-ink:#222725;
  --ak-cream:#f6f3ed;
}

/* --- Footer: keep the email level with the logo, icons on the text baseline --- */

/* The contact block sits at the top of its column, matching the logo opposite.
   Only the icons are pushed down, so the column stays anchored where it was. */
.ak-native-footer-links > .elementor-widget-wrap{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.ak-native-footer-contact{
  margin-bottom:0!important;
}
/* Address follows the email directly — the default paragraph gap was too wide. */
.ak-native-footer-contact p{
  /* The theme pads every paragraph by 16px top and bottom, which opened a gap
     between the email and the address that read as a mistake. */
  margin:0 0 6px;
  padding:0;
  line-height:1.6;
}
.ak-native-footer-contact p:last-child{
  margin-bottom:0;
}
/* auto pushes the row to the bottom of the column, so its baseline meets the
   last line of the description opposite regardless of how long that text is. */
.ak-native-footer-social{
  margin-top:auto!important;
  width:100%;
}
@media(max-width:1024px){
  /* Stacked layout: nothing to align against, so restore a normal rhythm. */
  .ak-native-footer-social{
    margin-top:24px!important;
  }
}

/* --- Header: primary navigation --- */

.ak-native-primary-nav .elementor-nav-menu--main .elementor-item{
  position:relative;
  color:var(--ak-ink)!important;
  font-size:12px;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  padding:12px 0;
  transition:color .2s ease;
}
/* Underline grows from the left, the same motion as before. */
.ak-native-primary-nav .elementor-nav-menu--main > ul > li > .elementor-item::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:6px;
  height:1px;
  background:var(--ak-pine);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .2s ease;
}
.ak-native-primary-nav .elementor-nav-menu--main > ul > li > .elementor-item:hover,
.ak-native-primary-nav .elementor-nav-menu--main > ul > li > .elementor-item:focus-visible,
.ak-native-primary-nav .elementor-nav-menu--main > ul > li.ak-open > .elementor-item{
  color:var(--ak-pine)!important;
}
.ak-native-primary-nav .elementor-nav-menu--main > ul > li > .elementor-item:hover::after,
.ak-native-primary-nav .elementor-nav-menu--main > ul > li > .elementor-item:focus-visible::after,
.ak-native-primary-nav .elementor-nav-menu--main > ul > li.ak-open > .elementor-item::after{
  transform:scaleX(1);
}

/* Arrow: a solid caret, sized to sit level with the label. */
.ak-native-primary-nav .elementor-nav-menu--main .sub-arrow{
  display:inline-grid;
  place-items:center;
  width:30px;
  height:34px;
  margin:0;
  padding:0;
  cursor:pointer;
}
.ak-native-primary-nav .elementor-nav-menu--main .sub-arrow i{
  font-size:12px;
  line-height:1;
  color:var(--ak-ink);
  transition:transform .2s ease;
}
.ak-native-primary-nav .elementor-nav-menu--main li.ak-open > .elementor-item .sub-arrow i{
  transform:rotate(180deg);
}

/* Dropdown: click-only. SmartMenus opens on hover, so its inline display is
   overridden here and driven by the .ak-open class the script sets instead. */
.ak-native-primary-nav .elementor-nav-menu--main .elementor-nav-menu--dropdown{
  display:none!important;
  position:absolute;
  top:45px;
  left:-22px;
  z-index:20;
  min-width:235px;
  padding:10px;
  background:var(--ak-cream);
  border:1px solid rgba(34,39,37,.13);
  box-shadow:0 18px 35px rgba(20,25,23,.12);
  flex-direction:column;
  gap:2px;
}
.ak-native-primary-nav .elementor-nav-menu--main li.ak-open > .elementor-nav-menu--dropdown{
  display:flex!important;
}
.ak-native-primary-nav .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item{
  display:block;
  white-space:nowrap;
  padding:10px 12px;
  color:var(--ak-ink)!important;
  font-size:11px;
  letter-spacing:.08em;
  transition:color .18s ease,background-color .18s ease;
}
.ak-native-primary-nav .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item:hover,
.ak-native-primary-nav .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item:focus-visible{
  color:var(--ak-pine)!important;
  background:rgba(51,71,63,.08);
}

/* Dropdown, current page: the hover's pine, a few shades deeper, so the open
   page still reads as selected without the slate block Elementor ships. */
.ak-native-primary-nav .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item.elementor-item-active,
.ak-native-primary-nav .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item.elementor-item-active:hover,
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .elementor-sub-item.elementor-item-active{
  background:rgba(51,71,63,.22)!important;
  color:var(--ak-pine)!important;
}

/* --- Header: language switcher, matched to the navigation --- */

.ak-native-language{
  position:relative;
}
.ak-native-language > summary{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:12px 0;
  color:var(--ak-ink);
  font-size:12px;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  cursor:pointer;
  list-style:none;
  transition:color .2s ease;
}
.ak-native-language > summary::-webkit-details-marker{display:none}
.ak-native-language > summary::marker{content:""}
.ak-native-language > summary:hover,
.ak-native-language[open] > summary{
  color:var(--ak-pine);
}
.ak-native-language > summary i{
  /* A theme rule sizes this at 0.7em, rendering 8.4px against the menu's 12px.
     The caret has to match the one on the navigation exactly. */
  font-size:12px!important;
  line-height:1!important;
  color:var(--ak-ink);
  transition:transform .2s ease;
}
.ak-native-language[open] > summary i{
  transform:rotate(180deg);
}
.ak-native-language > div{
  display:flex;
  flex-direction:column;
  position:absolute;
  top:40px;
  right:0;
  z-index:20;
  min-width:76px;
  padding:8px;
  background:var(--ak-cream);
  border:1px solid rgba(34,39,37,.15);
  box-shadow:0 12px 28px rgba(22,35,31,.13);
}
.ak-native-language > div a{
  padding:9px 11px;
  color:var(--ak-ink)!important;
  font-size:12px;
  letter-spacing:.1em;
  text-decoration:none;
  transition:color .18s ease,background-color .18s ease;
}
.ak-native-language > div a:hover,
.ak-native-language > div a:focus-visible{
  color:var(--ak-pine)!important;
  background:rgba(51,71,63,.08);
}

/* --- Mobile: the dropdown becomes an inline block inside the burger panel --- */
@media(max-width:1024px){
  .ak-native-primary-nav .elementor-nav-menu--main .elementor-nav-menu--dropdown{
    position:static;
    min-width:0;
    border:0;
    box-shadow:none;
    background:transparent;
    padding:6px 0 8px 18px;
  }
}

/* --- Burger panel: the widget renders a second copy of the menu here --- */

.ak-native-primary-nav nav.elementor-nav-menu--dropdown{
  background:var(--ak-cream);
}
/* Elementor highlights the current page with a filled block. The previous
   header marked it with colour alone, so the block is removed. */
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .elementor-item,
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .elementor-item.elementor-item-active,
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .elementor-item:hover{
  background:transparent!important;
  color:var(--ak-ink)!important;
  font-size:12px;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .elementor-item.elementor-item-active,
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .elementor-item:hover{
  color:var(--ak-pine)!important;
}
/* Submenus inside the panel are click-driven too, indented rather than floated. */
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .sub-menu{
  /* Elementor floats the panel submenu absolutely, which laid it over the
     items below. Static flow lets the list push them down instead. */
  display:none!important;
  position:static!important;
  width:auto!important;
  padding:2px 0 8px 18px;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
}
.ak-native-primary-nav nav.elementor-nav-menu--dropdown li.ak-open > .sub-menu{
  display:block!important;
}
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .sub-arrow{
  display:inline-grid;
  place-items:center;
  width:34px;
  height:34px;
  cursor:pointer;
}
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .sub-arrow i{
  transition:transform .2s ease;
}
.ak-native-primary-nav nav.elementor-nav-menu--dropdown li.ak-open > a .sub-arrow i{
  transform:rotate(180deg);
}
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .elementor-sub-item{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:none;
  color:var(--ak-ink)!important;
}
.ak-native-primary-nav nav.elementor-nav-menu--dropdown .elementor-sub-item:hover{
  color:var(--ak-pine)!important;
}

/* --- Footer: optical alignment ---------------------------------------------
   Two corrections that the box model gets wrong to the eye:

   1. The logo is a 300x140 image forced into a 150x150 box with object-fit
      contain, so it renders 150x70 and is centred with 40px of empty space
      above it. The box top lines up with the email, but the artwork sits far
      below it. Sizing the box to the artwork puts the mountain on that line.

   2. The social icons are 50px circles whose glyphs are centred, so the
      circle hangs about 17px below the last line of the description opposite.
      Aligning the circle's baseline instead of its box closes that.
   -------------------------------------------------------------------------- */

.ak-native-footer-about .elementor-widget-image img{
  height:auto!important;
  max-width:150px;
  display:block;
}
/* The widget wrapper kept the old 150px square, leaving 80px of dead space
   under the artwork and making the whole footer taller than it needs to be. */
.ak-native-footer-about .elementor-widget-image,
.ak-native-footer-about .elementor-widget-image .elementor-widget-container,
.ak-native-footer-about .elementor-widget-image figure,
.ak-native-footer-about .elementor-widget-image .elementor-image{
  height:auto!important;
  line-height:0;
}
.ak-native-footer-about .elementor-widget-image{
  /* Enough air to separate the mark from the paragraph, without the 80px
     of dead space the fixed square used to add. */
  margin-bottom:28px!important;
}
/* The circles are 50px tall but their glyphs are centred, so aligning the
   widget box leaves them hanging below the text opposite. Shifting the row
   itself up by the overhang puts the circle bottoms on the text baseline
   without changing the height of the column. */
.ak-native-footer-social .elementor-social-icons-wrapper{
  position:relative;
  top:-17px;
}
@media(max-width:1024px){
  /* Stacked layout has nothing to align against. */
  .ak-native-footer-social .elementor-social-icons-wrapper{
    top:0;
  }
}

/* --- Feature blocks as a vertical stack ------------------------------------
   The client asked to drop the chessboard layout: every block now reads top
   to bottom in one column — number, heading, description, a row of three
   photos, then the link. The photo row is 50/25/25 so the lead image carries
   the block and the two supporting shots fill the line.
   -------------------------------------------------------------------------- */

.ak-native-stack{
  padding:36px 0 58px;
  background:#ffffff;
}
.ak-native-stack:nth-of-type(even){
  background:#f6f3ed;
}
.ak-native-stack > .elementor-container{
  max-width:1560px;
  margin:0 auto;
  padding:0 40px;
}
.ak-native-stack-column > .elementor-widget-wrap{
  display:block;
}

/* Copy above the photographs. */
.ak-native-stack .ak-native-eyebrow{
  margin-bottom:14px!important;
}
.ak-native-stack .ak-native-section-title{
  margin-bottom:18px!important;
}
.ak-native-stack .ak-native-body{
  /* The copy now spans the same measure as the photographs below it. */
  max-width:none;
  margin-bottom:38px!important;
}
/* .ak-native-body p caps every paragraph at 56ch; inside a stack the
   paragraph follows its container instead. */
.ak-native-stack .ak-native-body p,
.ak-native-stack .ak-native-eyebrow p,
.ak-native-stack .ak-native-section-title{
  max-width:none;
}

/* The photo row. */
.ak-native-stack-photos{
  width:100%;
  margin:0 0 30px;
}
.ak-native-stack-photos > .elementor-container{
  display:flex;
  align-items:stretch;
  gap:24px;
  max-width:none;
  padding:0;
}
.ak-native-stack-photo{
  min-width:0;
}
.ak-native-stack-photo > .elementor-widget-wrap{
  padding:0!important;
  height:100%;
}
.ak-native-stack-photo .elementor-widget-image,
.ak-native-stack-photo .elementor-widget-image .elementor-widget-container{
  height:100%;
  margin:0!important;
}
.ak-native-stack-image img{
  /* The images still carry ak-native-feature-image from the old layout, whose
     min-height:clamp(280px,34vw,520px) was winning and forcing ~490px rows. */
  display:block;
  width:100%;
  height:340px!important;
  min-height:0!important;
  max-height:340px!important;
  object-fit:cover;
}
/* The column stretch was overriding the height, so the row ran ~490px tall
   and each block dominated the screen. */
.ak-native-stack-photos > .elementor-container{
  align-items:flex-start;
}
.ak-native-stack-photo > .elementor-widget-wrap,
.ak-native-stack-photo .elementor-widget-image,
.ak-native-stack-photo .elementor-widget-image .elementor-widget-container{
  height:auto!important;
}

/* The link sits under the photographs, as sketched. */
.ak-native-stack .ak-native-text-button{
  margin:0!important;
}
.ak-native-stack .ak-native-text-button .elementor-button{
  font-size:13px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}

@media(max-width:1024px){
  .ak-native-stack{
    padding:28px 0 44px;
  }
  .ak-native-stack > .elementor-container{
    padding:0 28px;
  }
  .ak-native-stack-image img{
    height:240px!important;
    max-height:240px!important;
  }
}

@media(max-width:767px){
  .ak-native-stack{
    padding:22px 0 34px;
  }
  .ak-native-stack > .elementor-container{
    padding:0 20px;
  }
  /* Stacked: the lead photo stays, the two supporting shots sit side by side. */
  .ak-native-stack-photos > .elementor-container{
    flex-wrap:wrap;
    gap:14px;
  }
  /* Elementor sets column widths inline, so these need to win explicitly. */
  .ak-native-stack-photos > .elementor-container > .elementor-column:first-child{
    width:100%!important;
    flex:0 0 100%!important;
  }
  .ak-native-stack-photos > .elementor-container > .elementor-column:not(:first-child){
    width:calc(50% - 7px)!important;
    flex:0 0 calc(50% - 7px)!important;
  }
  .ak-native-stack-image img{
    height:200px!important;
    max-height:200px!important;
  }
}

/* --- Alternating section backgrounds ---------------------------------------
   The copy column paints its own cream panel, which hid the white background
   the client asked for on the first of the two closing blocks. Where the
   section itself is white, the column stays transparent so the section shows.
   -------------------------------------------------------------------------- */
.ak-native-feature-on-white .ak-native-feature-copy{
  background:transparent!important;
}

/* --- Privacy policy pages ---------------------------------------------------
   These four pages use the theme's default template, which paints a sky
   gradient on the body. A legal document reads better on plain white.
   -------------------------------------------------------------------------- */
body.page-id-2783,
body.page-id-2784,
body.page-id-2785,
body.page-id-2786{
  background:#ffffff!important;
}
body.page-id-2783 #page_content_wrapper,
body.page-id-2784 #page_content_wrapper,
body.page-id-2785 #page_content_wrapper,
body.page-id-2786 #page_content_wrapper{
  max-width:900px;
  margin:0 auto;
  padding:20px 24px 80px;
}

/* --- Full-width copy blocks (client items 7, 8, 9) --------------------------
   The client asked for the intro copy to run as wide as the widget beneath it
   instead of sitting in a narrow left-hand column, and for bullet lists to
   split into two columns without losing any items.

   The cause of the narrow copy was `.ak-native-body p{max-width:56ch}`, which
   capped every paragraph at ~484px no matter how wide its container was. On
   the Events pages the column had already been widened, but that cap remained,
   which is why the right half of the screen sat empty.

   Bullets are split with column-count rather than by rewriting the list, so
   the markup stays a single editable widget and no item can be dropped.
   -------------------------------------------------------------------------- */

/* Copy fills its column everywhere the narrow layout is used. */
.ak-native-narrow .ak-native-body p,
.ak-native-narrow .ak-native-hero-lead p,
.ak-native-narrow .ak-native-eyebrow p{
  max-width:none;
}

/* Landing pages: match the gallery below (1180px content width). */
.ak-native-narrow-column{
  max-width:1180px;
}

/* Bullet lists run in two columns, balanced, with no item broken across them. */
.ak-native-checklist ul{
  column-count:2;
  column-gap:56px;
}
.ak-native-checklist li{
  break-inside:avoid;
  -webkit-column-break-inside:avoid;
  page-break-inside:avoid;
}

/* The proposal form column is sized to the form itself; keep it as it is and
   only let the copy above the fields use the full width. */
.ak-native-narrow-column:has(.ak-native-form),
.ak-native-narrow-column:has(.wpcf7){
  max-width:980px;
}

/* Events overview: the copy matches the three-image row underneath (1140px). */
body:is(.page-id-4026,.page-id-4006,.page-id-4046,.page-id-4066) .ak-native-narrow-column{
  width:auto!important;
  max-width:1240px!important;
}

@media(max-width:1024px){
  /* One column of bullets once the layout narrows — two would be cramped. */
  .ak-native-checklist ul{
    column-count:1;
  }
}

/* --- Event cards sized like the ones on the home page ----------------------
   The client pointed at the home page grid as the reference: bigger cards,
   taller photographs, larger titles. Only the card treatment is copied —
   the home page's gradient background is deliberately left behind, as the
   Events section keeps its own cream backdrop.
   -------------------------------------------------------------------------- */

.ak-native-card-row > .elementor-container{
  gap:26px;
}

/* A visible edge, as on the home page. */
.ak-native-card{
  border:1px solid var(--ak-native-line,rgba(34,39,37,.13));
}

/* Photographs match the reference height. */
.ak-native-card-image img{
  height:310px;
}

/* Roomier interior: larger heading, wider gutters. */
.ak-native-card .ak-native-card-title{
  padding:28px 30px 0;
}
.ak-native-card .ak-native-card-title .elementor-heading-title{
  font-size:22px;
  letter-spacing:.12em;
}
.ak-native-card-text{
  padding:14px 30px 0;
}
.ak-native-card-text p{
  font-size:15px;
}
.ak-native-card .ak-native-text-button{
  padding:20px 30px 30px;
}

@media(max-width:1024px){
  .ak-native-card-image img{
    height:260px;
  }
  .ak-native-card .ak-native-card-title .elementor-heading-title{
    font-size:19px;
  }
}

@media(max-width:767px){
  .ak-native-card-image img{
    height:220px;
  }
  .ak-native-card .ak-native-card-title{
    padding:22px 24px 0;
  }
  .ak-native-card-text,
  .ak-native-card .ak-native-text-button{
    padding-left:24px;
    padding-right:24px;
  }
}

/* --- Footer: breathing room above the contact block ------------------------
   Requested by the client: the email and address should sit lower, clear of
   the logo opposite. */
.ak-native-footer-contact{
  margin-top:30px!important;
}

/* --- Card grid: full width, and the link styled like the home page ---------
   Two corrections to the previous pass.

   1. The grid kept a 1400px cap while the copy above it runs to 1240px on a
      wide screen, so the cards read as inset with dead space either side.
      The row now follows the same measure as everything else on the page.

   2. "Learn more" on the home page is uppercase 13px/600 with a light letter
      spacing and no underline; the Events cards had wide tracking and a rule
      beneath. Matched to the reference.
   -------------------------------------------------------------------------- */

.ak-native-card-row > .elementor-container{
  max-width:none;
  /* Matches the home page's event row so the two grids agree at every width. */
  padding-left:7vw;
  padding-right:7vw;
}
@media(max-width:767px){
  .ak-native-card-row > .elementor-container{
    padding-left:24px;
    padding-right:24px;
  }
}

.ak-native-card .ak-native-text-button .elementor-button{
  font-size:13px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  border-bottom:0;
}

/* Cards share the row evenly instead of keeping a fixed 363px and leaving a
   gap at the end. Elementor sets the column width inline, so this has to be
   explicit. */
.ak-native-card-row > .elementor-container > .elementor-column{
  flex:1 1 0!important;
  width:auto!important;
  max-width:none!important;
}
@media(max-width:1024px){
  .ak-native-card-row > .elementor-container > .elementor-column{
    flex:0 0 calc(50% - 13px)!important;
  }
}
@media(max-width:767px){
  .ak-native-card-row > .elementor-container > .elementor-column{
    flex:0 0 100%!important;
  }
}

/* The final row holds two cards, not three. Letting them flex-grow stretched
   each to 803px, so that row looked nothing like the ones above it. Cards keep
   a third of the row and the short row simply ends early. */
.ak-native-card-row > .elementor-container > .elementor-column{
  flex:0 0 calc((100% - 52px) / 3)!important;
}
@media(max-width:1024px){
  .ak-native-card-row > .elementor-container > .elementor-column{
    flex:0 0 calc((100% - 26px) / 2)!important;
  }
}
@media(max-width:767px){
  .ak-native-card-row > .elementor-container > .elementor-column{
    flex:0 0 100%!important;
  }
}


/* --- Blog archives, rendered by the theme rather than Elementor -------------
   Two leftovers from Hoteller's own post styling that the client asked to drop.
   The theme's files are not edited directly, so both are switched off here and
   survive a theme update.
   -------------------------------------------------------------------------- */

/* The thumbnail hover: the theme fades the photograph to 30% over a dark
   gradient and crosses two white rules over it. Elementor cards elsewhere on
   the site leave their photographs alone, so these do too. */
.post_img_hover:not(.lazy){
  background:none;
}
.post_img_hover:hover img,
.post_img_hover.hover img{
  opacity:1;
}
.post_img_hover:before,
.post_img_hover:after,
.post_img_hover:hover:before,
.post_img_hover:hover:after,
.post_img_hover.hover:before,
.post_img_hover.hover:after{
  content:none;
  display:none;
}

/* The sidebar column on category archives holds no widgets — it renders as an
   empty panel beside the posts. The list takes the full measure instead. */
.archive .sidebar,
.category .sidebar{
  display:none;
}
.archive .sidebar_content,
.category .sidebar_content{
  width:100%!important;
  max-width:780px;
  margin-left:auto!important;
  margin-right:auto!important;
  float:none!important;
}

/* --- Cases archive ----------------------------------------------------------
   The grid matches the Insights list: two columns, photograph, title, date,
   excerpt, link. Two adjustments the client asked for.
   -------------------------------------------------------------------------- */

/* Photographs shorter still, per a third pass: 41% becomes 36%. Width is
   unchanged. */
.ak-native-cases .elementor-post__thumbnail{
  padding-bottom:32%!important;
}

/* The thumbnail link carried the old spacing between photo and text; the
   text block's own padding now does that job instead. */
.ak-native-cases .elementor-post__thumbnail__link{
  margin-bottom:0!important;
}

/* Tighter text block, closer to the reference the client sent. */
.ak-native-cases .elementor-post__text{
  padding:0!important;
}

/* The Read More link is dropped — the photo and title carry the click
   instead (both are already wrapped in <a> by the widget). */
.ak-native-cases .elementor-post__read-more{
  display:none!important;
}

/* Tighter spacing between the title block and the excerpt. */
.ak-native-cases .elementor-post__meta-data{
  margin-bottom:6px!important;
}
.ak-native-cases .elementor-post__excerpt{
  margin-bottom:0!important;
}

/* Twice the air between cards, both directions. */
.ak-native-cases .elementor-posts-container{
  column-gap:60px!important;
  row-gap:68px!important;
}